文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

iOS开发常用之网络

该项目通过三种形式展示页面之间的切换，比如导航栏上的多个选项卡切换，页面左右两端箭头指示切换，以及使用分段控件。...TextProgress - 自定义实现数字进度条：1，可以自定义数字（0-100），填充的比例为当前设置的数字，2，可以实现自定义填充颜色，上下部分都可以，3，可以自定义边界的颜色4，实现了水波动画...NVActivityIndi​​catorView - 加载进度条动画，有20-30多种，是在此DGActivityIndi​​catorView 基础上做得修改。...VJDeviceSpecificMedia - 如何根据设备选择不同尺寸的图片 可以通过设置不同尺寸的设备的LaunchImage，来使用App适配这些设备，要在不同尺寸设备上使用不同大小的图片，则需要在代码中一一判断...消失时还带有消失效果动画。 GiftCard-iOS - 礼品卡购买的炫酷动画。 SDCycleScrollView - 无限循环自动图片轮播器（一步设置即可使用）。

23.7K10

腾讯开源超实用的UI轮子库，我是轮子搬运工

功能列表 QMUIAnimationListView 使 ListView 支持添加/删除 Item 的动画，支持自定义动画效果。...可以通过 xml 属性修改进度背景色，当前进度颜色，进度条尺寸。 支持限制进度的最大值。 QMUIPullRefreshLayout 下拉刷新控件。...每个 Tab 都可以非常灵活的配置，内容上支持文字和 icon 的显示，icon 支持选中态，支持内容的排版对齐方向设置，支持显示红点，支持插入自定义的 View，支持监听双击事件等。...QMUIAlignMiddleImageSpan 继承自 ImageSpan，在此基础上实现让 span 垂直居中的效果。...QMUIMarginImageSpan 继承自 QMUIMarginImageSpan，在此基础上支持设置图片的左右间距。 QMUITextSizeSpan 支持调整字体大小的 span。

