显示键盘时出现 React-native / Splash-Screen答案

【问题标题】：React-native / Splash-Screen appear when showing keyboard显示键盘时出现 React-native / Splash-Screen
【发布时间】：2019-02-25 12:24:35
【问题描述】：

我在我的 react native 项目中添加了一个启动画面，当我打开键盘时，一切正常，它会短暂地显示它后面的启动画面。视频： https://drive.google.com/open?id=14ahrc-dyYnNEYAAX3iMQVwqqV6fVo_xG

复制

在 drawable 中创建 background_splash.xml 并在其中包含此代码：

 <?xml version="1.0" encoding="utf-8" ?>

<layer-list 
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@color/primary"/>
</layer-list>

然后将其添加到styles.xml文件中

<item name="android:windowBackground">
     @drawable/background_splash
</item>

预期行为

出现键盘时不应显示启动画面。

代码示例

一切都在 To Reproduce 选项卡中，您只需添加一个 TextInput 即可显示。

环境

React Native 环境信息：系统：操作系统：Windows 10 CPU：(4) x64 Intel(R) Xeon(R) CPU E5-1603 v4 @ 2.80GHz 内存：9.57 GB / 15.92 GB 二进制文件： npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD

【问题讨论】：

标签： android react-native splash-screen

【解决方案1】：

我的应用遇到了同样的问题，这是我的解决方法。首先你必须安装模块react-native-background-color，它允许你设置你的根Activity的背景颜色。

在您的 App.jsx 中调用 setColor 方法后（有一个短暂的超时以避免在启动屏幕后立即出现“闪烁”）示例与钩子：

export default function App(): Element {
    useEffect(() => {
        if (Platform.OS === "android") {
            setTimeout(() => {
                BackgroundColor.setColor("#FFFFFF");
            }, 500);
        }
    }, []);
    return <AppContainer />;
}

希望对您有所帮助！

编辑：使用Platform.OS 测试改进代码。

【讨论】：

嘿@jeba，我正在使用这个组件，但是当我重新加载应用程序时，收到此消息：“无法读取未定义的属性'setColor'”。
嘿，@M.Bertolazo 模块是否正确导入？如果对您有帮助，我会更新一些依赖项：https://github.com/jbarnabe/react-native-background-color
感谢@Jeba 的帮助，我一直在关注文档。我稍后会尝试使用你的 fork。
有什么方法可以用 yarn 安装你的版本？
我不使用纱线，但根据您可以使用的文档：yarn add https://github.com/jbarnabe/react-native-background-color

【解决方案2】：

这些库 (react-native-root-view-background & react-native-background-color) 对我不起作用可能是因为它们已经过时了，但是这个库对我有用，经过 "react-native": "~0.63.4" 的完美测试：

https://www.npmjs.com/package/react-native-root-view-background-color

import RootViewBackgroundColor from 'react-native-root-view-background-color';
 
 
// Set the Root View background color to black
RootViewBackgroundColor.setBackground(0, 0, 0, 1);
 
// Set the Root View background color to white
RootViewBackgroundColor.setBackground(255, 255, 255, 1);

【讨论】：

完美运行。