Question

我正在使用cordova CLI（没有phonegap-build或任何其他奇特的东西）为iOS和Android制作一个手机应用程序。然后我使用XCode / Eclipse编译应用程序。

我正在为我的项目使用jQuery Mobile和其他一些javascript插件。因此，当我的应用加载时，在启动画面（本机）之后，屏幕保持空白约2-5秒，同时我的索引页面中的所有javascript都会加载。我试图找出一种方法来显示加载屏幕，同时所有js加载，但尚未找到如何做到这一点。

HTML，CSS或Javascript中是否有任何方法可以帮助我实现这一目标？我基本上是一个iOS开发者，所以这对我来说是新的。

如果你有点好奇，这是我的javascripts。 ; - ）

<script type="text/javascript" src="cordova.js"></script>
<script src="jquery-2.1.3.min.js"></script>
<link rel="stylesheet" href="owl-carousel/owl.carousel.css">
<script src="owl-carousel/owl.carousel.min.js"></script>  
<script type="text/javascript" src="fancybox/jquery.fancybox.js"></script>
<link rel="stylesheet" href="fancybox/jquery.fancybox.css" type="text/css" media="screen" />
<script src="jquery.mobile-1.4.5/jquery.mobile-1.4.5.min.js"></script>
<link rel="stylesheet" type="text/css" href="flatUI/jquery.mobile.flatui.css" />
<script src="CSS.supports.js"></script>
<link rel="stylesheet" type="text/css" href="styles.css">
<script src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<link href='fullcalendar.min.css' rel='stylesheet' />
<script src='lib/moment.min.js'></script>
<script src='fullcalendar.min.js'></script> 
<script src="swiper/jquery.slideme2.js"></script>
<link href="swiper/slideme.css" rel="stylesheet"/>

Answer 1

在config.xml中将AutoHideSplashScreen设置为false

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

所以现在你需要手动关闭它，你可以通过将下一行放在所有javascripts加载的地方来实现这一点：

navigator.splashscreen.hide();

例如：

function onDeviceReady() {
    navigator.splashscreen.hide();
}

如果你想要另一个屏幕，你需要在加载javascripts之前加载它。您可以导航到静态“欢迎”页面并在之后加载脚本。

Phonegap - 本机splash和index.html之间的空白屏幕

1 个答案: