Apache Cordova 3.x入门 – 应用图标icon跟启动页面SplashScreen

Apache Cordova 3.x入门 — 应用图标icon和启动页面SplashScreen


(1)创建以下图像

icon图像:

引用

www/res/icons/android/icon-36-ldpi.png

www/res/icons/android/icon-48-mdpi.png

www/res/icons/android/icon-72-hdpi.png

www/res/icons/android/icon-96-xhdpi.png

splashscreen图像:

引用

www/res/screens/android/screen-hdpi-landscape.png

www/res/screens/android/screen-hdpi-portrait.png

www/res/screens/android/screen-ldpi-landscape.png

www/res/screens/android/screen-ldpi-portrait.png

www/res/screens/android/screen-mdpi-landscape.png

www/res/screens/android/screen-mdpi-portrait.png

www/res/screens/android/screen-xhdpi-landscape.png

www/res/screens/android/screen-xhdpi-portrait.png

(2)给工程添加splashscreen插件

引用

> cordova plugin add org.apache.cordova.splashscreen

引用

(3)配置config.xml

<preference name="SplashScreen" value="splash" /> <!-- 不带后缀png的文件名,默认是screen-->
<preference name="SplashScreenDelay" value="10000" /> <!-- Splash显示时间,默认是3000ms-->

<feature name="SplashScreen">
  <param name="android-package" value="org.apache.cordova.splashscreen.SplashScreen" />
</feature>

相比于在config.xml中设置延迟时间,更应该在设备初始化完成后隐藏Splash画面(index.html)

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

(4)Copy文件

cordova build之后Copy文件,也可以通过创建hook来实现。

icon.png:

把platforms/android/www/res/icons/android下的文件Copy到相应的platforms/android/res/drawable*/下。

splash.png:

把platforms/android/www/res/screens/android下的文件Copy到相应的platforms/android/res/drawable*/下。

完成以后启动“cordova emulate android”即可。

Apache Cordova 3.x入门 – 应用图标icon跟启动页面SplashScreen

相关文章:

你感兴趣的文章:

标签云: