创建Cordova应用程序启动画面

这一节我们讲解如何为Android程序设置一个启动画面。

1）  制作启动画面图片，比如splash.png，并存放到platforms\android\res\drawable目录下。（实际上应该制作多个不同版本的图片，按照设备分辨率不同放到不同的drawable目录下。此例只做简单演示用）

2）  在项目根目录下的config.xml中添加两个配置项：

<preference name="SplashScreen"value="splash" />

<preferencename="SplashScreenDelay" value="30000" />

其中，第一个配置指定了启动画面的文件名；第二个设置指定启动画面停留的时间（单位为毫秒）。

3）  在首页的deviceready事件处理函数中，加入一行代码（红色标记的那一行）：

 

     bindEvents: function() {

        document.addEventListener('deviceready', this.onDeviceReady, false);

   },

   // deviceready Event Handler

   //

   // The scope of 'this' is the event. Inorder to call the 'receivedEvent'

   // function, we must explicity call'app.receivedEvent(...);'

   onDeviceReady: function() {     

    app.receivedEvent('deviceready');

    navigator.splashscreen.hide();

},

 

注意：

上面配置项SplashScreenDelay的值建议尽量设置大一些，比如20000（20秒）。按照我的理解，启动画面显示时，首页仍然是按正常情况在加载（即程序不会等到启动画面消失再开始加载首页）；如果设置的delay值太小，比如3000（3秒），而首页加载需要5000（5秒），则有2秒的时间屏幕会处于黑屏状态。设置的值大于首页加载时间值时，红色代码的那一行将提前隐藏启动画面。