%20(2).svg)
项目简介
本项目是基于 React Native 框架开发的多功能应用模板，在官方 react-native init AwesomeProject 生成的项目基础上进行扩展。集成了 mobx 用于状态管理、react-native-router-flux 进行路由管理、react-native-root-toast 实现弹窗功能，还集成了图片选择、拍照和通用 ActionSheet 等插件。
项目的主要特性和功能
- 采用 mobx 实现高效状态管理，方便组件间数据共享与更新。
- 利用 react-native-router-flux 灵活管理页面路由，简化页面切换操作。
- 通过 react-native-root-toast 提供友好的弹窗提示，增强用户体验。
- 集成图片选择与拍照功能，满足用户上传图片的需求。
- 具备通用的 ActionSheet 组件，同时适配安卓和 iOS 系统。
安装使用步骤
安装依赖
- 下载并解压项目源码文件。
- 打开终端，进入项目根目录，运行命令
npm install或yarn install来安装项目依赖。
运行项目
安卓平台
运行 react-native run-android 命令进行编译和安装。
iOS 平台
使用 Xcode 打开项目文件夹中的 ios 文件夹，然后进行编译和运行。
常见问题解决
Android 9 无法联网
在 res 下新建一个 xml 目录，创建名为 network_security_config.xml 文件，内容如下： ```xml
``
然后在 AndroidManifest.xml 的 application 标签内添加android:networkSecurityConfig="@xml/network_security_config"`。
支持 GIF 和 WebP 格式图片
在 android/app/build.gradle 文件的 dependencies 中按需添加以下模块： ``` dependencies { // 如果你需要支持Android4.0(API level 14)之前的版本 implementation 'com.facebook.fresco:animated-base-support:1.3.0'
// 如果你需要支持GIF动图 implementation 'com.facebook.fresco:animated-gif:2.0.0'
// 如果你需要支持WebP格式，包括WebP动图 implementation 'com.facebook.fresco:animated-webp:2.1.0' implementation 'com.facebook.fresco:webpsupport:2.0.0'
// 如果只需要支持WebP格式而不需要动图 implementation 'com.facebook.fresco:webpsupport:2.0.0' } ```
FlatList/ScrollView 中 margin 不生效
给 FlatList/ScrollView 组件添加 contentContainerStyle={{paddingBottom:xxx}}。
mobx 数据不响应
检查是否给组件添加 @observer，渲染 mobx 数据的下级组件也需添加。
插件集成配置
图片选择与拍照
<key>NSCameraUsageDescription</key>
<string>需要访问相机</string>
<key>NSLocationWhenInUseUsageDescription</key>
<string>我们需要通过您的地理位置信息获取您周边的相关数据</string>
<key>NSPhotoLibraryAddUsageDescription</key>
<string>请求保存图片到相册</string>
<key>NSPhotoLibraryUsageDescription</key>
<string>请允许访问相册以选取照片</string>
关于打包
初始化项目
使用命令 react-native init cy[projectname] 初始化项目。
生成正式版证书
使用命令 keytool -genkeypair -v -keystore cydemo.keystore -alias cydemo -keyalg RSA -keysize 2048 -validity 10000 生成证书，口令为 123456。将 C:\Program Files\Java\jdk1.8.0_211\bin\cydemo.keystore 复制到 /cydemo/android/app/ 下。
打包命令
运行 react-native run-android 进行打包。
重命名 release 包名
修改 app/build.gradle，找到 variant.outputs.each，在遍历的 {} 最底部增加：
// 重命名包名
def date = new Date()
def applicationName = '这里填项目名'
def formattedDate = date.format('yyyyMMdd-HHmmss')
// applicationId 和版本定义在上面 defaultConfig
output.outputFileName = "${applicationName}_v${versionName}_${formattedDate}.apk"
许可证
本项目采用 MIT 开源协议。
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】