给你的Cordova HybridApp加入Splash启动页面

时间:2023-03-08 16:09:55
给你的Cordova HybridApp加入Splash启动页面

如今最新的Cordova 3以上的版本号支持启动画面了,是通过cordova插件实现的。

眼下Splash插件支持android,ios,blackberry等多个平台。

给你的Cordova HybridApp加入Splash启动页面

加入插件等步骤例如以下:

加入SplashScreen插件

在cordova项目文件夹执行:

cordova plugin add org.apache.cordova.splashscreen

这个命令从插件git库下载插件代码到在project的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,project下有一些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,应该能够看到启动画面了。