How to change the application launcher icon on Flutter?

To change the application launcher icon in a Flutter app, you typically need to replace the default icons with your custom ones. Here’s a step-by-step guide on how to do this:

For Android:

  1. Prepare Your Icons: Create your custom icons in the required sizes. For Android, you typically need icons in different densities. Common densities include mdpi, hdpi, xhdpi, xxhdpi, and xxxhdpi.
  2. Replace the Icons: Replace the default icons with your custom ones in the following directories of your Flutter project:
    • android/app/src/main/res/mipmap-mdpi
    • android/app/src/main/res/mipmap-hdpi
    • android/app/src/main/res/mipmap-xhdpi
    • android/app/src/main/res/mipmap-xxhdpi
    • android/app/src/main/res/mipmap-xxxhdpi
    You should replace the ic_launcher.png files in each of these directories with your custom icons.
  3. Update AndroidManifest.xml: Open android/app/src/main/AndroidManifest.xml and make sure the android:icon attribute of the <application> tag points to your custom launcher icon.

For iOS:

  1. Prepare Your Icons: Create your custom icons in the required sizes. For iOS, you typically need icons in different resolutions for various devices and purposes. You’ll often provide icons for iPhone, iPad, App Store, etc.
  2. Replace the Icons: Replace the default icons with your custom ones in the ios/Runner/Assets.xcassets/AppIcon.appiconset directory of your Flutter project.
  3. Update Info.plist: Open ios/Runner/Info.plist and make sure the CFBundleIconName key in this file matches the name of your custom icon file without the extension. For example, if your custom icon file is named AppIcon.png, then the value of CFBundleIconName should be AppIcon.

Using Tools:

There are also tools available to help automate this process, such as the flutter_launcher_icons package. This package allows you to define your icons in the pubspec.yaml file and automatically generates the required configuration for both Android and iOS.

Example flutter_launcher_icons Configuration:

Add the following lines to your pubspec.yaml file:

dev_dependencies:
  flutter_launcher_icons: ^0.9.2

flutter_icons:
  android: true
  ios: true
  image_path: "assets/icon/app_icon.png"

Replace "assets/icon/app_icon.png" with the path to your custom icon.

After adding this configuration, run the following command in your terminal:

flutter pub get
flutter pub run flutter_launcher_icons:main

This will generate the necessary icon files and configurations for both Android and iOS according to the specified image path.

Choose the method that best fits your workflow and project requirements.

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More