給你的Cordova HybridApp添加Splash啟動頁面

標籤：cordova   hybridapp   啟動畫面   splashscreen   phonegap   

現在最新的Cordova 3以上的版本支援啟動畫面了，是通過cordova外掛程式實現的。

目前Splash外掛程式支援android，ios，blackberry等多個平台。

添加外掛程式等過程如下：

添加SplashScreen外掛程式

在cordova項目目錄運行：

cordova plugin add org.apache.cordova.splashscreen

這個命令從外掛程式git庫下載外掛程式代碼到在工程的plugins目錄下

修改config.xml設定檔

    <preference name="SplashScreen" value="screen" /> <!-- 不帶尾碼png的檔案名稱，預設是screen-->    <preference name="SplashScreenDelay" value="3000" /> <!-- Splash顯示時間，預設是3000ms-->    <feature name="SplashScreen">        <param name="android-package" value="org.apache.cordova.splashscreen.SplashScreen" />    </feature>

修改啟動圖片可以看到啟動圖片的名字是screen.png,工程下有一些screen.png預設圖片了，上面顯示的是cordova logo，下面需要把這些圖片換成你自己的啟動畫面，不需要支援的尺寸圖片直接刪掉就可以了。

在裝置初始化完成後隱藏Splash畫面

document.addEventListener("deviceready", onDeviceReady, false);  function onDeviceReady() {    navigator.splashscreen.hide();  }  

如果使用了ionic架構，直接在app.js 檔案的  .run([‘$ionicPlatform‘, function ($ionicPlatform) {   ... } 裡面加上 

navigator.splashscreen.hide();

就可以了。

現在再運行你的App，應該可以看到啟動畫面了。

給你的Cordova HybridApp添加Splash啟動頁面