Question

我有一个PhoneGap / Sencha Touch应用程序，它在应用程序加载时有三个基本状态：启动画面，加载了webview但Sencha Touch正在加载，并且Sencha Touch已满载。

在某些Android手机（例如我的Kyocera Rise）上，一切顺利。我看到启动画面，然后在deviceready上成功调用了navigator.splashscreen.hide()。我在index.html上的html / css硬编码加载指示器在Sencha Touch加载时显示，然后当加载Sencha Touch代码时，它显示完全加载的应用程序。

然而，在其他手机（例如我的Galaxy S3）上，事情并没有那么好用。我看到启动画面，然后deviceready隐藏了启动画面。但是，index.html上的硬编码加载指示符不会出现。我看到的只是一个白色（有时是黑色）屏幕。当Sencha Touch代码完全加载时，应用程序会成功显示。

以下是我尝试的内容： - 删除各种代码。完全删除Sencha Touch代码会消除闪存并让index.html上的硬加载加载指示符出现。

在Sencha Touch代码触发时延迟几秒钟。没有工作
在deviceready上发送javascript警告，摆脱闪光灯并显示加载指示。
仅使用文字<body>loading</body>替换加载指示符。没有工作。
强制index.html通过更改背景颜色以及在display:none和display:block之间切换来重新渲染。没有工作。
在deviceready上的navigator.splashscreen.hide()标记之后立即删除<body>侦听器并仅运行index.html。没有工作。

根据这些信息，它看起来与Sencha Touch有关，因为完全删除Sencha Touch代码可以显示加载指示器。也许与渲染有关，因为警报指示器也允许加载指示器显示。然而，这就是我所拥有的一切。看起来其他人遇到过这种情况，主要是在iOS和Blackberry上。我还没有找到任何我在其他地方看到的解决方案似乎可以解决我的问题;很多事实上人们过去常常无法在设备上隐藏启动画面。

我有什么东西在这里失踪吗？为什么会发生这种事情？为什么只会在某些Android手机上发生？

Answer 1

你可能会发现自己花了很长时间来完善这个。我们知道应用程序的第一次启动对于UX来说非常重要，但是（正如您所正确识别的那样）大量的Android设备/操作系统版本实际上使它成为一项相当艰巨的任务。我们发现一个好的解决方案是在加载时实际隐藏Sencha应用程序，依赖index.html加载指示器，然后延迟显示Sencha应用程序本身。

对于您来说，这肯定听起来可能是一个解决方案，因为您已经确认在Android启动画面和index.html加载程序之间没有发现延迟。根据您初始化Sencha应用程序的具体程度，您可能希望隐藏Ext.Viewport。我首先将Ext.Viewport.hide（）放入您的初始化方法中。如果这样可以解决您的问题，只需在Ext.application.Launch上稍后再次显示Viewport。

Answer 2

您可以将启动画面颜色更改为启动画面，不要延迟应用程序加载或不要强制显示启动画面。

使用此css：

body {
 height: 100%;
 background-color: #1985D0;// change this as per your splash screen
 }

某些Android手机的启动画面和最终应用加载之间的Flash

2 个答案: