Flutter Application

1. Manual integration

flutter create myApp

if wanting to specify the developing language

flutter create -i swift -a kotlin xxapp

2. Created by Android studio

   1. Click Create New Project from the Welcome window or File > New > Project from the main IDE window.
   2. Select Flutter in the menu, and click Next.
   3. Enter your desired Project name and Project location.
   4. Click Finish.

3. The structure of application

capture_application.PNG

</br></br>

Flutter Module

1. Manual integration

flutter create -t module --org com.example my_flutter

2. Created by Android studio

Using the File > New > New Module… menu in Android Studio in your existing Android project, you can either create a new Flutter module to integrate, or select an existing Flutter module that was created previously.

capture_create_step_one.png

If you create a new module, you can use a wizard to select the module name, location, and so on.

[图片上传失败...(image-954fc0-1621912793341)]

capture_create_step_two.png

The Android Studio plugin automatically configures your Android project to add your Flutter module as a dependency, and your app is ready to build.

3. The structure of project

[图片上传失败...(image-67093c-1621912793341)]

capture_module.PNG

</br></br>

Flutter Package

flutter create --template=package xxapp_package

1. The structure of project

[图片上传失败...(image-b27285-1621912793341)]

capture_package.PNG

2. publish package

please refer to:

Publishing packages

</br></br>

Flutter Plugin

flutter create --template=plugin xxapp_plugin

1. The structure of project

The whole project includes four main directories, and the corresponding Native codes are in the android and ios directories. Lib is the Flutter code of the plugin. Example is a complete Flutter App.

capture_plugin.PNG

2. android platform code

Before you add the android code, you need to make sure that the plug-in code is built once through the example project.

//first executing
cd flutter_plugin_demo/example/

//then executing
flutter build apk

After building the Android apk package in the example project, you can open the Android project in the example project through Android Studio. Then you can edit the class file to add plug-in functionality. In the android directory, the IDE will generate an xxxplugin.java file for you. When you open it, you can see the following sample code:

Capture_plugin_zero.PNG

There is a class FlutterPlugin that implements MethodCallHandler and a static function registerWith（which is retained to support for the old flutter version）. In this static function, a new MethodChannel is created and an instance of FlutterPlugin is set to the MehodChannel. In other words, all the methodchannels and eventchannels in your plug-in are registered to the Host App through this function. the new API MethodCallHandler will be initialized and built in the onAttachedToEngine method and released in the onDetachedFromEngine method. In this way, the corresponding channel can be found when Flutter is called. we just need to rewrite the function onMethodCall.

3. lib direcotry

IDE in the lib directory will automatically generate flutter_plugin.dart file for you. This is where the Flutter code of the plug-in is located. which is the packaging of Platform channels defined.

Capture_plugin_lib.PNG

4. Example App

Future<void> initPlatformState() async {
    String platformVersion;
    // Platform messages may fail, so we use a try/catch PlatformException.
    try {
      platformVersion = await MyFlutterPlugin.platformVersion;
    } on PlatformException {
      platformVersion = 'Failed to get platform version.';
    }

    // If the widget was removed from the tree while the asynchronous platform
    // message was in flight, we want to discard the reply rather than calling
    // setState to update our non-existent appearance.
    if (!mounted) return;

    setState(() {
      _platformVersion = platformVersion;
    });
  }

5. Release

Running the following command to see if the plug-in can be published

flutter packages pub publish --dry-run

If there is a problem, it will output the error information in the terminal, and you need to modify it until it returns successfully. You can refer to the official documentation for specific problems.

At last, running the following command to publish the plug-in.

flutter packages pub publish

6. The plug-in registration

The registration of the plug-in is done automatically and doesn't need to register manually.

In MainActivity of example app:

public class MainActivity extends FlutterActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // plug-in is registered here.
    GeneratedPluginRegistrant.registerWith(this);
  }
}

GeneratedPluginRegistrant.class:

public final class GeneratedPluginRegistrant {
  public static void registerWith(@NonNull FlutterEngine flutterEngine) {
    flutterEngine.getPlugins().add(new com.example.my_flutter_plugin.MyFlutterPlugin());
  }
}

7. Conclusion

   1. Be sure to use the example project to build the platform code once before adding the plug-in code, so that the plug-in files are displayed correctly for editing in the example project.

   2. If the plug-in functions need to rely on the third-party plug-in, then the third-party plug-in can also be added through pubspec.yaml in the plug-in project.

</br></br>

Multiple module support or workaround

1. Import multiple Flutter modules in a native app is not support now.
   cause: It seems that Flutter doesn't support this use-case because FlutterEngine can only load a single specific set of AOT snapshots in an application.

2. workaround

</br></br>

ARM/X86 CPU mode support

Flutter currently only supports building ahead-of-time (AOT) compiled libraries for x86_64, armeabi-v7a and arm64-v8a.

The Flutter engine has an x86 and x86_64 version. When using an emulator in debug Just-In-Time (JIT) mode, the Flutter module still runs correctly.

refer to: https://flutter.dev/docs/development/add-to-app/android/project-setup

</br></br>

Certificate pinning verification

ssl_pinning_plugin

refer to: https://pub.dev/packages/ssl_pinning_plugin

A plugin for check SSL Pinning on request HTTP. Checks the equality between the known SHA-1 or SHA-256 fingerprint and the SHA-1 or SHA-256 of the target server.

httpclient

 HttpClient httpClient = new HttpClient()
  ..badCertificateCallback =
  ((X509Certificate cert, String host, int port) {
    // tests that cert is self signed, correct subject and correct date(s) 
    return (cert.issuer == cert.subject &&
        cert.subject == 'MySelfSignedCertCN' &&
        cert.endValidity.millisecondsSinceEpoch == 1234567890);
  });

IOClient ioClient = new IOClient(httpClient);
// use ioClient to perform get/post operations from package:http

// don't forget to call ioClient.close() when done
// note, this also closes the underlying HttpClient

http

import 'package:http/http.dart' as http;

http.Client sslClient() {
  var ioClient = new HttpClient()
    ..badCertificateCallback = (X509Certificate cert, String host, int port) => true;
  http.Client _client = IOClient(ioClient);

  return _client;
}
//get 
sslClient().get(url) 
//post
sslClient().post(url) 

Dio

There are two ways to verify the https certificate. Suppose the certificate format is PEM, the code like:

String PEM="XXXXX"; // certificate content
(dio.httpClientAdapter as DefaultHttpClientAdapter).onHttpClientCreate  = (client) {
    client.badCertificateCallback=(X509Certificate cert, String host, int port){
        if(cert.pem==PEM){ // Verify the certificate
            return true;
        }
        return false;
    };
};

Another way is creating a SecurityContext when create the HttpClient:

(dio.httpClientAdapter as DefaultHttpClientAdapter).onHttpClientCreate  = (client) {
    SecurityContext sc = new SecurityContext();
    //file is the path of certificate
    sc.setTrustedCertificates(file);
    HttpClient httpClient = new HttpClient(context: sc);
    return httpClient;
};

In this way, the format of certificate must be PEM or PKCS12.

</br></br>

SQLite integration

sqflite

SQLite plugin for Flutter. Supports iOS, Android and MacOS.

</br></br>

Firebase Analytics function

the official document