美文网首页
Flutter混合开发初体验:在已有Android项目下导入Fl

Flutter混合开发初体验:在已有Android项目下导入Fl

作者: your_genius | 来源:发表于2019-04-20 17:08 被阅读0次

    Flutter体验

    尝试过flutter方知编程真爱,dart用起来就是爽~
    看到我这篇博客的同学肯定是对flutter有过一些了解,所以不再赘述,直接开干。

    为何要混合开发

    公司的祖传代码,各种库,sdk一般还是java写的,所以向flutter迁移还需要时间,当然flutter也需要时间完善自身,这是一个渐进式的过程。

    开始导入

    • 第一步:(默认同学们已经配置好了flutter环境) 参考官网文档
    • 第二步:在我自己已有的Android项目AdvancedAndroid工程下Terminal内输入命令
    flutter create -t module my_flutter
    

    实际上Android Studio近期版本(比如我的AS 3.3.1)已经集成了创建flutter module的功能,使用AS创建都是一样的。
    正常情况下会显示

    flutter module创建成功.png
    • 第三步:在settings.gradle下添加
    setBinding(new Binding([gradle: this]))                                
    evaluate(new File(                                                     
            settingsDir,                                               
            'tip_flutter/.android/include_flutter.groovy'                         
    ))
    

    注意参数settingDir和官网介绍的不一样,因为我的my_flutter工程在AdvancedAndroid工程目录下。

    • 第四步:在app/build.gradle中添加
    api project(':flutter')
    

    虽然module不是这个名字,现在也是这么写

    • 第五步: 添加FlutterView。在app下创建一个TestFlutterViewActivity和对应的xml,xml中添加一个id = iv_fab的 ImageView,将FlutterVie添加进去
     findViewById(R.id.iv_fab).setOnClickListener(v -> {
                View flutterView = Flutter.createView(
                        TestFlutterViewActivity.this,
                        getLifecycle(),
                        "route1"
                );
    
                LinearLayout.LayoutParams layout = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
                addContentView(flutterView, layout);
            });
    
    • 第六步:在main.dart中添加对应的路由项。
      现在进入到my_flutter Module下,找到main.dart,添加上与"route1"
    Widget _widgetForRoute(String route) {
      switch (route) {
        case 'route1':
          return MyApp();
        default:
          return MyApp();
      }
    }
    

    后面的内容您自己随意啦,


    native跳转flutter.gif

    遇到的问题

    1. 第2步中在settings.gradle添加内容的时候要求导入Binding类(这个类实际上在package groovy下),不必导入,直接sync编译可以通过 .
    2. 第2步中参数settingsDir,官方文档是 settingsDir.parentFile。我的my_flutter和官方文档位置不同,所以这个参数也不同。

    可以hot reload

    hot reload是提高flutter提高效率写大大大优点。混合开发也是可以hot reload的。

    实际生产推荐flutter_boost

    这篇博客实际上只是尝试一下混合开发爽一把,实际生产环境下想要混合开发最好使用已经造好的轮子。目前咸鱼开源了他们的的轮子flutter_boost,值得尝试。可以戳这里
    了解。

    上文Demo地址在这里 从tag1.0.0中获取

    相关文章

      网友评论

          本文标题:Flutter混合开发初体验:在已有Android项目下导入Fl

          本文链接:https://www.haomeiwen.com/subject/chjlgqtx.html