React Native 组件和API

2019年1月7日19:10:09 Comment 556

React Native 组件和API

React Native 提供了一些内置的组件。下面有一个简单分类:

基础组件

交互控件

列表视图

iOS独有组件

Android独有组件

需要说明的是,不要局限在这些内置组件上。React Native 是大开源社区的作品,所以还可以在 github 或是 npm 上搜索到带有react native关键字的大量的第三方组件。

基础控件

大多数应用都会用到这里的基础控件

View
搭建用户界面的最基础组件
Text显示文本内容的组件
Image 显示图片内容的组件
TextInput 文本输入框
ScrollView 可以滚动容器视图
StyleSheet 提供类似CSS样式表的样式抽象层

交互控件

提供一些常见的跨平台的的交互控件

Button
一个简单的跨平台的按钮控件
Picker
在iOS和Android上调用各自原生的选择器控件
Slider
滑动数值选择器
Switch 开关控件

列表视图

和一般化用途的ScrollView不同,下面的列表组件智辉渲染当前屏幕可见的元素,这样有利于显示大量的数据

FlatList
高性能的滚动列表组件
SectionList 类似FlatList,但是多了分组显示

iOS 独有的组件和 API

下面很多组件都是对常用的 UIKit 类的封装

ActionSheetIOS
从设备底部弹出一个显示一个ActionSheet弹出框选项菜单或分享菜单
AlertIOS
弹出一个提示对话框,还可以带有输入框
DatePickerIOS
显示一个日期/时间选择器
ImagePickerIOS
插入图片
NavigatorIOS
UINavigationController的封装,用于实现页面的导航跳转
ProgressViewIOS
渲染一个UIProgressView进度条
PushNotificationIOS
管理推送通知,包括权限处理和应用角标数字
SegmentedControlIOS
渲染一个UISegmentedControl顶部选项卡布局
TabBarIOS 渲染一个UITabViewController底部选项卡布局。需要和TabBarIOS.Item搭配使用

Android 独有的组件和 API

下面很多组件提供了对 Andriod 常用类的封装

BackHandler
监听并处理设备上的返回按钮
DatePickerAndroid
打开日期选择器
DrawerLayoutAndroid
渲染一个DrawerLayout抽屉布局
PermissionsAndroid
对Android 6.0引入的权限模型的封装
ProgressBarAndroid
渲染一个ProgressBar进度条
TimePickerAndroid
打开时间选择器
ToastAndroid
弹出一个Toast提示框
ToolbarAndroid
在顶部渲染一个Toolbar工具栏
ViewPagerAndroid 可左右翻页滑动的视图容器

其他

下面的组件可能适用于一些特定场景

ActivityIndicator
显示一个圆形的正在加载的符号
Alert
弹出一个提示框,显示指定的标题和信息
Animated
易于使用和维护的动画库,可生成流畅而强大的动画
CameraRoll
访问本地相册
Clipboard
读写剪贴板内容
Dimensions
获取设备尺寸
KeyboardAvoidingView
一种视图容器,可以随键盘升起而自动移动
Linking
提供了一个通用的接口来调起其他应用或被其他应用调起
Modal
一种简单的覆盖全屏的模态视图
PixelRatio
可以获取设备的像素密度
RefreshControl
此组件用在ScrollView及其衍生组件的内部,用于添加下拉刷新的功能
StatusBar
用于控制应用顶部状态栏样式的组件
WebView 在原生视图中显示Web内容的组件
  • 我的微信
  • 一起交流技术
  • weinxin
  • 我的微信公众号
  • 一起交流技术
  • weinxin

Comment

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: