A Guide to Flutter Flavors — Part 3

3 min readNov 4, 2023

Flutter Flavors Configurations For Android

We’re going to build two distinct Flutter mobile apps using the same codebase. One will be named Harry Potter, and the other will be Narnia. We'll assign them the flavor names harrypotter and narnia respectively. The harrypotter flavor will use the com.example.harrypotter bundle identifier, while the narnia flavor will use the com.example.narnia bundle identifier. To ensure everything runs smoothly, we'll need to configure flavors for Android.

First, we need to declare our flavors and application names in android/app/build.gradle for the Android environment:

buildTypes {
    release {
        signingConfig signingConfigs.debug
    }
}

flavorDimensions "default"

productFlavors {
    // Flavor name that is decided in .vscode/launch.json
    harrypotter { 
        dimension "default"
        resValue "string", "app_name", "Harry Potter" // Application NAME
        applicationId "com.example.harrypotter" // Bundle ID
        applicationIdSuffix ""
    }
    // Flavor name that is decided in .vscode/launch.json
    narnia { 
        dimension "default"
        resValue "string", "app_name", "Narnia" // Application NAME
        applicationId "com.example.narnia" // Bundle ID
        applicationIdSuffix ""
    }
}

Next, we need to open android/app/src/main/AndroidManifest.xml to modify the default application name defined by android:label and set it to @string/app_name, which we previously declared in the code above:

android:label="@string/app_name"

The flavors are all set! However, there is one more thing to address. We need to change the application icons based on the selected flavor. To achieve this, we should go to the pubspec.yaml file and include the flutter_launcher_icons package:

dev_dependencies:
  flutter_launcher_icons: ^latest_version

To generate the application icons, you’ll need to prepare two separate configuration files: flutter_launcher_icons-harrypotter.yaml and flutter_launcher_icons-narnia.yaml. These files will specify the icon details for each flavor:

flutter_launcher_icons-harrypotter.yaml:

flutter_launcher_icons:
  android: true
  ios: true
  image_path: 'assets/images/harrypotter.png'
  remove_alpha_ios: true

flutter_launcher_icons-narnia.yaml:

flutter_launcher_icons:
  android: true
  ios: true
  image_path: 'assets/images/narnia.png'
  remove_alpha_ios: true

Finally, you can generate the icons by running the following command in your terminal:

flutter pub run flutter_launcher_icons:main -f flutter_launcher_icons*

You can see the generated icons here:

You’ve successfully set up the Flutter Flavor Configurations for Android!

You can run the Flutter apps with the flavors in debug_mode like this:

flutter run --debug --flavor harrypotter --target lib/main_harrypotter.dart
flutter run --debug --flavor narnia --target lib/main_narnia.dart

You can run the Flutter apps with the flavors in release_mode like this:

flutter run --release --flavor harrypotter --target lib/main_harrypotter.dart
flutter run --release --flavor narnia --target lib/main_narnia.dart

You can build the Flutter apps with the flavors like this:

flutter build apk --release --flavor harrypotter --target lib/main_harrypotter.dart
flutter build apk --release --flavor narnia --target lib/main_narnia.dart

Fantastic! Here’s what we’ve accomplished as a result: