Iconos para iOS

por Halí - publicado: Sep 21, 18
iOSIconos

Desarrollando una aplicación para iOS me encontré con que necesitas un icono diferente para cada dispositivo, debes cambiar la resolución y el nombre. Así que escribí un script para ayudar con esa tarea.

Dicho script recibe como parámetros una lista de iconos (en la máxima resolución deseada, formatos jpg, gif, png) y nos da como resultado la copia de esos iconos en diferentes resoluciones y con diferentes nombres, según los lineamientos que apple recomienda.

Requisitos

  • Iconos para copiar (al menos uno).
  • Interfaz de línea de comandos.
  • sips, una herramienta muy útil para procesar imágenes.
  • bc, nos servirá para hacer algunos cálculos.
  • tail y cut, para manipular un par de cadenas.
  • Editor de texto. (Yo uso Vim)

Hora del código

Primero revisaremos si la ejecución del script tiene parámetros, de no ser así, lo terminamos y ya.

if [ $# -eq 0 ]
then
  echo "No arguments"
  exit
fi

Después, recorremos toda la lista de parámetros, en este caso iconos y vamos realizando algunas tareas simples. Lo primero es obtener el nombre del icono, luego su extensión y separarlos. (Aquí solo ejemplificaré la copia a una resolución).

for file in "$@"
do
  fullFileName=$file
  extension="${fullFileName##*.}"
  fileName="${fullFileName%.*}"

Ya que reducir el tamaño de un icono es preferible a aumentarlo suponemos que los iconos que se pasen como parámetros son los de la máxima resolución posible, o sea los que llevarán el prefijo @3x, como: Icon@3x.png (igual puedes cambiar eso), entonces calculamos cual es la dimensión máxima de nuestro icono.

  height=$(sips -g pixelHeight $fullFileName | tail -n1 | cut -d" " -f4)
  width=$(sips -g pixelWidth $fullFileName | tail -n1 | cut -d" " -f4)
  maxDim=$(( $height > $width ? $height : $width ))

Posteriormente, pasamos a crear los nombres que llevarán las copias de nuestro icono. Y lo copiamos con ese nombre.

  r1x="$fileName@1x.$extension"

  tee $r1x < $fullFileName > /dev/null

Por último cambiamos la resolución de nuestro icono y listo!

  sips -Z $(echo "scale=3; $maxDim / 3" | bc -l) $r1x > /dev/null

done

Nota: Si los iconos que deseas copiar son los de la resolución media @2x, entonces en lugar de dividir entre 3 la dimensión máxima, deberás dividir entre 2, para los iconos con resolución pequeña y multiplicar por 3/2 para los de resolución más grande y así con la resolución pequeña.

El código completo lo puedes encontrar en este gist

Uso

./copyIcons.sh [Icono o iconos a copiar]

Mi uso favorito es poner el script en una carpeta donde tenga todos los iconos que quiero copiar y pum!

./copyIcons.sh *.png

Ahora tenemos los iconos necesarios para seguir con el desarrollo de nuestra aplicación.

https://halivert.dev/blog/2018/09/ios-icons/