How to change the application launcher icon on Flutter Ask Question

0 votes

When I create an app with a flutter create command, the flutter logo is used as an application icon for both platforms.

If I want to change the app icon, shall I go to both platforms directories and replace images there?, by platforms directories I mean myapp/ios/Runner/Assets.xcassets/AppIcon.appiconset for iOS and myapp/android/app/src/main/res for Android.

Or is it possible to define an image as a Flutter Asset and the icons are generated somehow?.

Mar 1, 2023 in Android by Ashwini
• 5,430 points
10,476 views

2 answers to this question.

0 votes

Yes, you can change the launcher icon in Flutter by replacing the images in the platform-specific directories, but there is an easier way to do it using a package called flutter_launcher_icons.

Here's how you can use this package to change the launcher icon in your Flutter app:

  • Add the flutter_launcher_icons package to your pubspec.yaml file:

dev_dependencies: flutter_launcher_icons: "^0.9.2"
  • Run flutter pub get to install the package.

  • Create a new folder in your project root directory called icons.

  • Add your app icon image files to the icons folder. You should include icon files in different sizes for different screen densities. For example, for Android, you should include icon files in the following sizes: drawable-mdpi, drawable-hdpi, drawable-xhdpi, drawable-xxhdpi, and drawable-xxxhdpi. For iOS, you should include icon files in the following sizes: Icon-App-20x20@1x.png, Icon-App-20x20@2x.png, Icon-App-20x20@3x.png, Icon-App-29x29@1x.png, Icon-App-29x29@2x.png, Icon-App-29x29@3x.png, Icon-App-40x40@1x.png, Icon-App-40x40@2x.png, Icon-App-40x40@3x.png, Icon-App-60x60@2x.png, Icon-App-60x60@3x.png, and Icon-App-76x76@1x.png.

  • Add the following configuration to your pubspec.yaml file:

flutter_icons:
  image_path: "icons/icon.png"
  android: true
  ios: true
  remove_alpha_ios: true
  resize_behavior: shrink_only
  • The image_path property should point to your app icon image file in the icons folder. You can also configure the package to generate different icons for Android and iOS by setting the android and ios properties to true. The remove_alpha_ios property is used to remove the alpha channel from the iOS icons, which is required by Apple's guidelines. The resize_behavior property is used to control how the package resizes the icon image files.

  • Run flutter pub run flutter_launcher_icons:main to generate the new launcher icons.

That's it! Now you should see your new app icon when you run your Flutter app on both Android and iOS.

To know more, join our Flutter Certification Course today.

answered Mar 1, 2023 by vishalini
0 votes
how to change the app icon in flutter
answered Nov 29, 2023 by anonymous

Related Questions In Android

0 votes
1 answer

How to open the Google Play Store directly from my Android application?

If you want to link to your ...READ MORE

answered Nov 7, 2022 in Android by Edureka
• 12,690 points
4,396 views
0 votes
0 answers

How to open the Google Play Store directly from my Android application?

I have open the Google Play store ...READ MORE

Nov 23, 2022 in Android by Ashwini
• 5,430 points
734 views
0 votes
0 answers
0 votes
1 answer

How to change package name in flutter?

Yes, you can change the package name ...READ MORE

answered Mar 1, 2023 in Android by vishalini
3,270 views
0 votes
1 answer

Dart_LoadScriptFromKernel: The binary program does not contain 'main'.

Hi@akhtar, You need to add the main() function ...READ MORE

answered Jul 21, 2020 in Others by MD
• 95,460 points
3,593 views
0 votes
1 answer

How to install Dart in Windows system?

Hi@akhtar, Dart is the programming language used to code Flutter apps. ...READ MORE

answered Jul 21, 2020 in Others by MD
• 95,460 points
1,149 views
0 votes
1 answer

flutter run: No connected devices

Hi@akhtar, To prepare to run and test your ...READ MORE

answered Jul 21, 2020 in Others by MD
• 95,460 points
4,151 views
0 votes
1 answer

How to create a function in Dart language?

Hi@akhtar, There are many function types available in ...READ MORE

answered Jul 22, 2020 in Others by MD
• 95,460 points
765 views
0 votes
1 answer

How to add a ListView to a Column in Flutter?

To add a ListView to a Column ...READ MORE

answered Mar 9, 2023 in Android by pooja
15,938 views
0 votes
1 answer

How to run code after some delay in Flutter?

You can use the Future.delayed method to ...READ MORE

answered Mar 10, 2023 in Android by vinayak
944 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP