Convert Figma logo to code with AI

fluttercommunity logoflutter_launcher_icons

Flutter Launcher Icons - A package which simplifies the task of updating your Flutter app's launcher icon. Fully flexible, allowing you to choose what platform you wish to update the launcher icon for and if you want, the option to keep your old launcher icon in case you want to revert back sometime in the future. Maintainer: @MarkOSullivan94

1,984
393
1,984
165

Top Related Projects

React hooks for Flutter. Hooks are a new kind of object that manages a Widget life-cycles. They are used to increase code sharing between widgets and as a complete replacement for StatefulWidget.

Download, cache and show images in a flutter app

File picker plugin for Flutter, compatible with mobile (iOS & Android), Web, Desktop (Mac, Linux, Windows) platforms with Flutter Go support.

An awesome list that curates the best Flutter libraries, tools, tutorials, articles and more.

Quick Overview

Flutter Launcher Icons is a command-line tool and package for Flutter that simplifies the process of generating and updating launcher icons for both Android and iOS platforms. It automates the creation of icons in various sizes and formats required by different devices and app stores.

Pros

  • Saves time by automating the icon generation process for multiple platforms
  • Supports various image formats (PNG, JPEG, WebP) as input
  • Allows customization of icon background and adaptive icons for Android
  • Integrates easily with existing Flutter projects

Cons

  • Limited to launcher icons only, doesn't handle other app assets
  • Requires manual configuration in pubspec.yaml file
  • May require additional setup for some advanced features
  • Dependency on external packages may lead to potential conflicts

Code Examples

  1. Basic configuration in pubspec.yaml:
dev_dependencies:
  flutter_launcher_icons: "^0.13.1"

flutter_launcher_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"
  1. Generating adaptive icons for Android:
flutter_launcher_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"
  adaptive_icon_background: "#ffffff"
  adaptive_icon_foreground: "assets/icon/foreground.png"
  1. Customizing icon size and removing alpha channel:
flutter_launcher_icons:
  android: true
  ios: true
  image_path: "assets/icon/icon.png"
  min_sdk_android: 21
  web:
    generate: true
    image_path: "assets/icon/icon.png"
    background_color: "#hexcode"
    theme_color: "#hexcode"
  windows:
    generate: true
    image_path: "assets/icon/icon.png"
    icon_size: 48
  macos:
    generate: true
    image_path: "assets/icon/icon.png"
  remove_alpha_ios: true

Getting Started

  1. Add flutter_launcher_icons to your pubspec.yaml:

    dev_dependencies:
      flutter_launcher_icons: "^0.13.1"
    
  2. Configure your icons in pubspec.yaml:

    flutter_launcher_icons:
      android: "launcher_icon"
      ios: true
      image_path: "assets/icon/icon.png"
    
  3. Run the package:

    flutter pub get
    flutter pub run flutter_launcher_icons
    
  4. Your launcher icons will be generated and updated in your project.

Competitor Comparisons

React hooks for Flutter. Hooks are a new kind of object that manages a Widget life-cycles. They are used to increase code sharing between widgets and as a complete replacement for StatefulWidget.

Pros of flutter_hooks

  • Provides a more functional approach to state management in Flutter
  • Allows for reusable logic across different widgets
  • Reduces boilerplate code and improves code organization

Cons of flutter_hooks

  • Steeper learning curve for developers new to the hooks concept
  • May not be suitable for all types of state management scenarios
  • Requires additional package dependency

Code Comparison

flutter_hooks:

import 'package:flutter_hooks/flutter_hooks.dart';

class MyWidget extends HookWidget {
  @override
  Widget build(BuildContext context) {
    final counter = useState(0);
    return Text('Count: ${counter.value}');
  }
}

flutter_launcher_icons:

dev_dependencies:
  flutter_launcher_icons: "^0.9.2"

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

flutter_hooks focuses on state management and widget logic, while flutter_launcher_icons is a tool for generating app icons. The former uses Dart code to define hooks and widget behavior, while the latter uses YAML configuration to specify icon generation settings. flutter_hooks is more about runtime behavior, whereas flutter_launcher_icons is a build-time tool for asset generation.

Download, cache and show images in a flutter app

Pros of flutter_cached_network_image

  • Specialized for image caching and loading, providing efficient network image management
  • Offers more advanced features like placeholder images and error handling
  • Actively maintained with frequent updates and bug fixes

Cons of flutter_cached_network_image

  • More complex to implement compared to the straightforward launcher icon generation
  • Requires additional setup and configuration for optimal performance
  • May introduce overhead for simple image loading scenarios

Code Comparison

flutter_cached_network_image:

