/**
* Sample React Native App
* https://github.com/facebook/react-native
*/
'use strict';
import React, {
AppRegistry,
Component,
StyleSheet,
Text,
View,
ProgressBarAndroid
} from 'react-native'; class MyProject2 extends Component {
render() {
return (
<View>
<Text>
ProgressBarAndroid控件实例
</Text>
<ProgressBarAndroid color="red" styleAttr="Inverse"/>
<ProgressBarAndroid color="green" styleAttr="Horizontal" progress={0.2}
indeterminate={false} style={{marginTop:10}}/>
<ProgressBarAndroid color="green" styleAttr="Horizontal"
indeterminate={true} style={{marginTop:10}}/>
<ProgressBarAndroid color="black" styleAttr="SmallInverse"
style={{marginTop:10}}/>
<ProgressBarAndroid styleAttr="LargeInverse" style={{marginTop:10}}/>
</View>
);
}
}
AppRegistry.registerComponent('MyProject2', () => MyProject2);

一.ProgressBarAndroid

  1.该组件是React封装了Android平台的ProgressBar控件,用于显示APP中的内容加载过程中的进度信息

  2.属性:

    (1)支持View控件的属性方法(这些属性是从View控件中继承下来,例如:大小,布局,边距)

    (2)color:设置进度条的颜色属性

    (3)indeterminate:设置是否要显示一个默认的进度信息,如果styleAttr风格设置成Horizontal的时候改值必须设置成false

    (4)progress(number):设置当前的加载进度值(该值在0-1之间)

    (5)styleAttr:进度条框的风格,可以取值如下:

      Horizontal

      Small

      Large

      Inverse

      SmallInverse

      LargeInverse

RN控件之ProgressBarAndroid进度条的更多相关文章

  1. 【React Native开发】React Native控件之ProgressBarAndroid进度条解说(12)

    ),React Native技术交流4群(458982758).请不要反复加群! 欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文 ...

  2. C# 时间控件 竖直进度条 饼图显示 仪表盘 按钮基础控件库

    Prepare 本文将使用一个NuGet公开的组件来实现一些特殊的控件显示,方便大家进行快速的开发系统. 在Visual Studio 中的NuGet管理器中可以下载安装,也可以直接在NuGet控制台 ...

  3. CListCtrl控件中显示进度条

    CListCtrl控件的subitem中显示进度条 http://www.codeproject.com/Articles/6813/List-Control-Extended-for-Progres ...

  4. [Xcode 实际操作]四、常用控件-(12)环形进度条控件的使用

    目录:[Swift]Xcode实际操作 本文将演示环形进度条控件的使用. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit class Vi ...

  5. C#控件之:进度条(ProgressBar)

    一.重绘进度条 public class CustomProgressBar:ProgressBar { public CustomProgressBar() { this.SetStyle(Cont ...

  6. 四、Socket之UDP异步传输文件-用控件显示文件传输进度

    上一篇文章三.Socket之UDP异步传输文件中,实现了多文件的传输和MD5校验,还显示了文件传输过程中的信息,在这一篇文章中,将介绍怎样实现传输文件的进度显示和实现选择保存文件路径. 首先,来实现一 ...

  7. 通过ftp同步服务器文件:遍历文件夹所有文件(含子文件夹、进度条);简单http同步服务器文件实例

    该代码主要实现,指定ftp服务地址,遍历下载该地址下所有文件(含子文件夹下文件),并提供进度条显示:另外附带有通过http地址方式获取服务器文件的简单实例 废话不多说,直接上代码: 1.FTPHelp ...

  8. RN控件之DrawerLayoutAndroid导航栏

    /** * Sample React Native App * https://github.com/facebook/react-native */ 'use strict'; import Rea ...

  9. RN控件之View Text

    /** * 模仿美团首页部分 * */ 'use strict' import React,{ AppRegistry, Component, StyleSheet, Text, View, Imag ...

随机推荐

  1. STM32 ~ MDK环境下调试程序 HardFault_Handler 相关

    STM32出现HardFault_Handler故障的原因主要有两个方面: 1.内存溢出或者访问越界.这个需要自己写程序的时候规范代码,遇到了需要慢慢排查. 2.堆栈溢出.增加堆栈的大小. 出现问题时 ...

  2. ruby on rails 生产环境调试项目日志查看

    1.项目目录:log/production.log 2.nginx日志:/opt/nginx/logs 生产环境下做的任何更改都要重启服务器 重启 sudo kill $(cat /opt/nginx ...

  3. ThinkPHP 3.2.2 事务

    手册里说得非常清楚 : 5.3.19 事务支持 ThinkPHP提供了单数据库的事务支持,如果要在应用逻辑中使用事务,可以参考下面的方法: 启动事务: PHP代码 $User->startTra ...

  4. HDU - 1800 Flying to the Mars 【贪心】

    题目链接 http://acm.hdu.edu.cn/showproblem.php?pid=1800 题意 给出N个人的 level 然后 高的level 的 人 是可以携带 比他低level 的人 ...

  5. 每天一个Linux命令(32)date命令

          date命令是显示或设置系统时间与日期.        (1)用法:       用法:  date [选项]  [参数]       (2)功能:       功能:  根据指定格式显示 ...

  6. shell正则

    第五天 REGEXP:REGular EXPressionPattern: 正则表达式: Basic REGEXP:基本 Extended REGEXP:扩展 基本正则表达式: 字符匹配类:.: 任意 ...

  7. Fermat’s Chirstmas Theorem (素数打表的)

                                                                             Fermat’s Chirstmas Theorem ...

  8. ELK常用API使用方法

    以下ELK系列文章参考自http://www.tianyiqingci.com/ 总目录: Monitor API ElasticSearch聚合分析API Elasticsearch信息检索API ...

  9. html5制作坦克大战

    全部html5都采用绘图技术完成.坦克是画出来的.(坦克,子弹,墙,水,草坪) 首先我们画出坦克. 坦克是两边两个矩形,中间一个大矩形,矩形了有一个圆,还有一根线. 画出坦克的思路是以坦克的左上角为参 ...

  10. java:类集操作总结

    java:类集操作总结 1.List接口允许有重复的元素,Set接口中不允许有重复的元素 2.ArrayList,和Vector的区别 3.set依靠equals和hashCode区分 4.TreeS ...