构建Flutter应用

下载Flutter SDK

mac os环境
可以添加镜像服务器到环境变量中(https://flutterchina.club/setup-macos/)

export PUB_HOSTED_URL=https://pub.flutter-io.cn
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

下载地址(https://flutter.dev/docs/development/tools/sdk/archive?tab=macos#macos)
解压unzip 或者 tar -zxvf

解压成功够添加环境变量

vim /etc/profile
source profile

执行

flutter doctor

如果正确的话会显示还需要安装哪些组件，如果出现错误那么请检查之前的步骤，或者下载的sdk是否有问题

根据doctor提示，全部都是✅即可，或者只有android也可以，但是IOS真机无法调试

IDE设置

https://flutterchina.club/get-started/editor/#androidsstudio
IDE可以用android studio 或者 vs code

可以新建工程尝试hello word

Flutter应用加入Android项目

1.首先创建一个flutter_module项目
2.在你主项目的settings.gradle中添加下列代码

setBinding(new Binding([gradle: this]))
evaluate(new File(
        '你的目录/flutter_module/.android/include_flutter.groovy'
))
或者
setBinding(new Binding([gradle: this]))
evaluate(new File(
        settingsDir.parentFile,
        'flutter_module/.android/include_flutter.groovy'
))

3.在主项目的app目录下的build.gradle文件中添加Flutter库的依赖

dependencies {
  implementation project(':flutter')
}

4.页面的跳转

public class MyFlutterActivity extends FlutterActivity{
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        GeneratedPluginRegistrant.registerWith(this);
    }

}

这样基本上就ok了，可以运行起来测试一下看是否能跳转flutter页面

如果失败那么需要看看主app assets目录下有没有flutter_assets这个文件夹，如果没有可能是权限问题，无法复制flutter_module的这个文件到主目录下
可以去flutter_module目录下找flutter_assets并复制到app assets目录下

还有一种失败可能是ABI设置问题

ndk {
            // 设置支持的 SO 库构架
            abiFilters 'armeabi', 'armeabi-v7a' , 'x86'
        }

Flutter返回Native

MyFlutterActivity增加Plugin监听

public class MyFlutterActivity extends FlutterActivity{
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        new MethodChannel(getFlutterView(),  "f.route/plugin")
                .setMethodCallHandler((methodCall, result) -> {
            //判断call返回参数，跳转相应逻辑
            switch (methodCall.method){
                case "finish": {
                    finish();
                    result.success("200");
                    break;
                }
                default:result.notImplemented();
            }
        });
        GeneratedPluginRegistrant.registerWith(this);

    }

}

Flutter页面增加跳转

最简单不带参数的跳转

const routePlugin =const MethodChannel("f.route/plugin");  
    Future<Null> _onRouteFinish() async {
      String result =await routePlugin.invokeMethod("finish");
    }

Flutter页面增加按钮并设置调用方法

                      FlatButton(
                        child: Image(image: AssetImage("images/icon_back.png"),
                          width: 16,
                          height: 16,
                        ),
                        onPressed: _onRouteFinish,
                      )

这样基本上就成功了。