React-Native-Demo 是基于 react-native 官方文档,把文档所列出的基础组件(简洁、易用、高效)和 API 实现一遍,并以演示的形式呈现出来。
-
目的是为了直观的熟悉官方提供了哪些能力,使之更熟悉 react-native,为开发做好充分的准备。
-
将持续更新,保持和英文文档进度一致;另还将收录一些第三方库和项目沉淀的一些组件,若有任何问题欢迎交流讨论。
-
具体参见项目
演示图例
<details>
<summary> 查看更多图例 </summary>
</details>
通过下面的二维码,可以在手机中安装体验 React-Native-Demo:
二维码 | 描述 | |
---|---|---|
Android | reactNativeDemo.apk | |
IOS | … | ???? |
注:微信等扫码跳转,在浏览器打开允许下载即可。
第三方框架及开发环境
-
开发环境:
- macOS 10.14.3
- node “v8.8.0”
- react-native-cli “2.0.1”
- Android Studio “3.2”
- Xcode “10.2.1”
-
第三方框架
- [react-native(0.59.4)]()
- [react-native-fs]()
- [react-native-vector-icons]()
- [react-native-webview]()
- [react-navigation]()
更新进度
-
基础组件
- [x] View
- [x] Text
- [x] TextInput
- [x] Button
- [x] Image
- [x] ImageBackground
- [x] Slider
- [x] Switch
-
通用组件
- [x] ActivityIndicator
- [x] ScrollView
- [x] FlatList
- [x] SectionList
- [x] Modal
- [x] Picker
- [x] StatusBar
- [x] ViewPagerAndroid
- [x] TouchableHighlight
- [x] TouchableOpacity
- [x] TouchableWithoutFeedback
-
Component – Android
- [x] DrawerLayoutAndroid
- [x] ProgressBarAndroid
- [] ToolbarAndroid
-
Component – IOS
- [x] DatePickerIOS
- [x] MaskedViewIOS
- [x] PickerIOS
- [x] ProgressViewIOS
- [x] SegmentedControlIOS
- [] SafeAreaView
- [] SnapshotViewIOS
-
API – 交互
- [x] Alert
- [x] AccessibilityInfo
- [x] AppState
- [x] ToastAndroid
- [x] CameraRoll
- [x] Clipboard
- [x] Dimensions
- [x] DatePickerAndroid
- [] Geolocation
- [] AsyncStorage
- [x] ActionSheetIOS
- [] AppRegistry
- [] BackHandler
- [] ImageEditor
- [x] ImagePickerIOS
- [] ImageStore
- [] InteractionManager
- [] Keyboard
- [] Linking
- [] NetInfo
- [] PanResponder
- [x] PermissionsAndroid
- [] Settings
- [x] Share
- [] Systrace
- [x] TimePickerAndroid
- [] Vibration
-
API – 布局
- [x] FlexBox
-
API – 动画
- [] Animated
- [] Easing
- [] LayoutAnimation
-
API – 样式
- [] ImageStyle
- [] PixelRatio
- [] Shadow
- [] StyleSheet
- [] TextStyle
- [] Transforms
- [] ViewStyle