React Native之进度条ProgressViewIOS的使用

import React,{Component}from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
ProgressViewIOS,
} from 'react-native';
class TabBarIOSDemo extends Component {
render() {
return (
<View>
<Text style={styles.welcome}>
ProgressViewIOS使用实例
</Text>
<ProgressViewIOS style={styles.progressView} progress={0.3}/>
<ProgressViewIOS style={styles.progressView} progressTintColor="purple" progress={0.2}/>
<ProgressViewIOS style={styles.progressView} progressTintColor="red" progress={0.4}/>
<ProgressViewIOS style={styles.progressView} progressTintColor="orange" progress={0.6}/>
<ProgressViewIOS style={styles.progressView} progressTintColor="yellow" progress={0.8}/>
</View>
);
}
}
const styles = StyleSheet.create({
welcome: {
fontSize: 20,
textAlign: 'center',
marginTop: 20,
},
progressView: {
marginTop: 20,
marginLeft:10,
marginRight:10,
}
});
AppRegistry.registerComponent('Allen', () => TabBarIOSDemo)
可以设定颜色,百分比,款式等
React Native之进度条ProgressViewIOS的使用的更多相关文章
- React Native自定义导航条
Navigator和NavigatorIOS 在开发中,需要实现多个界面的切换,这时候就需要一个导航控制器来进行各种效果的切换.在React Native中RN为我们提供了两个组件:Navigator ...
- react 实现圆环进度条
import React, { useState, useEffect } from "react" import { css } from "emotion" ...
- React Native专题
转载注明出处:地址:http://www.lcode.org本文出自:[江清清的技术专栏]本React Native讲解专题:主要讲解了React Native开发,由基础环境搭建配置入门,基础,进阶 ...
- React Native专题-江清清
本React Native讲解专题:主要讲解了React Native开发,由基础环境搭建配置入门,基础,进阶相关讲解. 刚创建的React Native交流8群:533435865 欢迎各位大牛, ...
- React Native 常用插件案例
(二).基础入门: 1.React Native For Android环境配置以及第一个实例 2.React Native开发IDE安装及配置 3.React Native应用设备运行(Runnin ...
- React Native开发技术周报2
(1).资讯 1.React Native 0.22_rc版本发布 添加了热自动重载功能 (2).技术文章 1.用 React Native 设计的第一个 iOS 应用 我们想为用户设计一款移动端的应 ...
- 【React Native开发】React Native控件之ProgressBarAndroid进度条解说(12)
),React Native技术交流4群(458982758).请不要反复加群! 欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文 ...
- react封装简单的浏览器顶部加载进度条全局组件
在项目中经常会有在请求前后加loading或者加加载进度条,一般这些组件都会抽离出来作为全局组件 进度条的插件貌似都不是很符合自己项目中的需求,于是.. 参考nprogress样式,自己在项目中封装组 ...
- Vue/React圆环进度条
数据展示,一直是各行各业乐此不疲的需求,具体到前端开发行业,则是各种各种图表数据展示,各种表格数据展示,烦不胜烦(繁不胜繁)! 前几天刚做了折线图.柱状图.饼状图之类的图表数据展示效果,今天又碰到了类 ...
随机推荐
- U盘安装win10操作系统
https://www.zhihu.com/question/39207359 1:进入微软官方网站,点击立即下载工具,下载完成mediacreationtool,双击打开,接受协议 https ...
- pip第三方模块
在安装好pip的情况下,在cmd窗口调用命令:pip install package -i --trusted-host http://pypi.douban.com/simple(这是豆瓣的源)
- 浙大 PAT 乙级 1001-1075 目录索引
1001. 害死人不偿命的(3n+1)猜想 1002. 写出这个数 1003. 我要通过! 1004. 成绩排名 1005. 继续(3n+1)猜想 1006. 换个格式输出整数 1007. 素数对猜想 ...
- Pycharm上python3运行unittest无法生成测试报告
原文地址https://www.cnblogs.com/yoyoketang/p/7523409.html 前言 经常有人在群里反馈,明明代码一样的啊,为什么别人的能出报告,我的出不了报告:为什么别人 ...
- 更高效的MergeSort--稍微优化
0. 简介 本文简要介绍一下比传统MergeSort更高效的算法,在原来的算法Merge基础上,少发生一半拷贝.欢迎探讨,感谢阅读. 原文链接如下:http://loverszhaokai.com/p ...
- System.arraycopy方法详解
- Ignite内存数据库与sql支持
Ignite采用h2作为内存数据库,支持h2的一切sql语法.如果是本地缓存或者复制缓存,sql执行直接在本地h2数据库中执行,如果是分区缓存,ignite则会分解sql到多个h2数据库执行后再汇总. ...
- 全局监听SCREEN_ON和SCREEN_OFF的替代方法--监听屏幕解锁事件
在做一个程序的时候,需要时刻保持某一服务是启动的,因此想到了通过监听屏幕SCREEN_ON和SCREEN_OFF这两个action.奇怪的是,这两个action只能通过代码的形式注册,才能被监听到,使 ...
- android 图片大小适配,如何在不同屏幕上适配图片,如何设置可以自适应不同分辨率?
android 图片大小适配,如何在不同屏幕上适配图片,如何设置可以自适应不同分辨率? Android为了适应不同的分辨率,需要将不同的图片放到不同的drawable目录下,分辨率的匹配规则如下:dr ...
- centos infiniband网卡安装配置
硬件:Mellanox InfiniBand,主要包括 HCA(主机通道适配器)和交换机两部分 软件:CentOS 6.4 MLNX_OFED_LINUX-2.1-1.0.0-rhel6.4-x86_ ...