构建App配置app icon 和 splash是必须的步骤,通过ionic 构建hybrid app 同样需要配置,不过通过ionic cli 构建的项目则可以通过cli 轻松处理icon 和splash
config.xml
Ionic 项目中原生相关的配置,均在config.xml中,处于项目顶级目录中,分别有ios 和android:
<platform name="android">
...
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
...
</platform>
<platform name="ios">
...
<icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
<icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
<icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
<splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
<splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
<splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
...
</platform>
配置icon 和splash
当然可以在resources文件夹中修改对应的icon 和splash, 不过ionic cli 给我们提供了更方便的方式:
1.resources 文件中添加一张icon.png (1024x1024)
2.resources 文件中添加一张splash.png(2732x2732)
执行如下指令
ionic cordova resources
ionic cordova resources ios
ionic cordova resources android
ionic cli 会在resources 文件分别生成ios / android 对应的各种尺寸的ionic 和 splash,同时会更新config.xml文件。
当然为了splash 最好的体验,最好设计的一张中间是方正logo spalsh.
如果平台有特殊的icon 或 splash. 需要在resources 文件夹下建立存储各平台icon.png 或splash 的文件。例如,如果需要android 版本设置特殊的icon, 需要添加resources/android/icon.png。