4.8K30
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    React Native 常用的 15 个库

    React Native Animatable ? 这个库非常适合快速地向 React Native 应用程序添加简单的动画和转换。这个库有两种使用方式:声明式和命令式。...声明式用法只需使用动画的名称，该动画将在加载该元素时立即生效。打开页面时，标题应该从左边滑进去。 如果你想手动播放动画，这个wgy命令式用法就很好用。当有人喜欢某个帖子时，摇动一个心形图标。...React Native Progress 在应用程序中，显示加载或任何其他操作的进度是很重要的。这个库通过支持5个不同的组件，如线性进度条、圆形、饼状图等，可以很容易地显示进度。 实际案例 ?...当然，这不是React Native 的特定问题。 当存在高分辨率图像时，内存问题在 Android 上很常见。 5....这个库帮助我使用一个非常简单的声明性API快速实现导航。 它维护一堆路线并从应用程序中的任何场景导航到任何场景就像调用函数一样简单。 它也支持选项卡式导航，侧边栏和模态框。

    5.9K31

    用最少的代码却实现了最牛逼的滚动动画！

    今天小师妹带领大家学习如何使用最少的代码创建令人叹为观止的滚动动画~ 在聊ScrollTrigger插件之前我们先简单了解下GSAP。...GreenSock 动画平台 （GSAP） 可为 JavaScript 可以操作的任何内容（CSS 属性、SVG、React、画布、通用对象等）动画化，并解决不同浏览器上存在的兼容问题，而且比 jQuery...我们需要知道ScrollTrigger是基于GSAP实现的插件，ScrollTrigger是处理滚动事件的，而真正处理动画是GSAP，二者组合使用才能实现滚动动画~ 插件特点 将任何动画链接到特定元素，...可以在进入/离开定义的区域或将其直接链接到滚动栏时在动画上执行操作（播放、暂停、恢复、重新启动、反转、完成、重置）。 延迟动画和滚动条之间的同步。 根据速度捕捉动画中的进度值。...在滚动记录器处于活动状态时，如将active类添加到触发元素中：toggleClass: "active" 使用 matchMedia() 标准媒体查询为各种屏幕尺寸创建不同的设置。

    2.7K20

    用最少的代码却实现了最牛逼的滚动动画！

    gzh：老鱼的储物柜今天老鱼带领大家学习如何使用最少的代码创建令人叹为观止的滚动动画~图片在聊ScrollTrigger插件之前我们先简单了解下GSAP。...GreenSock 动画平台 （GSAP） 可为 JavaScript 可以操作的任何内容（CSS 属性、SVG、React、画布、通用对象等）动画化，并解决不同浏览器上存在的兼容问题，而且比 jQuery...插件简介ScrollTrigger是基于GSAP实现的一款高性能页面滚动触发HTML元素动画的插件。通过ScrollTrigger使用最少的代码创建令人叹为观止的滚动动画。...可以在进入/离开定义的区域或将其直接链接到滚动栏时在动画上执行操作（播放、暂停、恢复、重新启动、反转、完成、重置）。延迟动画和滚动条之间的同步。根据速度捕捉动画中的进度值。...在滚动记录器处于活动状态时，如将active类添加到触发元素中：toggleClass: "active"使用 matchMedia() 标准媒体查询为各种屏幕尺寸创建不同的设置。

    3.1K00

    腾讯面试官：如何从0到1实现一个高性能Collapse折叠组件，直到现在我还实现不出来

    ，发出来问问大家，如果是你们，你们会如何思考 jcode 我们先从最基本的实现开始，然后逐步添加更多的功能，如手风琴模式、自定义箭头、禁用状态、隐藏时是否渲染DOM结构 组件接口定义 Collapse...[] - arrow 自定义箭头，如果是 ReactNode，那么 会自动为你增加旋转动画效果 ReactNode | ((active: boolean) => React.ReactNode) -...arrow：自定义的箭头。如果是一个React节点，将自动为你添加旋转动画效果。如果是一个函数，它将接收一个参数，表示面板是否被展开，并返回一个React节点。...arrow：这是一个自定义的箭头。如果这是一个React节点，antd-mobile将自动为你添加旋转动画效果。如果这是一个函数，它将接收一个参数，表示面板是否被展开，并返回一个React节点。...感觉不现实 使用FLIP技术添加动画优化？ 搜了一圈，更难实现？

    52420

    Lottie : 让动画如此简单

    /* * Lottie内部有两个缓存map（强引用缓存，弱引用缓存），在动画文件加载完成后会根据设置的缓存策略缓存动画，方便下次使用。...//第n层动画 ] 2.如何动起来 Lottie时序图： [1504855893605_6007_1504855893878.jpg] 利用属性动画控制进度，每次进度改变通知到每一层，触发LottieAnimationView...(1)利用属性动画计算进度 这里用到了属性动画来产生一个0～1的插值，根据不同的插值来设置当前动画进度。...如果使用lottie后，可以把效果导出到json动画文件里，客户端加载动画文件，循环设置进度，读取每帧画面，再和声音融合生成MV。...优势： 1.动画丰富 2.代码量少 3.可使用设计导出的字体 代码 animationView.setProgress(progress); //设置当前进度 animationView.buildDrawingCache

    29.4K136

    React Native 系列(八) -- 导航

    tintColor : 导航栏上按钮的颜色设置。 titleTextColor : 导航栏上字体的颜色 。 translucent : 导航栏是否是半透明的，true／false。...NavigatorIOS使用步骤 初始化路由 注意:component，需要传入组件，自定义组件 NavigatorIOS上的按钮图片，默认会被渲染成蓝色 NavigatorIOS上的按钮，只能放一张图片...title：标题，如果设置了这个导航栏和标签栏的title就会变成一样的，不推荐使用 header：可以设置一些导航的属性，如果隐藏顶部导航栏只要将这个属性设置为null headerTitle...none：无动画 cardStyle：自定义设置跳转效果 transitionConfig： 自定义设置滑动返回的配置 onTransitionStart：当转换动画即将开始时被调用的功能...可以发现，Navigator是不带导航栏的，需要自定义。

    6K80

    第三次重写个人网站，分享一些感想

    可以设置 left 和 right 的值来解决，但是 1px 又会产生心理上的不对称，所以我把宽度设置为 2px 就 OK 了，同时轴体看上去也更饱满。...然而 backgroud-attachment: fixed 在手机端是不能用的，会变成 cover 的样式，所以在手机端要设置为 initial 的值。...下面部分带有强烈主观色彩，不一定正确 我在主页里加入了很多入场动画，用到的库是 react-reveal。这个库的功能是：当滚动到当前元素时，使用动画入场效果展示元素。 很实用的一个库。...所以我改成直接展示 90% 的文字，只有最后的词语循环打印。...，本来是个做 Loading 动画的网站，后面也做 SVG 背景图了，里面更多自定义的模板，免费版只能生成静态的，付费版可生成动态 SVG 背景，同样的，免费版就够用了 优化 代码层面，用 React

    86820

    第三次重写个人网站，分享一些感想

    可以设置 left 和 right 的值来解决，但是 1px 又会产生心理上的不对称，所以我把宽度设置为 2px 就 OK 了，同时轴体看上去也更饱满。...然而 backgroud-attachment: fixed 在手机端是不能用的，会变成 cover 的样式，所以在手机端要设置为 initial 的值。...下面部分带有强烈主观色彩，不一定正确 我在主页里加入了很多入场动画，用到的库是 react- reveal。 这个库的功能是：当滚动到当前元素时，使用动画入场效果展示元素。 很实用的一个库。...颜色 颜色方面，国内的审美一般以 小清新 为主，而由于走了欧美的 粗犷 路线，所以颜色方面使用了重口味的颜色，以 红、黄、橙、黑 为主。 image.png 这里的颜色值都是比较相近的。...，本来是个做 Loading 动画的网站，后面也做 SVG 背景图了，里面更多自定义的模板，免费版只能生成静态的，付费版可生成动态 SVG 背景，同样的，免费版就够用了 优化 代码层面，用 React

    1K50

    React Native之常用第三方库

    前言 React Native出来一年多了，受到各大开发人员的喜爱，但是由于只是专注于View层的开发，因此在很多深层次上还需要结合原生app做一定的兼容，还有就是现在好多控件，如Android中已是系统的控件的...cancelButtonTitle: ‘Cancel‘, takePhotoButtonTitle: ‘Take Photo...‘, // 调取摄像头的按钮，可以设置为空使用户不可选择拍照...chooseFromLibraryButtonTitle: ‘Choose from Library...‘, // 调取相册的按钮，可以设置为空使用户不可选择相册照片 customButtons...https://github.com/zbtang/React-Native-TextInputLayout 聊天表情 地图 动画 加载动画 日历 可多选的Listview...动画 https://github.com/oblador/react-native-animatable 加载动画 https://github.com/maxs15/react-native-spinkit

    8.9K101

    5款 React 实时消息提示通知(MessageNotification)组件推荐与测评

    傻瓜式配置，10秒钟完成所有设置工作 可定制开发，简单便捷 可关闭滑动动画效果 可在提示框中嵌入 React 组件 可定义每个 toast 行为 有进度条显示 白天夜间模式自动切换 扩展阅读：《7 款顶级好用的...React 移动端 ui 组件库测评推荐》 React Hot Toast - 动效丰富、代码简洁、样式自定义、轻量级消息提示组件 图片 react-hot-toast 消息提示组件库，可配置自定义操作...CSS 效果易于自定义 轻量级 - 小于 5KB Promise API 支持 Emoji 表情 丰富的动画效果 扩展阅读：《6 款好用的 React table 表格组件测评推荐》 Notistack...Bootstrap 风，配置非常简单，简单改个布尔值就可以了。...扩展阅读：《React Echarts 使用教程 - 如何在 React 中加入图表》

    6K50

    超赞圆形动画进度条，爱了爱了(使用HTML、CSS和bootstrap框架)

    使用HTML和CSS的圆形动画进度条 使用HTML和CSS的圆形动画进度条 步骤1：创建进度栏的结构 步骤2：使用CSS代码设计圆形 步骤3：在进度栏中添加加载动画 步骤4：添加其他颜色以使加载动画更清晰...源码下载 在本文中，我将向您展示如何仅使用HTML、CSS和Boostrap框架创建圆形的动画进度条。...之前，我已经设计了更多类型的动画进度条，但是这种设计是采用完全现代的方式设计的。 动画圆形进度栏是一种统计设计，可用于各种网站。它主要用于指示个人在投资组合网站或个人网站中所占资格的百分比。...使用HTML和CSS的圆形动画进度条 我使用Html，CSS和bootstrap框架来实现它。对于此圆形进度条，您可以根据需要预先确定百分比。这意味着您可以预先确定此动画将停止的进度百分比。...在此程序中，网页上的三个条形具有不同的百分比，刷新页面时，圆形图将填充到基于百分比的位置。这些进度条可完全响应平板

    2.6K30

    《精通reactvue组件设计》之快速实现一个可定制的进度条组件

    ) 如果对于react/vue组件设计原理不熟悉的,可以参考我的上一篇文章: 《精通react/vue组件设计》之用纯css打造类materialUI的按钮点击动画并封装成react组件 正文 在开始组件设计之前希望大家对...上图可以知道封装后的进度条组件通过对外暴露的接口(react/vue里面可以看做props属性)可以很快的实现多个不同的表现和重用.我将会使用react带大家实现这个进度条组件, 大家不用担心技术栈不一样...上面的思维导图我们也知道了, 进度条组件的实现原理就是通过对外暴露一定的属性,使用css先画一个进度条, 最后通过属性和样式之间的调度来实现我们需求满满的进度条.至于如何画进度条,下面会详细介绍. 2...., 因为这个部分未来可能会做动画,所以我们把它做成离屏dom, 因为它只做展示,它的宽度完全由js控制,后面我们会将会看到. 2.2 实现组件外壳 我们根据我们收集到的需求, 可以对外暴露7个自定义属性...设置进度区间这个需求是组件唯一比较复杂的地方(相对来说,实际项目中有更复杂的案例),对应的属性为statusScope, 它的值为一个数组,之所以为数组是为了开发人员更容易理解和使用,它的值可能如下:

    1.2K40

    React Native开发之react-navigation库详解

    DrawerNavigator：用于实现侧边栏抽屉页面的导航组件。 需要说明的是，由于react-navigation在3.x版本进行了较大的升级，所以在使用方式上与2.x版本会有很多的不同。...headerTitle：设置导航栏标题。 headerBackImage：设置后退按钮的自定义图片。 headerBackTitle：设置跳转页面左侧返回箭头后面的文字，默认是上一个页面的标题。...headerBackTitleStyle：设置导航栏上【返回】文字的样式。 headerLeftContainerStyle：自定义导航栏左侧组件容器的样式，例如增加padding值。...headerRightContainerStyle：自定义导航栏右侧组件容器的样式，例如增加 padding值。...headerTitleContainerStyle：自定义 导航栏标题组件容器的样式，例如增加 padding值。 headerTintColor：设置导航栏的颜色。

    5.8K10

    华为鸿蒙 HarmonyOS 开发资料全面汇总

    动画 ProgressWheel_ohos - 基于开源项目 ProgressWheel 的鸿蒙化移植开发，可以实现自定义环形进度条的功能，支持环形进度条的旋转、进度增加、文本设置。...discreteSeekBar - 动画气泡指示当前滑动值。 materialish-progress - 一个 material 风格的滚动式进度条(progress wheel)。...您可以设置滑动方向，例如左，上，右和下。...material-dialogs - 它具有几乎所有带有多个测试用例的 UI 组件，其中包括带有文本，图像，按钮，ListContainer 项目，调色板，自定义视图和进度栏的对话框。...该库提供了一种使用颜色值为系统栏创建背景“色调”的简单方法。 lock-screen - 简单漂亮的锁屏库可设置检查密码。使用锁屏库轻松保护您的应用程序，就像启动意图一样简单。

    3.3K40

    微信小程序开发小技巧合揖（53个）

    微信小程序：wx.navigateTo中url无法跳转问:链接 微信小程序布局之行内元素和块级元素:链接 小程序端JS加密，传输PHP端解密:链接 小程序开发干货技巧：如何为你的微信小程序:链接 Flask...下拉菜单(带动画)实现:链接 小程序request接口的封装，实现给循环列表:链接 微信小程序-文字跑马灯效果:链接 javascript时间戳和日期字符串相互转换(也:链接 微信小程序wx.showToast...，请求接口轮播图:链接 微信小程序左滑删除效果:链接 github精选：微信小程序滚动动画，点击事件:链接 微信小程序使用mock.js提供模拟数据，提示:链接 微信小程序之 满意度（五星评分）:链接...杂项：自定义弹窗，开发小技巧，使用一像素:链接 图片等比例缩放 动态的获取图片的高度和宽:链接 微信小程序 实时圆形进度条实现:链接 关于上拉加载，下拉更新的问题踩的坑！...选项卡，简易table表格，swip:链接 小程序一次性上传多个本地图片，上拉加载照:链接 自定义swiper面板指示点的样式，image图片:链接 微信小程序 使用view，scroll-view实现上拉

    3K101

    react-navigation，刷新你的导航一、属性介绍二、案例

    title:标题，如果设置了该属性，导航栏和标签栏的title就会变成一样。...故不建议使用 header:设置一些导航的属性，若想要隐藏顶部导航栏则只需要把这个属性设置为null headerTitle:设置导航栏标题 headerBackTitle:设置跳转页面左侧返回箭头后面的文字...:自定义设置跳转效果 transitionConfig:自定义设置滑动返回的配置 onTransitionStart:当转换动画即将被调用的功能 onTransitionEnd:当转换动画完成时被调用的功能...:和导航的功能一样，对应界面名称，可以在气头页面通过这个screen传值和跳转 navigationOptions:配置TabNavigator的一些属性 title:标题，会同时设置导航条和标签栏的title...需要给每一项都设置 tabBarLabel:设置标签栏的title 以下属性配合导航使用 tabBarPosition:设置tabBar的位置，属性值为top和bottom。

    19.7K90

    基于 HTML5 + Canvas 实现的 PID 可视化系统

    本篇文章通过搭建危险废物进料系统的 2D 场景以及数据界面展示，帮助我们了解如何使用 HT 实现一个可视化的 PID 控制进料系统。 　　...下面举第八个动画（循环水流动）为例来理解 ht 内置动画效果： 1 //循环水流动 2 function animation() { 3 var lineJson = {}; 4...关键的还是功能性组件，图标展示显示界面，功能性组件支持事件的触发，首先在控件里面拉取 slider 图标，然后到组件栏拉取 slider 组件，设置控件的最大值、最小值和默认值等一系列参数。 ? 　　...可以得知我们即将改变的值有两个，一个是 slider ，一个是文本的值，默认20，我们给这两个 Data 对象绑定唯一标签，分别为 sliderValue 以及 textValue，先通过进度条的当前值改变文本的值...当然也可以自定义多个 slider 分别控制不同的动画，具体如何实现还是全凭需求而定。

    1.5K20
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券