How to Use Flavors in Flutter for Multiple App Variants

In Flutter, flavors let you create multiple versions of your app with different settings like API endpoints or app names. You set up flavors by configuring build targets in flutter and platform-specific files, then run your app with the chosen flavor using commands like flutter run --flavor.

Syntax

Flutter flavors are configured by defining different build targets and environment variables. You use the --flavor flag with Flutter commands to specify which flavor to build or run.

On Android, flavors are set in android/app/build.gradle inside productFlavors. On iOS, flavors are configured in Xcode by creating different schemes and targets.

Example Flutter command syntax:

• flutter run --flavor <flavorName> -t lib/main_<flavorName>.dart
• flutter build apk --flavor <flavorName>

bash

flutter run --flavor dev -t lib/main_dev.dart
flutter build apk --flavor prod

Example

This example shows how to create two flavors: dev and prod. Each flavor uses a different main entry file and API URL.

It demonstrates how to configure Android flavors, create separate Dart entry points, and run the app with a flavor.

kotlin/dart

/* android/app/build.gradle */
android {
  flavorDimensions "app"
  productFlavors {
    dev {
      dimension "app"
      applicationIdSuffix ".dev"
      versionNameSuffix "-dev"
    }
    prod {
      dimension "app"
    }
  }
}

// lib/main_dev.dart
import 'package:flutter/material.dart';
import 'app.dart';

void main() {
  runApp(App(apiUrl: 'https://dev.api.example.com'));
}

// lib/main_prod.dart
import 'package:flutter/material.dart';
import 'app.dart';

void main() {
  runApp(App(apiUrl: 'https://api.example.com'));
}

// lib/app.dart
import 'package:flutter/material.dart';

class App extends StatelessWidget {
  final String apiUrl;
  const App({required this.apiUrl, super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Flavor Example')),
        body: Center(child: Text('API URL: ' + apiUrl)),
      ),
    );
  }
}

Output

App bar with title 'Flavor Example' and centered text showing 'API URL: https://dev.api.example.com' or 'API URL: https://api.example.com' depending on flavor

Common Pitfalls

• Not creating separate Dart entry points for each flavor causes the app to use wrong configurations.
• Forgetting to configure Android productFlavors or iOS schemes leads to build errors.
• Running flutter run without --flavor runs the default app, ignoring flavors.
• Mixing flavor-specific assets without proper folder structure can cause missing resources.

bash

/* Wrong: Running without flavor */
flutter run

/* Right: Specify flavor and entry point */
flutter run --flavor dev -t lib/main_dev.dart

Quick Reference

Summary tips for using flavors in Flutter:

• Define productFlavors in Android build.gradle.
• Create separate Dart entry files for each flavor.
• Use --flavor flag with Flutter commands.
• Configure iOS schemes and targets for flavors.
• Keep flavor-specific assets organized in separate folders.

Key Takeaways

Use the --flavor flag with Flutter commands to build or run specific app variants.

Configure Android productFlavors and iOS schemes to support flavors at the platform level.

Create separate Dart entry points for each flavor to load different configurations.

Always test each flavor separately to ensure correct settings and assets are used.