Creating Splash Screens and Icons

앱아이콘을 mobile의 resolution에 맞게 자동으로 제작하는 기능

Cordova reference documentation:

• Icons: https://cordova.apache.org/docs/en/latest/config_ref/images.html
• Splash Screens: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-splashscreen/

npm install -g cordova-res

프로젝트 Top level 에 아래와 같은 폴더를 만들고 각각 icon.png(1024x1024) 및 splash.png(2732x2732)를 만들어 준다. anddroid 의 경우 하위 폴더 android를 만들어주고 icon-background.png(432x432) 와 icon-foreground.png(432x432)를 각각 만들어준다.

resources/
├── icon.png
└── splash.png
    └── android
        ├── icon-background.png
        └── icon-foreground.png

모든 이미지를 생성하고 native 프로젝트로 카피하기위해 아래 명령을 입력한다.

cordova-res ios --skip-config --copy
cordova-res android --skip-config --copy

res 이하의 각가의 폴더안으로 이미지들이 저장된다.

android/
└── src
    └── main
        └── res

[ERROR]
Error occurred while copying resources\android\icon\mdpi-foreground.png

[Solution]
432x432 크기의  icon-background.png  및 icon-foreground.png 만들어
<Project Directory>/resources/android/ 폴더에 넣는다.

등록시 필요이미지

App 제작시 필요한 이미지

• icon.png : 1024 x 1024
• splash.png : 2732 x 2732
• icon-background.png & icon-foreground.png : 432 x 432 (icon.png의 사이즈를 줄여서 사용해도 무방)

Android 등록시 필요한 이미지

• App Icon : 512 x 512
• Feature graphic 1024x500