Flutter初探二(现有App混合Flutter)

看了一段时间的Flutter了,虽然觉得代码嵌套得太厉害了,不过由于它的跨平台,比起H5的速度还是可以让人接受的。看着看着就想着如何在原有的App上去集成 Flutter,官方也考虑到这种情况,也给了我们一个教程,今天参考着教程走一遍这个过程,加深下印象。

首先我们模拟我们现有的App,新建一个原生App环境。


原有App路径.png

然后在现有App根目录的同级目录下新建 Flutter 模块。


新建Flutter模块.png

然后需要在现有 App 配置我们的环境。
settings.gradle:

setBinding(new Binding([gradle: this]))                                 // new
evaluate(new File(                                                                   // new
        settingsDir.parentFile,                                                    // new
        'flutter_module/.android/include_flutter.groovy'                // new
))   

app/build.gradle:

 implementation project(':flutter')

通过上面简单的配置,然后同步成功之后就可以在原有的 App 上调用我们的 Flutter 界面了。

调用一:通过 View 的形式:

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

调用二:通过 Fragment 的形式:

        FragmentTransaction tx = getSupportFragmentManager().beginTransaction();
        tx.replace(R.id.flutter_container, Flutter.createFragment("route1"));
        tx.commit();

至此简单的集成就完成了。后面还需要考虑到如何通过路由去显示不同的界面,如果进行传参,如何进行数据的返回...

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。