0

我有一个 PhoneGap/Sencha Touch 应用程序，它在应用程序加载时具有三种基本状态：启动屏幕、加载 web 视图但 Sencha Touch 正在加载，以及 Sencha Touch 已完全加载。

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

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

这是我尝试过的： - 删除各种代码。完全删除 Sencha Touch 代码确实摆脱了 flash 并让硬编码的加载指示器index.html出现。

  • Sencha Touch 代码触发时延迟几秒钟。没用
  • 触发 javascript 警报deviceready会消除闪光灯并让加载指示器出现。
  • 仅用文本替换加载指示器：<body>loading</body>. 没用。
  • index.html通过更改其背景颜色以及在display:none和之间切换来强制重新渲染display:block。没用。
  • 删除deviceready侦听器并在标记navigator.splashscreen.hide()后立即运行. 没用。<body>index.html

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

我在这里缺少什么吗？为什么会发生这种事情？为什么它只会发生在某些 Android 手机上？

4

2 回答 2

1

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

听起来这绝对是适合您的解决方案，因为您已确认您没有看到 Android 启动画面和 index.html 加载程序之间存在延迟。根据您初始化 Sencha 应用程序的准确程度，您可能希望隐藏 Ext.Viewport。我首先将 Ext.Viewport.hide() 放入您的初始化方法中。如果这解决了您的问题，只需在 Ext.application.Launch 后不久再次显示视口。

于 2015-02-11T02:38:04.623 回答
0

您可以更改 sencha 基本颜色作为您的启动画面，不要延迟应用程序加载或不要强行显示启动画面。

使用这个 CSS：

body {
 height: 100%;
 background-color: #1985D0;// change this as per your splash screen
 }
于 2015-02-12T07:09:44.747 回答