introduce

There are two common multi-channel packaging methods: Flavor and — Dart-define. The latter is an optional command line parameter added in Flutter1.17. It is easier to configure than Flavor and is suitable for environment configuration.

Run the command:

flutter run --dart-define=DARTDEFINE_APP_ENV=debug 
Copy the code

This article uses the title, domain name, and AppName as the environment variables to dynamically change, and starts the — Dart-define configuration journey.

Flutter configuration

Environment configuration

Create an environment configuration file that can be used to obtain different environment variables entered on the command line.

Class EnvConfig {final String appTitle; final String appDomain; EnvConfig({ required this.appTitle, required this.appDomain, }); Class Env {static const appEnv = string.fromEnvironment (envname.envkey); Static final envconfig_debugConfig = EnvConfig(appTitle: "debugTitle", appDomain: "http://www.debugxxx.com", ); Static final EnvConfig _releaseConfig = EnvConfig(appTitle: "releaseTitle", appDomain: "http://www.releasexxx.com", ); Static final envconfig_testConfig = EnvConfig(appTitle: "testTitle", appDomain: "http://www.testxxx.com",); static EnvConfig get envConfig => _getEnvConfig(); Static EnvConfig _getEnvConfig() {switch (appEnv) {case envname.debug: return _debugConfig; case EnvName.release: return _releaseConfig; case EnvName.test: return _testConfig; default: return _debugConfig; Class EnvName {// Environment key static const String envKey = "DART_DEFINE_APP_ENV"; // environment value static const String debug = "debug"; static const String release = "release"; static const String test = "test"; }Copy the code

Three environments are declared in EnvName, which is the value to be filled in in the run command and the package command. EnvKey is the corresponding key.

Using a configuration

In the main file, use the previously configured value, title using the configured title, and display the configured domain name in the page:

return Scaffold( appBar: AppBar( title: Text(Env.envConfig.appTitle), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[Text(' env.envconfig.appdomain, '), Text(env.envconfig.appdomain, style: Theme.of(context).textTheme.headline4, ), ], ), ), );Copy the code

run

Enter the command on the terminal and run the debug environment first:

flutter run --dart-define=DART_DEFINE_APP_ENV=debug
Copy the code

Note that DART_DEFINE_APP_ENV and debug correspond to env_config.

The title and domain name are debug parameters configured in Env.

Then run the test environment:

flutter run --dart-define=DART_DEFINE_APP_ENV=test 
Copy the code

IDE configuration

What if the command line is prone to typing errors? Configure the IDE.

  1. Click Edit Configuration on the menu

  1. Enter the command:

  1. addtestConfiguration:

I made a copy, called test, and changed the parameter to test

  1. Let’s go ahead and make a copyrelease.

Then select the configuration for which environment you want to run.

Android configuration

Configuration information is not only used in the DART file, but also in native code, such as configuration push and bugly, and testers may require different application name suffixes to be configured to distinguish between environments, which may need to be modified in native code.

Set the default configuration parameters in build.gradle

Def dartDefine = [DARTDEFINE_APP_ENV: 'debug',] // android/app/build.gradle // set default configuration parameters def dartDefine = [DARTDEFINE_APP_ENV: 'debug',]Copy the code

The defined key-value pairs are then obtained from DART-defines and added to dartEnv.

// android/app/build.gradle // set the default configuration parameter def dartDefine = [DART_DEFINE_APP_ENV: 'debug', ] if (project.hasProperty('dart-defines')) { dartDefine = dartDefine + project.property('dart-defines') .split(',') .collectEntries { entry -> def pair = URLDecoder.decode(entry).split('=') [(pair.first()): pair.last()] } }Copy the code

Define resValue, or BuildConfig, where we need to reference the String resource to change the name of the application, so use resValue:

    defaultConfig {
        applicationId "com.example.flutter_flavors"
        minSdkVersion 16
        targetSdkVersion 30
        versionCode flutterVersionCode.toInteger()
        versionName flutterVersionName
        resValue "string"."app_name"."flutter_flavor${dartEnv.DART_DEFINE_APP_ENV}"
    }
Copy the code

In the manifest file quote:

   <application
       android:label="@string/app_name"
        android:icon="@mipmap/ic_launcher">
Copy the code

Each time you run a different environment, you’ll see a different application name. You can also get the defined value in the code by using getString(“app_name”).

Ios configuration

Right-click the project and select Open in XCode:

Right-click the Flutter directory and select New Flie, as shown below. Enter the name Dart:

Add default values:

DART_DEFINE_APP_ENV=flutter_flavor
Copy the code

Add references to debug. xcconfig and release.xcconfig respectively:

#include "DartDefine.xcconfig"
#include "DartDefineConfig.xcconfig"
Copy the code

The first line refers to the configuration file we created, and the second line is generated at compile time (the next step is to configure the generated code).

Modify Bundle name to our configured value in Info:

Edit the Schema:

Two things to note here are that Runner is selected above and the output file name below is the same as the one referenced in the previous step.

The Ios configuration is complete. Select Test to configure run:

The application name becomes the configuration of choice.

packaging

Package commands have the same suffix as run commands:

flutter build apk --dart-define=DARTDEFINE_APP_ENV=release
Copy the code

Source Flutter environment:

Doctor summary (to see all details, run flutter doctor -v): ✓] Flutter (Channel stable, 2.0.5, on Mac OS X 10.15.6 19G2021 Darwin-x64, ✓ ✓ Android toolchain-develop for Android Devices (Android SDK version 30.0.3) [✓] Xcode-develop Chrome - Develop for the web [✓] Android Studio (version 4.2) [✓] VS Code (version 1.56.0) [✓] Connected device (2 available)Copy the code