很干货,所以转载的大神文章,React Native 状态栏优化(刘海屏适配、沉浸式、启动页全屏)
所以app启动页不能干扰mainActivity的加载。app启动页一般方法就是在mainActivity上创建一个全屏的dialog,页面加载完成后关闭该dialog。下面介绍在react-native中加入app启动页的方法。 首先创建一个dialog的全屏样式,在styles.xml中添加: <itemname="android:windowFullscreen">true</item><itemname="android:windowNoTi...
我们可以通过为 React Native Android 应用添加启动屏的方式,来解决启动白屏的问题。我在《React Native ...
app启动页一般方法就是在mainActivity上创建一个全屏的dialog,页面加载完成后关闭该dialog。下面介绍在react-native中加入app启动页的方法。 首先创建一个dialog的全屏样式,在styles.xml中添加: <itemname="android:windowFullscreen">true</item><itemname="android:windowNoTitle">true</item> 然后创建一个dialog内部...
查看react-native-splash-screen源码, 发现启动页是通过dialog实现的. Android dialog在刘海屏上全屏就会出现此类情况. 在node_modules\react-native-splash-screen\android\src\main\java\org\devio\rn\splashscreen\SplashScreen.java line:36 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) { Window ...
这样设置完成后,启动时确实没有白屏了,但是有一个问题,我们在启动时的背景是全屏,没有标题栏,但是当react-native-splash-screen的背景启动时,就会出现标题栏,这时候图片就会有一个向下的位移,要解决这个问题,需要改下react-native-splash-screen的源码。
npx react-native link react-native-splash-screen 1. 在项目目录android/app/build.gradle文件中,将:react-native-splash-screen项目添加为编译时依赖项: dependencies { implementation project(':react-native-splash-screen') ... } 1. 2. 3. 4. ...
React Native中实现端对端加密聊天,如何优化图片视频解密与存储? 想请教一个react native做聊天app的思路,现在打算做的是一个端对端加密聊天应用,数据库使用的是realm。我有一个对话页面和许多message组件,每次进入对话页面时我把每个message 的item传入message组件中,但是这样的话每次重新进入聊天页面,当message为图片或...
2.设置启动图片来源 此处忽略不记录了,之前已经记录过了 然后就是在react-native 中使用了,在需要关闭的地方关闭启动页就行了了 importSplashScreenfrom'react-native-splash-screen';componentDidMount(){setTimeout(SplashScreen.hide,2000);} 1. 2.
* 打开启动屏 */@ReactMethodpublicvoidshow(){SplashScreen.show(getCurrentActivity());}/** * 关闭启动屏 */@ReactMethodpublicvoidhide(){SplashScreen.hide(getCurrentActivity());}} 其次,创建一个ReactPackage类型的类,用于向React Native注册我们的SplashScreenModule组件。