Flutter 视频系列: 图解 Android 原生集成 Fl

2020-03-24 本文已影响0人小小小小怪兽_666

学习一下 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；

image

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'
  ))

image

在 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全套视频+音视频高手开发）