CachedNetworkImage(
  imageUrl: "https://example.com/image.jpg",
  placeholder: (context, url) => CircularProgressIndicator(),
  errorWidget: (context, url, error) => Icon(Icons.error),
)

flutter_launcher_icons:

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

While flutter_cached_network_image focuses on runtime image loading and caching, flutter_launcher_icons is used during development to generate app icons. The former requires Dart code implementation, while the latter is configured in the pubspec.yaml file.

flutter_cached_network_image is better suited for apps that heavily rely on network images and need advanced caching capabilities. On the other hand, flutter_launcher_icons is a simpler tool that serves a specific purpose of generating app icons for different platforms.

File picker plugin for Flutter, compatible with mobile (iOS & Android), Web, Desktop (Mac, Linux, Windows) platforms with Flutter Go support.

Pros of flutter_file_picker

  • Provides file picking functionality for multiple platforms (iOS, Android, Web)
  • Supports various file types and custom file extensions
  • Allows for multiple file selection and directory picking

Cons of flutter_file_picker

  • More complex setup and configuration compared to flutter_launcher_icons
  • Requires additional permissions and setup for different platforms
  • May have performance implications when dealing with large files or numerous selections

Code Comparison

flutter_file_picker:

FilePickerResult? result = await FilePicker.platform.pickFiles(
  type: FileType.custom,
  allowedExtensions: ['jpg', 'pdf', 'doc'],
);

if (result != null) {
  File file = File(result.files.single.path!);
}

flutter_launcher_icons:

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

flutter_file_picker is focused on runtime file selection, while flutter_launcher_icons is used for configuring app icons during the build process. The former requires more runtime code, while the latter is primarily configuration-based.

flutter_file_picker offers more flexibility for user interactions, allowing file selection during app usage. flutter_launcher_icons, on the other hand, simplifies the process of setting up app icons across different platforms, which is typically a one-time setup during development.

An awesome list that curates the best Flutter libraries, tools, tutorials, articles and more.

Pros of awesome-flutter

  • Comprehensive resource collection for Flutter developers
  • Regularly updated with new tools, libraries, and tutorials
  • Covers a wide range of Flutter-related topics

Cons of awesome-flutter

  • Not a specific tool or library, but a curated list
  • May require additional effort to find and implement specific solutions

Code comparison

Not applicable, as awesome-flutter is a curated list and doesn't contain code snippets for direct comparison.

Pros of flutter_launcher_icons

  • Specific tool for generating launcher icons for Flutter apps
  • Simplifies the process of creating and updating app icons
  • Supports multiple platforms (iOS and Android)

Cons of flutter_launcher_icons

  • Limited to icon generation functionality
  • May require additional configuration for complex icon requirements

Code comparison

flutter_launcher_icons:

dev_dependencies:
  flutter_launcher_icons: "^0.9.2"

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

awesome-flutter:

No direct code comparison available, as it's a curated list of resources.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Flutter Launcher Icons

Flutter Community: flutter_launcher_icons

pub package

A command-line tool which simplifies the task of updating your Flutter app's launcher icon. Fully flexible, allowing you to choose what platform you wish to update the launcher icon for and if you want, the option to keep your old launcher icon in case you want to revert back sometime in the future.

:book: Guide

1. Setup the config file

Run the following command to create a new config automatically:

flutter pub run flutter_launcher_icons:generate

This will create a new file called flutter_launcher_icons.yaml in your flutter project's root directory.

If you want to override the default location or name of the config file, use the -f flag:

flutter pub run flutter_launcher_icons:generate -f <your config file name here>

To override an existing config file, use the -o flag:

flutter pub run flutter_launcher_icons:generate -o

OR

Add your Flutter Launcher Icons configuration to your pubspec.yaml.
An example is shown below. More complex examples can be found in the example projects.

dev_dependencies:
  flutter_launcher_icons: "^0.13.1"

flutter_launcher_icons:
  android: "launcher_icon"
  ios: true
  image_path: "assets/icon/icon.png"
  min_sdk_android: 21 # android min sdk min:16, default 21
  web:
    generate: true
    image_path: "path/to/image.png"
    background_color: "#hexcode"
    theme_color: "#hexcode"
  windows:
    generate: true
    image_path: "path/to/image.png"
    icon_size: 48 # min:48, max:256, default: 48
  macos:
    generate: true
    image_path: "path/to/image.png"

2. Run the package

After setting up the configuration, all that is left to do is run the package.

flutter pub get
flutter pub run flutter_launcher_icons

If you name your configuration file something other than flutter_launcher_icons.yaml or pubspec.yaml you will need to specify the name of the file when running the package.

flutter pub get
flutter pub run flutter_launcher_icons -f <your config file name here>

