Setting up flutter flavors

Illustration depicting various smartphones displaying Flutter app screens customized for different environments: Staging, QA, and Production. Learn how to manage Flutter flavors for efficient app development and deployment

When building mobile applications with Flutter, managing multiple environments such as staging, QA, and production can streamline testing and deployment processes. One efficient way to handle different environments is by using Flutter flavors. Although there are alternative solutions for environment management in Flutter, such as using environment variables or configuration files, flavors offer a more structured and scalable approach for staging, QA, and production builds.

Using flutter flavor for environment management

For implementing flavors in Flutter, we will use the flutter_flavor: 3.0.3 package. This package stands out due to its ease of use, robust features, and popularity. Alternative libraries for managing flavors include flutter_flavorizr, flavor_getter, and sa_flutter_flavor, each offering unique features but flutter_flavor is chosen here for its overall simplicity and widespread use in the Flutter community

We’ll begin by setting up the staging configuration, which will be the default environment. Place this file in the root directory lib/.

// lib/main.dart
import 'package:flutter/material.dart';
import 'package:flutter_flavor/flutter_flavor.dart';
import 'package:flutter_flavors/config.dart';
import 'package:flutter_flavors/screens/home_screen.dart';

void main() {
  FlavorConfig(
    name: "STG",
    variables: {
      "title": StgConfig().title,
    },
  );
  runApp(HomeScreen());
}

Setting up production configuration

Next, we’ll set up the production configuration, which will only be used when explicitly specified. Create a new Dart file named prd.dart under lib/flavors/.

// lib/flavors/prd.dart
import 'package:flutter/material.dart';
import 'package:flutter_flavor/flutter_flavor.dart';
import 'package:flutter_flavors/config.dart';
import 'package:flutter_flavors/screens/home_screen.dart';

void main() {
  FlavorConfig(
    name: "PRD",
    variables: {
      "title": PrdConfig().title,
    },
  );
  runApp(HomeScreen());
}


Setting up QA configuration
We will also set up a QA configuration. Create a new Dart file named qa.dart under lib/flavors/.

// lib/flavors/qa.dart
import 'package:flutter/material.dart';
import 'package:flutter_flavor/flutter_flavor.dart';
import 'package:flutter_flavors/config.dart';
import 'package:flutter_flavors/screens/home_screen.dart';

void main() {
  FlavorConfig(
    name: "QA",
    variables: {
      "title": QAConfig().title,
    },
  );
  runApp(HomeScreen());
}


Configurations

Now, define the configuration classes. Create a config.dart file in the lib/ directory.

// lib/config.dart
abstract class Config {
  String get title;
}
class StgConfig implements Config {
  String get title => "This is Staging App";
}
class PrdConfig implements Config {
  String get title => "This is Production App";
}
class QAConfig implements Config {
  String get title => "This is QA App";
}


Home screen

Define the HomeScreen widget that will display the flavor-specific title. Place this file in lib/screens/.

// lib/screens/home_screen.dart
import 'package:flutter/material.dart';
import 'package:flutter_flavor/flutter_flavor.dart';

class HomeScreen extends StatelessWidget {
  HomeScreen({super.key}); 
   String title = FlavorConfig.instance.variables['title'];  //Getting flavors value
    @override
    Widget build(BuildContext context) {
      return MaterialApp(
        title: "Flutter Flavors",
        debugShowCheckedModeBanner: false,
        home: Scaffold(
          body: Center(
            child: Text(title),
          ),
        ),
      );
    }
}


Building and running the APKs


Build and run the staging APK

To build the APK for the staging environment, use the following command

flutter build apk

For debugging

flutter run


Build and run the QA APK

To build the APK for the QA environment, use the following command

flutter build apk -t lib/flavors/qa.dart

For debugging

flutter run -t lib/flavors/qa.dart

Conclusion

By following this guide, you can easily switch between staging, QA, and production configurations, ensuring a smooth development and deployment workflow. To test the sample, you can find a complete example on GitHub . Happy coding!

WRITTEN BY
Aathithyan Siriramachchanthiran

Our latest blogs

Dive into our blogs and gain insights

"Startups and product development"

State management is a crucial aspect of building robust and maintainable... 

"BrowserStack"

Losing a keystore file, which is essential for signing an Android application ...

"Demystifying serverless computing"

A regular expression is a sequence of characters that pattern in text....

Have you got an idea?

Transform your vision into reality with our custom software solutions, designed to meet your unique needs and aspirations.

"Have you got an idea?"