React Native Expo SDK 52 启动画面

Question

我正在尝试创建一个启动画面。我正在遵循官方文档。

https://docs.expo.dev/develop/user-interface/splash-screen-and-app-icon/

和

https://docs.expo.dev/versions/latest/sdk/splash-screen/#configuration

我正在运行预构建并在 Android 模拟器中运行

启动画面只是在中心显示为一个小图像，如何使其全屏显示？

这是我的app.json

{
  "expo": {
    "name": "my-app",
    "slug": "my-app",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/images/icon.png",
    "userInterfaceStyle": "light",
    "newArchEnabled": true,
    "splash": {
      "image": "./assets/images/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#232323"
    },
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/images/adaptive-icon.png",
        "backgroundColor": "#232323"
      },
      "package": "com.rasyidialwee.my-app"
    },
    "web": {
      "favicon": "./assets/images/favicon.png",
      "bundler": "metro"
    },
    "plugins": [
      "expo-router",
      "expo-font",
      [
        "expo-splash-screen",
        {
          "backgroundColor": "#232323",
          "image": "./assets/images/splash.png",
          "dark": {
            "image": "./assets/images/splash.png",
            "backgroundColor": "#232323"
          },
          "resizemode": "contain"
        }
      ]
    ]
  }
}

Answer 1

使用 resizeMode: "cover" 而不是 contains。

"splash": {
  "image": "./assets/images/splash.png",
  "resizeMode": "cover",
  "backgroundColor": "#232323"
},