Note: If you are not using the existing pubspec.yaml ensure that your config file is located in the same directory as it.

If you encounter any issues please report them here.

In the above configuration, the package is setup to replace the existing launcher icons in both the Android and iOS project with the icon located in the image path specified above and given the name "launcher_icon" in the Android project and "Example-Icon" in the iOS project.

:mag: Attributes

Shown below is the full list of attributes which you can specify within your Flutter Launcher Icons configuration.

Global

  • image_path: The location of the icon image file which you want to use as the app launcher icon.

Android

  • android

    • true: Override the default existing Flutter launcher icon for the platform specified
    • false: Ignore making launcher icons for this platform
    • icon/path/here.png: This will generate a new launcher icons for the platform with the name you specify, without removing the old default existing Flutter launcher icon.
  • image_path: The location of the icon image file which you want to use as the app launcher icon

  • image_path_android: The location of the icon image file specific for Android platform (optional - if not defined then the image_path is used)

  • min_sdk_android: Specify android min sdk value The next two attributes are only used when generating Android launcher icon

  • adaptive_icon_background: The color (E.g. "#ffffff") or image asset (E.g. "assets/images/christmas-background.png") which will be used to fill out the background of the adaptive icon.

  • adaptive_icon_foreground: The image asset which will be used for the icon foreground of the adaptive icon Note: Adaptive Icons will only be generated when both adaptive_icon_background and adaptive_icon_foreground are specified. (the image_path is not automatically taken as foreground)

  • adaptive_icon_monochrome: The image asset which will be used for the icon foreground of the Android 13+ themed icon. For more information see Android Adaptive Icons

IOS

  • ios
    • true: Override the default existing Flutter launcher icon for the platform specified
    • false: Ignore making launcher icons for this platform
    • icon/path/here.png: This will generate a new launcher icons for the platform with the name you specify, without removing the old default existing Flutter launcher icon.
  • image_path_ios: The location of the icon image file specific for iOS platform (optional - if not defined then the image_path is used)
  • remove_alpha_ios: Removes alpha channel for IOS icons
  • background_color_ios: The color (in the format "#RRGGBB") to be used as the background when removing the alpha channel. It is used only when the remove_alpha_ios property is set to true. (optional - if not defined then #ffffff is used)

Web

  • web: Add web related configs
    • generate: Specifies whether to generate icons for this platform or not
    • image_path: Path to web icon.png
    • background_color: Updates background_color in web/manifest.json
    • theme_color: Updates theme_color in web/manifest.json

Windows

  • windows: Add Windows related configs
    • generate: Specifies whether to generate icons for Windows platform or not
    • image_path: Path to web icon.png
    • icon_size: Windows app icon size. Icon size should be within this constrains 48<=icon_size<=256, defaults to 48

MacOS

  • macos: Add MacOS related configs
    • generate: Specifies whether to generate icons for MacOS platform or not
    • image_path: Path to macos icon.png file

Note: iOS icons should fill the entire image and not contain transparent borders.

Flavor support

Create a Flutter Launcher Icons configuration file for your flavor. The config file is called flutter_launcher_icons-<flavor>.yaml by replacing <flavor> by the name of your desired flavor.

The configuration file format is the same.

An example project with flavor support enabled has been added to the examples.

:question: Troubleshooting

Listed a couple common issues with solutions for them

Generated icon color is different from the original icon

Caused by an update to the image dependency which is used by Flutter Launcher Icons.

Use #AARRGGBB for colors instead of #AABBGGRR, to be compatible with Flutter image class.

Related issue

Image foreground is too big / too small

For best results try and use a foreground image which has padding much like the one in the example.

Related issue

Dependency incompatible

You may receive a message similar to the following

Because flutter_launcher_icons >=0.9.0 depends on args 2.0.0 and flutter_native_splash 1.2.0 depends on args ^2.1.1, flutter_launcher_icons >=0.9.0 is incompatible with flutter_native_splash 1.2.0.
And because no versions of flutter_native_splash match >1.2.0 <2.0.0, flutter_launcher_icons >=0.9.0 is incompatible with flutter_native_splash ^1.2.0.
So, because enstack depends on both flutter_native_splash ^1.2.0 and flutter_launcher_icons ^0.9.0, version solving failed.
pub get failed (1; So, because enstack depends on both flutter_native_splash ^1.2.0 and flutter_launcher_icons ^0.9.0, version solving failed.)

For a quick fix, you can temporarily override all references to a dependency: See here for an example.

:eyes: Example

Video Example

Note: This is showing a very old version (v0.0.5)

Special thanks

  • Thanks to Brendan Duncan for the underlying image package to transform the icons.
  • Big thank you to all the contributors to the project. Every PR / reported issue is greatly appreciated!