Generar automáticamente iconos de aplicaciones Flutter con flutter_launcher_icons

Índice
  1. Creando un nuevo proyecto Flutter
  2. Cómo agregar el complemento de iconos del iniciador de Flutter
  3. Logotipo de la aplicación
  4. Ejecutar el script de compilación
  5. Resultados

He estado trabajando en una aplicación Flutter durante la mayor parte de este año y, a medida que nos acercamos al lanzamiento, me di cuenta de que aún no había configurado un ícono para la aplicación. Inicialmente, seguí adelante y configuré mis íconos con Xcode y Android Studio, pero después de encontrar el flutter_launcher_iconscomplemento, ¡nunca más necesitaré hacerlo manualmente!

Para ver cómo funciona esto usted mismo, inicie su proyecto Flutter actual o siga la demostración a continuación.

Creando un nuevo proyecto Flutter

Como siempre, comenzaremos configurando un nuevo proyecto y agregando el complemento:

# New Flutter project$ flutter create f_icons# Open this up inside of VS Code$ cd f_icons  code .

Cómo agregar el complemento de iconos del iniciador de Flutter

Dirígete a tu pubspec.yamly agrega el siguiente complemento al nuestro dev_dependencies:

dev_dependencies:  flutter_launcher_icons: ^0.7.4

Luego podemos asegurarnos de tener los paquetes más recientes en nuestro proyecto ejecutando:

$ flutter pub get

Logotipo de la aplicación

Ahora que tenemos un proyecto Flutter, necesitaremos un logotipo para configurarlo como ícono. Aquí hay uno que podemos usar, imagina que es una aplicación de cámara:

Coloca tu icono dentro de tu assets/images/icon.pngcarpeta,ouna carpeta similar de su elección. Luego, dentro de pubspec.yaml, necesitaremos proporcionar la flutter_iconsopción de configuración:

flutter_icons:  image_path: 'assets/images/icon.png'  android: true  ios: true

Esto generará iconos de aplicaciones para Android.yiOS usando el especificado. También podemos configurar esto más a fondo proporcionando unimage_path porplataforma si quisiéramos tener un icono independiente. Aquí te explicamos cómo:

flutter_icons:  image_path_ios: 'assets/images/heal.png'  image_path_android: 'assets/images/heal.png'  android: true  ios: true

Con esto en mente, ¡sigamos adelante y generemos los íconos!

Ejecutar el script de compilación

Dentro de su terminal, ejecute el siguiente script de compilación:

$ flutter pub run flutter_launcher_icons:main

Si todo funcionó correctamente, deberíamos ver el siguiente resultado:

Android minSdkVersion = 16Creating default icons AndroidOverwriting the default Android launcher icon with a new iconOverwriting default iOS launcher icon with new icon

Resultados

Ejecutemos nuestra aplicación en un dispositivo o emulador. ¡Deberíamos poder ver nuestro fantástico nuevo ícono!

SUSCRÍBETE A NUESTRO BOLETÍN 
No te pierdas de nuestro contenido ni de ninguna de nuestras guías para que puedas avanzar en los juegos que más te gustan.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir

Este sitio web utiliza cookies para mejorar tu experiencia mientras navegas por él. Este sitio web utiliza cookies para mejorar tu experiencia de usuario. Al continuar navegando, aceptas su uso. Mas informacion