哥哥手把手教你Android原生项目集成Flutter,耶 !
方法一:aar集成
1,Android原工程需要使用Java8编译
在工程 build.gradle里面,android{ }下修改
![](https://img.haomeiwen.com/i15581733/6159b0d54762cabe.png)
2,生成aar文件
这一步需要先将Flutter Module生成aar,在Flutter Module的根目录下运行一下命令:
flutter build aar
![](https://img.haomeiwen.com/i15581733/224c2d0fa0d778b7.png)
3,使用aar
主工程的 build.gradle repositories 闭包 里面加入
![](https://img.haomeiwen.com/i15581733/3369b9d4090fd3ab.png)
然后把aar包复制到libs目录下面, app 的build.gradle里面添加依赖
![](https://img.haomeiwen.com/i15581733/327587b238a9726d.png)
编译成功,就是大功告成
二,源码方式集成,直接引入Flutter Module
1、 依次点击左上角的File --> New --> New Flutter Project
2、然后选择Flutter Module。
![](https://img.haomeiwen.com/i15581733/dae20365bdf4af5f.png)
3,在项目根目录settings.gradle文件中配置:
![](https://img.haomeiwen.com/i15581733/b7971c2a053a6df3.png)
官网在跟项目同级创建 flutter module 是没问题的。但是我们现在改了,应该怎样设置呢?
![](https://img.haomeiwen.com/i15581733/14eebbbad199a440.png)
Tips:注意相对路径的使用,重点是找到 include_flutter.groovy
![](https://img.haomeiwen.com/i15581733/6256471a7d460741.png)
案例一:
在 settings 所在目录有 sub/my_flutter/.android/include_flutter.groovy 文件:
![](https://img.haomeiwen.com/i15581733/6fc033f8f696aa1f.png)
案例二:
在 settings 所在目录的父目录有 MyApp/sub/my_flutter/.android/include_flutter.groovy 文件
![](https://img.haomeiwen.com/i15581733/d93cd59b7aad4eac.png)
在APP下的Gradle文件中添加:
![](https://img.haomeiwen.com/i15581733/5cd550b67ee87b6d.png)
完成这几步就顺利完成在原生项目中集成flutter module了
-------------------------------------------------------------------------------------------------------------------------------------
接下来讲原生界面与Flutter界面的跳转:
安卓原生界面跳转到flutter界面有两种方式,一种是使用flutterView,另一种是使用 FlutterFragment
先新建一个activity,在oncreate方法中加入以下代码:
![](https://img.haomeiwen.com/i15581733/df44bf4368dee5a6.png)
Flutter.createView()方法返回的是一个FlutterView,它继承自View,我们可以把它当做一个普通的View,调用addContentView()方法将这个View添加到Activity的contentView中。我们注意到Flutter.createView()方法的第三个参数传入了"flutter Route1"字符串,表示路由名称,它确定了Flutter中要显示的Widget,接下来需要在之前创建好的Flutter Module中编写逻辑了,修改main.dart文件中的代码
![](https://img.haomeiwen.com/i15581733/09c83c180dc4caba.png)
在runApp()方法中通过window.defaultRouteName可以获取到我们在Flutter.createView()方法中传入的路由名称,即"flutter Route1",之后编写了一个_widgetForRoute()方法,根据传入的route字符串显示相应的Widget。
最后在Mainacivity中加入跳转事件:
![](https://img.haomeiwen.com/i15581733/6c8ac6e8ffb0012f.png)
最后发现原生的标题栏还在,在style中加入透明标题栏样式
![](https://img.haomeiwen.com/i15581733/88bee82051a52016.png)
OK,如果你走到这里,恭喜你,大功告成!