java-js知识库之九——cordova图标和闪屏

本篇将记录app的图标和启动闪屏。

一、应用图标

1.1 制作图片

准备一张图片,使用制图工具将图片分辨率修改为以下几种:

36*36    drawable-ldpi-icon.png
48*48    drawable-mdpi-icon.png
72*72    drawable-hdpi-icon.png
96*96    drawable-xhdpi-icon.png

1.2 将图片放入res/icon/android目录下

java-js知识库之九——cordova图标和闪屏

1.3 修改config.xml文件

<icon density="ldpi" src="res/icon/android/drawable-ldpi-icon.png" />
<icon density="mdpi" src="res/icon/android/drawable-mdpi-icon.png" />
<icon density="hdpi" src="res/icon/android/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="res/icon/android/drawable-xhdpi-icon.png" />

java-js知识库之九——cordova图标和闪屏

1.4 打包apk

java-js知识库之九——cordova图标和闪屏
如图,应用程序图标已改变。

二、启动页面

2.1 添加闪屏插件

命令行输入cordova plugin add cordova-plugin-splashscreen

D:\java\android\test>cordova plugin add cordova-plugin-splashscreen
Installing "cordova-plugin-splashscreen" for android

命令行输入cordova plugins ls

D:\java\android\test>cordova plugins ls
cordova-hot-code-push-plugin 1.5.3 "Hot Code Push Plugin"
cordova-plugin-badge 0.8.8 "Badge"
cordova-plugin-camera 4.0.3 "Camera"
cordova-plugin-device 2.0.2 "Device"
cordova-plugin-geolocation 4.0.1 "Geolocation"
cordova-plugin-local-notification 0.9.0-beta.2 "LocalNotification"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-whitelist 1.3.3 "Whitelist"

闪屏插件Splashscreen安装成功。

2.2 制作图片

320*426 splash-port-ldpi.png
426*320 splash-land-ldpi.png
320*470 splash-port-mdpi.png
470*320 splash-land-mdpi.png
480*640 splash-port-hdpi.png
640*480 splash-land-hdpi.png
720*960 splash-port-xhdpi.png
960*720 splash-land-xhdpi.png

2.3 将图片放入res\screen\android目录下

java-js知识库之九——cordova图标和闪屏

2.4 修改config,xml

<splash density="land-hdpi" src="res/screen/android/splash-land-hdpi.png" />
<splash density="land-ldpi" src="res/screen/android/splash-land-ldpi.png" />
<splash density="land-mdpi" src="res/screen/android/splash-land-mdpi.png" />
<splash density="land-xhdpi" src="res/screen/android/splash-land-xhdpi.png" />
<splash density="port-hdpi" src="res/screen/android/splash-port-hdpi.png" />
<splash density="port-ldpi" src="res/screen/android/splash-port-ldpi.png" />
<splash density="port-mdpi" src="res/screen/android/splash-port-mdpi.png" />
<splash density="port-xhdpi" src="res/screen/android/splash-port-xhdpi.png" />

java-js知识库之九——cordova图标和闪屏
此时,重新打包就可以显示闪屏了:
java-js知识库之九——cordova图标和闪屏
关于闪屏插件的时间配置:
启动画面的时间长度,value为0时不显示启动画面,此时为4秒

<preference name="SplashScreenDelay" value="4000" />

一般可以将闪屏时间设置长一点,通过js代码关闭:

navigator.splashscreen.hide();//隐藏
navigator.splashscreen.show();//显示

三、应用程序名称

修改config.xml第三行:

<name>test</name>

重新打包:
java-js知识库之九——cordova图标和闪屏
screen.apk密码:e08b。