消除页面加载之间的白色 Phonegap iOS

Posted

技术标签:

【中文标题】消除页面加载之间的白色 Phonegap iOS【英文标题】:Eliminate white between page loads Phonegap iOS 【发布时间】:2013-06-24 15:08:04 【问题描述】:

我正在尝试消除在我的 iOS Phonegap 应用中加载本地页面之间的白色闪烁。 我已经尝试了所有方法,但仍然可以在页面加载之间看到白色。

我尝试使用 data-transition=none 将我的 html 背景设为黑色,并让 webView 背景颜色清晰。

我已经放了::

 NSLog(@"BEGIN EDIT - set webView to transparent");
[self.webView setBackgroundColor:[UIColor clearColor]];
[self.webView setOpaque: NO];
NSLog(@"END EDIT - set webView to transparent");

在 CDVInAppBrowser.m 、 CDVViewController.m 和 AppDelegate.m 中,但似乎没有任何效果! 也许我将代码放置在错误的位置。

请有人帮我摆脱页面加载之间的白色!

【问题讨论】:

【参考方案1】:

PhoneGap 加载速度可能很慢。您可能需要使用闪屏 API 来显示和隐藏闪屏? http://docs.phonegap.com/en/2.8.0/cordova_splashscreen_splashscreen.md.html#Splashscreen

在上面的页面上,还要注意 ios Quirk 部分。或者,您是否尝试过使用 jQuery Mobile 或 AngularJS 的单页应用程序?

【讨论】:

感谢您的回答,我正在使用闪屏,这不是解决方案,因为白色闪光是在页面加载之间。此外,由于我的应用程序的大小,不可能制作单页应用程序。必须有一种方法可以消除页面加载之间的白色!如果它是黑色的,我不介意,它不需要很长时间。【参考方案2】:

我在使用 Phonegap 制作移动应用程序时遇到了同样的问题。 我不知道如何避免这些闪烁,但是当您构建了一个只有几个屏幕的简单应用程序时,您可以将所有 HTML 文档实现到一个文件中,例如:

<html>
    <body>
         <div class="page" id="page-1">
              Content of page one
         </div>
         <div class="page" id="page-2" style="display:none;">
              Content of page two
         </div>
         <div class="page" id="page-3" style="display:none;">
              Content of page three
         </div>
    </body>
</html>

现在您可以通过使每个容器的内容对用户可见/不可见来在每个容器的内容之间切换。

这个解决方案背后的想法是,您的所有 应用程序的内容都将被加载一次(在开始时)并且 使用 jQuery 您将在内容之间切换而没有这些白色当网络浏览器必须呈现用户被重定向到的新页面时闪烁。

仅当您的应用不包含太多内容时,这才是一个很好的解决方案。

【讨论】:

【参考方案3】:

就像我说的那样,在这种情况下,由于其复杂性,无法将应用程序制作为单个文件,而且我不介意页面加载之间的白色闪烁是否为黑色,因为它们不会花费很长时间。这是我使用 Phonegap 2.8 for iOS 找到的解决方案:

在 CDVViewController.m 中

- (void)webViewDidFinishLoad:(UIWebView*)theWebView

    // Black base color for background matches the native apps
    theWebView.opaque = NO;
    theWebView.backgroundColor = [UIColor blackColor];
    //the rest of the code…

希望对其他人有用。

【讨论】:

以上是关于消除页面加载之间的白色 Phonegap iOS的主要内容,如果未能解决你的问题,请参考以下文章

PhoneGap如何使用一页应用刷新/重新加载页面

iOS Phonegap中的白色状态栏?

Cordova/Phonegap IOS 键盘滚动问题,显示白色背景

如何消除页脚和页面内容之间的间隙

防止页面加载电子之间的白色闪烁

加载颤振时消除图像中的白色闪烁