Antes de desplegar una aplicación, se deben diseñar los iconos de la aplicación para las plataformas destino. Estos iconos deben diseñarse con los tamaños especificados en esta página y con el formato PNG. Además, para evitar incompatibilidades, las imágenes PNG deben exportarse como: non-interlaced y no conteniendo perfiles ICC.
Los iconos de la aplicación deben ponerse en el directorio raíz de la aplicación (no en subdirectorios).
Icono de la aplicación para iOS
Para iOS, se deben crear una serie de iconos para los dispositivos iOS que se van a soportar. Apple también recomienda un conjunto de iconos más pequeños para los resultados de las búsquedas con spotlight y para los settings de iOS.
Los iconos para iOS deben tener los siguientes nombres y tamaños:
Fichero
|
Versión iOS
|
W x H
|
Uso
|
Icon-167.png
|
>= 9.0
|
167 x 167
|
App icon - iPad Pro
|
Icon-60@3x.png
|
>= 8.0
|
180 x 180
|
App icon - iPhone 6 plus
|
Icon-Small-40@3x.png
|
>= 8.0
|
120 x 120
|
Search - iPhone 6 plus
|
Icon-Small@3x.png
|
>= 8.0
|
87 x 87
|
Settings - iPhone 6 plus
|
Icon-60.png
|
>= 7.0
|
60 x 60
|
App icon - iPhone
|
Icon-60@2x.png
|
>= 7.0
|
120 x 120
|
App icon - Retina iPhone
|
Icon-76.png
|
>= 7.0
|
76 x 76
|
App icon - iPad
|
Icon-76@2x.png
|
>= 7.0
|
152 x 152
|
App icon - Retina iPad
|
Icon-Small-40.png
|
>= 7.0
|
40 x 40
|
Search/Settings - all devices
|
Icon-Small-40@2x.png
|
>= 7.0
|
80 x 80
|
Search/Settings - all devices
|
Icon.png
|
<= 6.1
|
57 x 57
|
App icon - iPhone
|
Icon@2x.png
|
<= 6.1
|
114 x 114
|
App icon - Retina iPhone
|
Icon-72.png
|
<= 6.1
|
72 x 72
|
App icon - iPad
|
Icon-72@2x.png
|
<= 6.1
|
144 x 144
|
App icon - Retina iPad
|
Icon-Small-50.png
|
<= 6.1
|
50 x 50
|
Search/Settings - iPad
|
Icon-Small-50@2x.png
|
<= 6.1
|
100 x 100
|
Search/Settings - Retina iPad
|
Icon-Small.png
|
<= 6.1
|
29 x 29
|
Search/Settings - iPhone
|
Icon-Small@2x.png
|
<= 6.1
|
58 x 58
|
Search/Settings - Retina iPhone
|
Además, hay que especificar todos estos iconos en la tabla settings.iphone.plist.CFBundleIconFiles:
settings = {
iphone = {
plist = {
CFBundleIconFiles = {
"Icon.png",
"Icon@2x.png",
"Icon-60.png",
"Icon-60@2x.png",
"Icon-60@3x.png",
"Icon-72.png",
"Icon-72@2x.png",
"Icon-76.png",
"Icon-76@2x.png",
"Icon-167.png",
"Icon-Small-40.png",
"Icon-Small-40@2x.png",
"Icon-Small-40@3x.png",
"Icon-Small-50.png",
"Icon-Small-50@2x.png",
"Icon-Small.png",
"Icon-Small@2x.png",
"Icon-Small@3x.png"
},
UILaunchImages = {
},
}
},}
iphone = {
plist = {
CFBundleIconFiles = {
"Icon.png",
"Icon@2x.png",
"Icon-60.png",
"Icon-60@2x.png",
"Icon-60@3x.png",
"Icon-72.png",
"Icon-72@2x.png",
"Icon-76.png",
"Icon-76@2x.png",
"Icon-167.png",
"Icon-Small-40.png",
"Icon-Small-40@2x.png",
"Icon-Small-40@3x.png",
"Icon-Small-50.png",
"Icon-Small-50@2x.png",
"Icon-Small.png",
"Icon-Small@2x.png",
"Icon-Small@3x.png"
},
UILaunchImages = {
},
}
},}
Icono de la aplicación para Android
En el caso de Android, los iconos de la aplicación se copian en el fichero APK durante la generación, si estuvieran disponibles en el directorio raíz de la aplicación Corona.
Estos iconos tienen que tener el nombre y tamaño que especifica Android:
Fichero
|
W x H
|
Icon-xxxhdpi.png
|
192 x 192
|
Icon-xxhdpi.png
|
144 x 144
|
Icon-xhdpi.png
|
96 x 96
|
Icon-hdpi.png
|
72 x 72
|
Icon-mdpi.png
|
48 x 48
|
Icon-ldpi.png
|
36 x 36
|
Automatizando el proceso
Existe una web donde podemos obtener todos los iconos necesarios para nuestra aplicación de forma automática. Este sitio está preparado para el framework Nativescript, pero nos puede valer igualmente:
En esta web podemos subir un icono de nuestra aplicación (PNG con tamaño mínimo de 1024x1024) y en unos segundos nos descargamos un zip con todas las imágenes en los tamaños necesarios para iOS y Android.
En el caso de android tendremos que renombrar los ficheros para que se adapten a lo indicado en el apartado anterior.
No hay comentarios:
Publicar un comentario