技术控

    今日:152| 主题:49194
收藏本版 (1)
最新软件应用技术尽在掌握

[其他] 基础篇章:关于 React Native之 ActivityIndicator 组件的讲解

[复制链接]
林深处 发表于 7 天前
84 2

立即注册CoLaBug.com会员,免费获得投稿人的专业资料,享用更多功能,玩转个人品牌!

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
今天我们讲解的这个控件的非常简单,那就是ActivityIndicator,它替代了我们之前所说的那个ProgressbarAndroid,功能就是和ProgressbarAndroid一样,显示一个正在加载的状况和进度。
  官网上是这么形容我的:显示一个圆形loading提示。我们直接看属性吧。
  属性

  
       
  • animating bool 是否要显示这个加载指示器,默认true是显示,false隐藏   
  • color 指示器圆圈的前景色,默认灰色   
  • size [ ‘small’, ‘large’ ] 指示器大小   
  • hidesWhenStopped bool ios独有 当没有加载动画的时候是否隐藏  
  实例展示

     由于太简单了,效果图也没什么,直接看吧,如下:
   
基础篇章:关于 React Native之 ActivityIndicator 组件的讲解-1 (loading,效果图,return,import,指示器)
    实例代码如下:
  [code]importReact, { Component }from'react';
import{
AppRegistry,
StyleSheet,
ActivityIndicator,
Text,
View
} from'react-native';

exportdefaultclassActivityIndicatorDemoextendsComponent{
render() {
return(

size="large"
color="#0000ff"
/>
style={{marginTop:30}}
size="small"
color="#ff00ff"
/>

);
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
});

AppRegistry.registerComponent('ActivityIndicatorDemo', () => ActivityIndicatorDemo);
[/code]
友荐云推荐




上一篇:forkp多进程程序管理库的轮子
下一篇:H5 的复制操作
酷辣虫提示酷辣虫禁止发表任何与中华人民共和国法律有抵触的内容!所有内容由用户发布,并不代表酷辣虫的观点,酷辣虫无法对用户发布内容真实性提供任何的保证,请自行验证并承担风险与后果。如您有版权、违规等问题,请通过"联系我们"或"违规举报"告知我们处理。

这个世界 发表于 5 天前
不要和地球人一般见识.
回复 支持 反对

使用道具 举报

胡梦玲 发表于 9 小时前
当你的眼泪忍不住要流出来的时候,睁大眼睛,千万别眨眼,你会看到世界由清晰到模糊的全过程
回复 支持 反对

使用道具 举报

*滑动验证:
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

我要投稿

推荐阅读

扫码访问 @iTTTTT瑞翔 的微博
回页顶回复上一篇下一篇回列表手机版
手机版/CoLaBug.com ( 粤ICP备05003221号 | 文网文[2010]257号 )|网站地图 酷辣虫

© 2001-2016 Comsenz Inc. Design: Dean. DiscuzFans.

返回顶部 返回列表