Flutter

How to change Flutter App Icon (Android and IOS)

An app icon is a small graphical representation placed on a device’s home screen. It serves as a visual cue for a specific mobile application or software function. These icons are designed to be distinctive and memorable, typically featuring simplified versions of the app’s logo or relevant symbols.

App icons play a crucial role in user experience by helping users quickly identify and access their desired applications. When users tap on these icons, they can launch the corresponding apps or functions with ease. Different operating systems, such as iOS and Android, have specific guidelines for app icon design to maintain consistency and usability across various devices and platforms. These guidelines ensure that app icons are recognizable and user-friendly for a seamless interaction.

Change App icon in Flutter

Today we will learn how to change the app icon in Flutter applications on Android and IOS. To change Flutter application icons we will use the Flutter Launcher Icons package.

Flutter Launcher Icons is a popular Flutter package that simplifies the process of customizing app launcher icons for both Android and iOS platforms. Developed to enhance the visual appeal and branding of Flutter applications. This package allows developers to easily replace the default launcher icons with custom icons. Flutter Launcher Icons simplifies the configuration steps. It is convenient for developers to update app icons without delving into complex platform-specific configurations.

Now Let’s see how to use this package

Step 1: Add dependency in pubspec.yaml

flutter_launcher_icons: ^0.13.1

After adding this dependency, open your terminal and run this command

flutter pub get

Step 2: Add app icon in assets folder

Now put your app icon in assets folder of the project.

Step3: Add configuration

Now open pubspec.yaml file and add configuration for flutter_launcher_icons.

flutter_launcher_icons:
  image_path: "assets/app_icon.png"
  android: true
  ios: true 

Here image path should be the exact path of our icon which we have placed in assets folder. There are  other two properties (android and ios). If we want to change icon for Android we will set the value of android to true. Otherwise it will ignore the android icon. Similarly if we want to change the icon for IOS, we will set the value of ios to true. After this configuration, again open the terminal and run this command to apply these configurations.  

flutter pub run flutter_launcher_icons

This was the last step. This command will execute and will change the icons for both platforms (Android and IOS).

You can also learn how to round the corners of image in flutter.

Leave a Reply

Your email address will not be published. Required fields are marked *