Question

我为离子科尔多瓦项目运行ionic cordova run android。这时，我的手机通过USB连接到PC。因此，当我运行该命令时，它将在我的真实设备android redmi note 6 PRO上安装该应用程序。但是真正发生的是，当应用打开时，仅出现白屏，什么也没有。首先，它显示启动屏幕，然后永远显示白屏。为什么会发生这种现象？我在某处阅读，我认为某些人由于离子4而有此问题。请帮助。

我要粘贴的pastebin链接，在单击应用程序以在android模拟器上打开该应用程序后显示logcat日志（在android模拟器上也显示白屏）。

是的。 https://pastebin.com/nLiY8w0b

chrome调试器显示-https://pastebin.com/EzdyV3Tw

Answer 1

我已经通过在config.xml上设置正确的参数解决了该问题

<preference name="AutoHideSplashScreen" value="false" />
 <preference name="SplashScreenDelay" value="10000" />
 <preference name="FadeSplashScreenDuration" value="1000" />
 <preference name="SplashScreen" value="screen" />
 <preference name="ShowSplashScreen" value="true" />
 <preference name="ShowSplashScreenSpinner" value="false" />
 <preference name="SplashShowOnlyFirstTime" value="false" />
 <preference name="FadeSplashScreen" value="true" />

然后，在我的platform.ready() instruction all I do is Splashscreen.hide();

然后使用

在android上运行项目

ionic cordova run android

Answer 2

找到解决方案。问题出在cordova-plugin-android-permissions中。在android 6+（也许是android 5，我的设备上也没有）上，用户应手动接受权限。在应用程序权限中，请求看起来像警报视图。并且此警报会自动停止启动屏幕（即使您没有自动隐藏启动屏幕并且还没有调用hide方法），并中断了淡出动画。同样，即使已经添加了权限，此权限请求也会中断启动画面。

因此解决方案是在等于延迟时间超时的超时延迟后，在splashScreen.hide（）之后请求权限。

示例：
config.xml

<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="FadeSplashScreenDuration" value="1000" />
<preference name="SplashScreenDelay" value="30000" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="FadeSplashScreen" value="true" />
<preference name="ShowSplashScreen" value="true" />

在app.components.ts

中

  initializeApp() {
    this.platform.ready().then(() => {
      setTimeout(() => {
        this.splashScreen.hide();
      }, 1000);
    }
  }

NOTED !!! （设置超时时间）应等于 config.xml中的FadeSplashScreenDuration参数值

结论： 上面的代码从“启动”屏幕进行了平滑过渡，它将平滑淡入您的启动页面。根本没有显示白屏。希望这会有所帮助。

Answer 3

将其放入您的config.xml文件中

<preference name="ScrollEnabled" value="false" />
<preference name="android-minSdkVersion" value="19" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="SplashScreenDelay" value="3000" />

然后运行以下命令： ionic cordova build android 它将在此处生成apk文件：your_project_folder / platforms / android / app / build / outputs / apk / debug / app-debug.apk

这应该可以在闪屏之后没有白屏的情况下工作

Answer 4

调试您的应用程序，并检查其是否显示任何错误的应用程序卡在白屏上，主要是由于应用程序中的错误

Answer 5

我也遇到了这个问题，但就我而言，问题在于默认路由。

App初始化时会尝试在默认路径为“空”路径上打开，这进一步将我们重定向到实际的工作路径，在我的情况下，“空”路径已重定向到“ / dashboard”。

示例代码

const routes: Routes = [
  {
    path: '',
    redirectTo: 'dashboard',
    pathMatch: 'full'
  },
  {
    path: 'dashboard',
    canActivate: [AuthGuard],
    loadChildren: './home/home.module#HomePageModule'
  },
  { path: 'login',
    loadChildren: './public/login/login.module#LoginPageModule' }

在上面的代码中，我的空路由重定向到[AuthGuard]处于活动状态的仪表板，并且卡在循环中，因此我决定将其重定向到[AuthGuard]不处于活动状态的路由，即“ / login”就我而言。通过重定向到未激活[Authgaurd]的登录名来更新代码。

 const routes: Routes = [
      {
        path: '',
        redirectTo: 'login',
        pathMatch: 'full'
      },
      {
        path: 'dashboard',
        canActivate: [AuthGuard],
        loadChildren: './home/home.module#HomePageModule'
      },
      { path: 'login',
        loadChildren: './public/login/login.module#LoginPageModule' }

为Andriod构建项目后，该应用程序成功运行。

只要有人在同一问题上有和我一样的问题，请发表答案。

Answer 6

config.xml

 <preference name="auto-hide-splash-screen" value="false" /> 
 <preference name="AutoHideSplashScreen" value="false" />

main.js 请更改

this.platform.ready().then(function () {
        _this.statusBar.styleDefault();
        _this.splashScreen.hide();
    });

到

this.platform.ready().then(function () {
            _this.statusBar.styleDefault();
            setTimeout(function(){
                _this.splashScreen.hide();

            }, 3000);
        });

Answer 7

就我而言，这与android平台配置有关。我做了以下工作来解决该问题：

删除android文件夹（在您的项目目录中或在Platforms目录下。）
运行命令以将android添加为平台。

npx cap添加android

以上命令用于带电容器的离子。如果您使用的是cordova，则可以使用常规命令。

打开Android Studio并创建APK。此APK应该可以正常工作。

Answer 8

如果更改config.xml对您不起作用，请尝试

第1步：
打开index.html
将基本href由<base href="/" />更改为<base href="./" />

第2步：
打开tsconfig.json
将compileOptions中的目标从"target": "es2015"更改为"target": "es5"

参考：https://github.com/ionic-team/capacitor/issues/1878#issuecomment-523497238

Answer 9

如果你仍然在这里没有答案，这里是我解决它的方法。

$ ionic cordova run android --simulator --verbose --optimization=false

如果它构建、运行然后进入白屏，请为开发者模式设置 chrome，然后打开以下页面。

chrome://inspect/#devices

检查控制台日志是否有任何错误，并根据需要修复它们。奇怪的是它可以在普通的网络浏览器中完美运行。

注意：--optimization=false 标志对于让您轻松读取错误很重要。

祝你好运

为什么在ionic 4的启动画面后白屏仍然停留？

9 个答案: