美文网首页
[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