官方文档-> 点击
本文只针对Android客户端集成操作，以下是亲自试手，按照官方文档有些小改动。
已有项目相关环境：
- minSdkVersion 16
- gradle 插件v3.1.1
- gradle 版本 v4.10.1
- flutter SDK版本 v1.5.4-hotfix.2
集成步骤（Mac os）
- 打开terminal,进入到你项目的根目录
cd some/yourproject
- 然后输入以下命令创建
flutter module
//my_flutter为你的module名字
flutter create -t module my_flutter
- 切换到flutter module的android目录下，并让flutter进行debug
cd .android/
./gradlew flutter:assembleDebug
这样就生成了flutter-debug.aar(路径：'.android/Flutter/build/outputs/aar/.')。
- 确认你的宿主App的
build.gradle配置有：
compileOptions {
sourceCompatibility 1.8
targetCompatibility 1.8
}
- 让宿主App以来flutter module，打开根项目
settings.gradle
include ':app'
setBinding(new Binding([gradle:this]))
//YourProjecyName 为你项目的文件名，按照官方文档的写法，会找不到对应的路径，少了一个层级
evaluate(new File(
settingsDir.parentFile,
'YourProjecyName/my_flutter/.android/include_flutter.groovy'
))
- 项目同步成功后需要在app的
build.gradle文件中添加flutter的依赖。
//官网的方式
dependencies{
implementation project(':flutter')
}
//上面的方式各种报错，无法找到对应的module
//换了种方式
dependencies{
implementation project(path: ':flutter')
}
终于整个项目跑通了，去app内的文件内，也能引入flutter相关的Api。大功告成。
Flutter加入到项目中
有两种方式可以将flutter的视图添加到原生项目中：
以下是flutter入口函数main.dart
import 'package:flutter/material.dart';
import 'dart:ui';
import 'package:bear_flutter/ui/WolfPage.dart';
void main() => runApp(_widgetForRoute(window.defaultRouteName));
Widget _widgetForRoute(String route){
switch(route){
case 'route1':
return WolfPage();
default:
return Center(
child: Text("haha"),
);
}
}
- 添加Flutter
fragment
在原生Activity添加FlutterFragment
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_wolf_flutter)
//route1 为flutter项目中的叶脉你路由名字
supportFragmentManager.beginTransaction().replace(R.id.container, Flutter.createFragment("route1"))
.commit()
}
- 添加flutterView
//route1 为flutter项目中的叶脉你路由名字
View flutterView = Flutter.createView(
MainActivity.this,
getLifecycle(),
"route1"
);
FrameLayout.LayoutParams layout = new FrameLayout.LayoutParams(600, 800);
layout.leftMargin = 100;
layout.topMargin = 200;
addContentView(flutterView, layout);
