Question

我正在通过app.json设置启动画面图标和颜色：

当我尝试在Android模拟器上测试该应用程序时，它可以正常工作，但是在执行apk之后，问题似乎再次出现了

这是来自app.json文件的启动画面代码段：

"platforms": [
    "ios",
    "android"
],
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"splash": {
    "image": "./assets/splash.png",
    "resizeMode": "contain",
    "backgroundColor": "#ffd525"
}

我希望登录屏幕显示为：

但是它一直显示为：

使用的依赖项：

"dependencies": {
    "expo": "^32.0.0",
    "native-base": "^2.12.1",
    "react": "16.5.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk- 
    32.0.0.tar.gz",
    "react-native-paper": "^2.15.2",
    "react-navigation": "3.1.2"
}

Answer 1

您正在使用expo吗？也许您需要使用此命令SplashScreen.hide()

隐藏启动画面

来源：https://docs.expo.io/versions/latest/sdk/splash-screen/

Answer 2

此问题的解决方案，以供将来参考...按照使用React Navigation软件包的方式进行，当您要使用Switch Navigator时，必须在任何类型的导航器（包括Tab或Switch或其他任何类型的导航器）中添加Switch Screen，而不必添加您的直接显示屏幕。

出现此问题的代码示例：

import {createSwitchNavigator, createAppContainer} from 'react-navigation';
import AppIntroductionStackNav from './AppIntroductionStackNav';
import LoginScreen from '../Screens/LoginScreen';
import AppMainTabNav from './AppMainTabNav';


const TopLevelSwitchNav = createSwitchNavigator({
    AppIntroduction:  {
        screen: AppIntroductionStackNav,
        navigationOptions: {
            header: null
        }
    },
   AppLogin: {
        screen: LoginScreen,
        navigationOptions: {
            header: null
        }
    },
    AppMain: {
        screen: AppMainTabNav
    }
},
{
    initialRouteName: 'AppIntroduction',
    navigationOptions: { header: null }
});

export default createAppContainer(TopLevelSwitchNav);

正确的方法是将登录屏幕添加到Stack Navigator：

import {createStackNavigator} from 'react-navigation';
import LoginScreen from '../Screens/LoginScreen';

const LoginStackNav = createStackNavigator({
    Login: {
        screen: LoginScreen
    }
});

export default LoginStackNav;

，然后将LoginStackNav添加到您的Switch Navigator：

import {createSwitchNavigator, createAppContainer} from 'react-navigation';
import AppIntroductionStackNav from './AppIntroductionStackNav';
import LoginStackNav from '../LoginStackNav';
import AppMainTabNav from './AppMainTabNav';


const TopLevelSwitchNav = createSwitchNavigator({
    AppIntroduction:  {
        screen: AppIntroductionStackNav,
        navigationOptions: {
            header: null
        }
    },
   AppLogin: {
        screen: LoginStackNav,
        navigationOptions: {
            header: null
        }
    },
    AppMain: {
        screen: AppMainTabNav
    }
},
{
    initialRouteName: 'AppIntroduction',
    navigationOptions: { header: null }
});

export default createAppContainer(TopLevelSwitchNav);

为什么在加载登录屏幕后，启动屏幕仍在后台显示？

2 个答案: