In today’s tutorial we will learn how to generate app icons for both android & ios apps very easily by using a flutter plugin flutter_launcher_icons. To see how this works, open your current Flutter project or create a new one by following along with the demonstration below.
Creating a new Flutter project
As always, we’ll start off by setting up a new project and adding the plugin:
# Create New Flutter project $ flutter create flutter_app_icons_demo # Open this up inside of Visual Studio Code, you can use any IDE you want $ cd flutter_app_icons_demo && code .
Adding the Flutter Launcher Icons Plugin
Now open your
pubspec.yaml and add the flutter_launcher_icons following plugin to our
dev_dependencies. Currently the latest version is 0.7.4.
dev_dependencies: flutter_launcher_icons: ^0.7.4
Then type the following command into the terminal, which will get our plugin and make it available to us to use.
$ flutter pub get
Now Place your icon inside of your
assets/images/icon.png folder, or a similar folder of your choosing. Then, inside of
pubspec.yaml, we’ll need to provide the
flutter_icons configuration option:
flutter_icons: image_path: 'assets/images/icon.png' android: true ios: true
This will generate application icons for both Android and iOS. We can take this to next level by providing an
image_path per platform if we wanted to have a separate icon for each platform:
flutter_icons: image_path_ios: 'assets/images/icon_ios.png' image_path_android: 'assets/images/icon_android.png' ios: true android: true
Run the Flutter Build Script
After setting up the configuration, now all we need to do is run the package.
$ flutter pub run flutter_launcher_icons:main
If everything went as expected, we should see the following result in the terminal:
Android minSdkVersion = 16 Creating default icons Android Overwriting the default Android launcher icon with a new icon Overwriting default iOS launcher icon with new icon
Now run your application on a device or emulator. You should be able to see our new icon. Hurray 🥳