使用Phonegap启动图片后出现白屏闪烁问题

Question

在加载启动图像之后，我在应用程序加载之前会得到一个白屏。 我正在使用带有Xcode的phonegap。 我希望我的应用程序在我的启动图像上加载，以遵循iOS开发人员指南并提供平滑的启动外观。 我认为这个白屏是我的应用程序的Web视图加载。 我希望这个Web视图清晰可见。 对于此问题或解决方法有任何想法吗？

我尝试了以下代码，但对我的启动没有任何影响。 此代码位于我的MainViewController.m中。

-void (webViewDidFinishLoad:(UIWebView*) theWebView
{
theWebView.backgroundColor = [UIColor clearColor];
theWebView.opaque = NO;
 }

我已经做了很多研究，但是我没有找到解决方案。

- stat8

Answer 1

我也曾经遇到过同样的问题，尝试以下三个步骤来解决：

1. set AutoHideSplashScreen to NO in your phonegap/cordova plist file

2. Add this line to your viewDidLoad method of CDVMainViewController.m

   self.useSplashScreen = YES;
   

3. Then add this code to onDeviceReady() method

   function onDeviceReady()
   {
   // do your thing!
   cordova.exec(null, null, "SplashScreen", "hide", []);  //On Cordova 1.6. 0
   }
   

- sujithra s

---

太好了！非常感谢 :) 正在使用Phonegap 2.4。 - Joao Sousa

'useSplashScreen'已被弃用：在Cordova 2.5中已被弃用。请添加/删除SplashScreen插件，而不是设置此属性。我已经在PhoneGap 2.5和jQueryMobile1.3上测试了这个解决方案，但并没有起作用。 - Nguyen Minh Binh

plist文件在新版本的Phonegap/Cordova中已经被弃用，请使用config.xml（详见下面我的回答） - ian

Answer 2

在启动后，您需要叠加一个模态视图控制器来模拟“Default.png”图像，在UIWebView上方叠加视图控制器，并显示UIActivityIndicator，以便用户知道您正在加载应用程序。一旦网页完成，您可以关闭您的视图控制器。

希望这可以帮助到您。

- Oscar Gomez

---

我是新手开发者。你能给我一个例子或者截图吗？谢谢！ - stat8

Answer 3

你是否考虑过手动隐藏启动画面，以便在它消失之前使页面准备就绪？

window.setTimeout(function() { 
navigator.splashscreen.hide();
},1350);

在你的phonegap/cordova plist文件中将 AutoHideSplashScreen 设置为NO

- Adam Ware

Answer 4

我曾经遇到同样的问题，经过一番研究后发现这是因为应用程序需要一些时间来加载所有必需的.css和.js文件所致。

为了解决这个问题，我们可以使用启动画面，并延迟其时间，这样在加载所有必需的文件之前，最终用户不会看到一片混乱的白屏，而是会看到我们定制的启动画面。

我通过参考“ian”给出的答案的第一部分和第二部分来解决这个问题。以下是我遵循的步骤。

步骤1：安装Cordova启动画面插件。

cordova plugin add org.apache.cordova.splashscreen

步骤2：将config.xml文件中的自动隐藏启动画面首选项设置为false。

<preference name="AutoHideSplashScreen" value="false"/>

步骤三：增加启动画面延迟时间

<preference name="SplashScreenDelay" value="6000"/>

希望这能帮到某人 :)

- Mufaddal

Answer 5

在 Cordova/Phonegap 3+ 版本中，您需要在 config.xml 中设置首选项：

<preference name="AutoHideSplashScreen" value="false" />

您还需要安装插件：

cordova plugin add org.apache.cordova.splashscreen

然后，

document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
  // depending on how many things you are rendering on your webview, you might want to add an artificial wait
  var SPLASH_SCREEN_DELAY = 500;
  setTimeout(function() {
    navigator.splashscreen.hide();
  }, SPLASH_SCREEN_DELAY);
}

- ian

Answer 6

我曾经遇到过类似的问题。但我并没有在代码中解决它，而是在UI编辑器中进行了修复。包含uiwebview的窗口本身也有一个背景颜色属性。您可以将其设置为所需的颜色以消除白色闪烁。（我将我的设置为黑色。）

- colonelclick

---

我尝试在MainViewController.xib中更改背景颜色，但是启动后仍未更改背景颜色。除xib外，是否还有其他位置可以更改背景颜色？谢谢！ - stat8