学习一下 Android 原生如何集成最基本的 Flutter Module
录制了一套完整的flutter开发视频,写一套flutter系列文字版又太费时间,转载见谅。(末尾获取flutter完整视频教程)
转载:https://www.jianshu.com/u/cf68df6e2121
集成方式
1. 新建 Android Project
为了测试方便,新建一个 Android Project,本地路径为 …/ACE_Android/ACE_Demo01;
2. 新建 Flutter Module
2.1 命令行方式
首先采用如下命令行新建一个 Flutter Module,此时本地路径为 …/ACE_Android 与 ACE_Demo01 同级;
flutter create -t module my_flutter

2.2 AndroidStudio 工具方式
用 AndroidStudio 尝试,同样简单便利;File -> New -> New Flutter Project -> Flutter Module;


3. Android Project 中添加依赖
3.1 手动引入
- 在 setting.gradle 中加入 Flutter 的引入;
include ':app'
//加入下面配置
setBinding(new Binding([gradle: this]))
evaluate(new File(
settingsDir.parentFile,
'my_flutter/.android/include_flutter.groovy'
))

- 在 app/build.project 中添加 Flutter 依赖;
implementation project(':flutter')

3.2 AndroidStudio 工具引入
可采用 Flie -> Sync Project with Grdle Files 时,可通过 Import Flutter Module 方式引入;此时若报 The Gradle files could not be updated automatically 则需要手动 3.1 操作;


4. 原生与 Flutter 交互
Android 引用 Flutter 通常是两种,一种是新建一个 View 用来展示 Flutter 页面,另一种是 Fragment;其本质还是将 Flutter View 作为 Android View 的子 View 展示;
新建一个无标题栏的 FlutterActivity 和一个 FlutterFragment,在 MainActivity 添加一个按钮跳转到 FlutterActivity 展示 FlutterFragment;
public class FlutterActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_flutter);
getSupportFragmentManager().beginTransaction()
.replace(R.id.container, new FlutterFragment())
.commit();
}
}
public class FlutterFragment extends Fragment {
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater,
@Nullable ViewGroup container,
@Nullable Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
getActivity().getSupportFragmentManager()
.beginTransaction()
.add(R.id.container, Flutter.createFragment("/"))
.addToBackStack("flFlutter.createFragmentutter")
.commit();
return rootView;
}
}
通过 Flutter.createFragment("/") 设置跳转路由;

5. 签名打包
直接运行 debuge 模式一切正常,只是在跳转 Flutter 时不如直接跳转原生流畅,后期优化;而打包成 release 包与 Android 原生相同,无需特别处理 Flutter Module;
注意事项
1. minSdkVersion >= 16
在集成过程中,使用 Flutter 时会提示 SDK 最低版本在 16 以上,需注意;
2. Flutter Module 路径
在学习过程中,无论是命令行创建还是 AndroidStudio 工具创建 Flutter Module 路径并非一定要与 Android Project 同级,关键是 setting.gradle 路径配置;
new File 文件第一个参数 settingsDir.parentFile 即 Android Project 所在文件路径,第二个参数为 Flutter Module 中 .groovy 路径;我们可以使用只有一个参数的完整路径;
// 两个参数
evaluate(new File(
settingsDir.parentFile,
'my_flutter/.android/include_flutter.groovy'
))
// 一个参数
evaluate(new File(
'/Users/user/Documents/workspace/ACE_Flutter/flutter_module01/flutter_module01/.android/include_flutter.groovy'
))
3. 新的 evalute 会覆盖上一个
测试是,在 setting.gradle 中引入多个 evalue,以为可以同时引入多个 Flutter Module,而实际是后面的引入会覆盖先前的引入,以最后一个 evalue module 为准;

https://github.com/xiangjiana/Android-MS
(点个star。专注分享技术干货/编程资源/求职面试/成长感悟等,关注送983页PDF面试资源,免费下载CSDN资源。领取PDF面试大全,附送CSDN下载资源+flutter全套视频+音视频高手开发)

网友评论