原生应用添加 Flutter 模块依赖

946 阅读1分钟

Flutter 可以作为一个库或模块,集成进现有的应用当中。

  • Android 应用中,Flutter 可以作为 AAR 嵌入。
  • IOS 应用中,Flutter 可以以 framework 框架的形式进行添加。

Android 集成 Flutter AAR

生成 aar

在flutter 项目中,通过如下命令,生成 aar

  flutter build aar

将 aar 添加到原生android 项目

将 flutter_im.aar 复制到 android 项目下 app/libs

注:flutter_im.aar为生成的 aar,可以根据需要命名。这里命名为 flutter_im

image-20210109150023893

app build.grade配置

 defaultConfig {
        ndk {
            // 过滤Flutter支持的架构。
            abiFilters 'armeabi-v7a', 'arm64-v8a', 'x86_64'
        }
}


repositories {
    flatDir {
    dirs 'libs'   // aar目录
  }
}

//添加如下:
dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation(name: 'flutter_im', ext: 'aar')
    
    //版本号,在生成 aar 的 flutter 项目的 build 中可以查看
    def flutterVersion = '1.0.0-ae90085a8437c0ae94d6b5ad2741739ebc742cb4'
    implementation "io.flutter:flutter_embedding_release:$flutterVersion"
    implementation "io.flutter:armeabi_v7a_release:$flutterVersion"
    implementation "io.flutter:arm64_v8a_release:$flutterVersion"
    implementation "io.flutter:x86_64_release:$flutterVersion"
}

外层build.grade配置

allprojects {
    repositories {
        google()
        jcenter()
        maven {
            url "https://storage.flutter-io.cn/download.flutter.io"
        }
    }
}

在清单文件中加入 FlutterActivity

 <activity
            android:name="io.flutter.embedding.android.FlutterActivity"
      			android:configChanges="orientation|keyboardHidden|keyboard|screenSize
                           |locale|layoutDirection|fontScale|screenLayout|density|uiMode"
            android:hardwareAccelerated="true"
            android:windowSoftInputMode="adjustResize" />

启动页面, 注意导包 io.flutter.embedding.android

// 直接启动 
startActivity(FlutterActivity.createDefaultIntent(this))

使用缓存的 FlutterEngine,加快 flutter 页面的启动

// 1. Application 类中预先初始化一个 FlutterEngine
class MyApplication : Application() {
    lateinit var flutterEngine : FlutterEngine

    override fun onCreate() {
        super.onCreate()

        // 实例化FlutterEngine。
        flutterEngine = FlutterEngine(this)

        // 开始执行Dart代码,以初始化FlutterEngine。
        flutterEngine.dartExecutor.executeDartEntrypoint(
            DartExecutor.DartEntrypoint.createDefault()
        )

        // 缓存FlutterActivity要使用的FlutterEngine。
        FlutterEngineCache
            .getInstance()
            .put("hgg_im", flutterEngine)
    }
}

// 使用缓存的 FlutterEngine 启动
   startActivity(
                FlutterActivity
                    .withCachedEngine("hgg_im")
                    .build(this)
            )

Ios 集成 Flutter Frameworks

生成 frameworks

在flutter 项目中,运行如下命令

  flutter build ios-framework --xcframework --no-universal

生成 App.xcframework 和 Flutter.xcframework

将 frameworks 添加到 Ios 项目

拖拽 frameworks 到你的应用 target编译设置的

General > Frameworks, Libraries, and Embedded Content 下,

然后在 Embed 下拉列表中选择 “Embed & Sign”。

初始化flutterEngine

import UIKit
import Flutter

@main
class AppDelegate: FlutterAppDelegate {
    lazy var flutterEngine = FlutterEngine(name: "hgg_im")

    override func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
            flutterEngine.run();
            return super.application(application, didFinishLaunchingWithOptions: launchOptions);
    }
}

启动页面

 let flutterEngine = (UIApplication.shared.delegate as! AppDelegate).flutterEngine
 let flutterViewController =
         FlutterViewController(engine: flutterEngine, nibName: nil, bundle: nil)
 //flutterViewController.modalPresentationStyle = UIModalPresentationStyle.fullScreen;
 present(flutterViewController, animated: true, completion: nil)