Ionic+Capacitor3+Android短暂显示扭曲的开机画面

问题描述

如果您使用@capacitor/splash-screenAPI在您的Ionic Android应用程序中显示闪屏，则可能会遇到此问题：

问题

在不到一秒的时间内，开机画面将显示失真，直到它以正确的纵横比显示。这意味着它还会在屏幕上略有跳跃，如果您在设备处于横向时启动应用程序，或者如果您的设备具有伸展或粗大的显示宽高比，这一点将特别明显。

背景信息

发生这种情况是因为MainActivity在应用程序启动时使用的AppTheme.NoActionBarLaunch设置为将开机画面作为背景图像，但&q；Real"；Sash图像在几毫秒后在该插件的SplasScreen.buildViews()方法中初始化。

解决方案

要修复它，您可以在/android/app/src/main/values下的styles.xml文件中更改以下内容：

旧：

    <style name="AppTheme.NoActionBarLaunch" parent="AppTheme.NoActionBar">
        <item name="android:background">@drawable/splash</item>
    </style>

新建(无背景)：

    <style name="AppTheme.NoActionBarLaunch" parent="AppTheme.NoActionBar">
        <item name="android:background">@null</item>
    </style>

或设置闪屏的背景颜色：

    <style name="AppTheme.NoActionBarLaunch" parent="AppTheme.NoActionBar">
        <item name="android:background">#ffffff</item>
    </style>

这将防止在将实际ImageView添加到视图层次结构之前将开机画面显示为背景图像。ImageView将具有插件配置的androidScaleType中定义的正确scaleType。

使用以下版本测试：

使用以下配置：

const config: CapacitorConfig = {
    // ...
    plugins: {
        SplashScreen: {
            launchShowDuration: 3000,
            launchAutoHide: false,
            backgroundColor: '#ffffffff',
            androidSplashResourceName: 'splash',
            androidScaleType: 'CENTER_CROP',
            showSpinner: false,
            splashFullScreen: false,
            splashImmersive: false,
        },
    },
    // ...
};

推荐答案

上述解决方法不适用于需要透明背景的社区条形码扫描仪。

我的解决办法(空白白屏的缺点仍然存在，但它是有效的)：

    <style name="AppTheme.NoActionBar" parent="Theme.AppCompat.NoActionBar">
        <item name="android:windowActionBar">false</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowBackground">@android:color/white</item>
    </style>
    <style name="AppTheme.NoActionBarLaunch" parent="AppTheme.NoActionBar"></style>