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内容的组件 |
- 我的微信
- 一起交流技术
- 我的微信公众号
- 一起交流技术