美文网首页
[React-Native]RN组件学习-Progressbar

[React-Native]RN组件学习-Progressbar

作者: 美乃滋酱啊 | 来源:发表于2016-08-19 15:43 被阅读118次
  • ProgressBarAndroid
<ProgressBarAndroid style={styles.progressBarStyle}
                                   styleAttr='Inverse'
                                   color='blue'>

                </ProgressBarAndroid>

                <ProgressBarAndroid styleAttr='LargeInverse'
                                    color='green'
                                    progress={0.4}>

                </ProgressBarAndroid>

                <ProgressBarAndroid styleAttr='Horizontal'
                                    color='green'
                                    progress={0.4}>

                </ProgressBarAndroid>

                <ProgressBarAndroid style={{marginTop: 10}}
                                    styleAttr='Horizontal'
                                    color='yellow'
                                    progress={0.4}
                                    indeterminate={false}>

                </ProgressBarAndroid>

就是这样:

progressBarAndroid

其中默认是转动着的,如果你希望是进度条样式的,则需要设置:

indeterminate={false}

就行了。

  • ActivityIndicator

官方说明:
Displays a circular loading indicator.

如果展示一个圆形的progress,官方推荐使用该控件

 <ActivityIndicator size='large'
                    color='purple'>
                    
 </ActivityIndicator>

其中支持设置sizecolor属性.

  • size: large或者small(默认

相关文章

网友评论

      本文标题:[React-Native]RN组件学习-Progressbar

      本文链接:https://www.haomeiwen.com/subject/hfmbsttx.html