Flutter 混合开发实战问题记录（一）FlutterView闪烁

本人主要从事android开发，从开始研究到项目实战接入大概有一个半月了，前期的摸索阶段花的时间不是不少，天天抽出1小时来看，学习路线大概是：

搭建环境---语言熟悉---写demo---写案例----摘取实际项目中的模块彻底翻译为dart版本----接入到项目中
复制代码

目前还算顺利，遇到的问题大都解决了。dart语法相似于js，也和java8，kt等之后的语法糖相通，熟悉下便可上手。

我随手记录了些比较繁琐难解决，实施不是很简单的问题，相似于widget布局等就再也不详细描述了，只是时间问题，熟悉下就好了。

咱们项目中嵌入Flutter的入口是主页的第四个tab，须要一个fragment，能够在flutterfragment中return flutterView。

public class MyFlutterFragment extends BaseFlutterFragment implements BasicMessageChannel.MessageHandler<String>{
    private BasicMessageChannel<String> messageChannel;
    @Override
    public FlutterView onCreateView(@NonNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        FlutterView flutterView = Flutter.createView(
                mActivity,
                getLifecycle(),
                "routename");
        messageChannel = new BasicMessageChannel<>(flutterView, "android_channel", StringCodec.INSTANCE);
        messageChannel.setMessageHandler(this);
        //todo 注册你的methodChannel
        // ......
        return flutterView;
    }

    @Override
    public void onMessage(String s, BasicMessageChannel.Reply<String> reply) {
       //todo
    }
}

复制代码

向你的flutter的main（）方法中传递routename 而后启动相应的widget，自己没有什么问题，嵌入以后widget渲染和请求也ok，只是在切换flutterFragment和nativeFragment的时候出现了明显的闪烁，而nativeFragment之间切换则没有。

翻阅源码能够看到flutterView自己就是surfaceView，作android原生开发朋友知道，即便不使用flutter，在作自定义相机，视频渲染，以及相似于XWalkView 的使用中都会遇到相似问题。

对flutter了解不深，不明白为什么选取surface来作载体，使用textureView会有什么问题。

【Surfaceview的特性】：内部维护了两个线程即主线程和渲染线程，渲染线程能够在主线程以外的线程中向屏幕上绘图。这样能够避免主线程因绘图任务繁重致使程序的阻塞，从而提升了程序的反应速度。在游戏开发中多用surfaceView，游戏的背景，任务，动做尽可能在画布Canvas中绘制。这种双线程的设计模式，极大的消耗了CPU内存，为此，SurfaceView可见时才被建立，SurfaceView隐藏时便被销毁，从而达到节约内存的目的。 
复制代码

搜索资料，因为场景不一样解决方案也不一样。

1 假如单页面中嵌套surfaceView，能够在Activity的onCreate()方法中加上一句话：

getWindow().setFormat(PixelFormat.TRANSLUCENT);
复制代码

或在rootview中构建一个长宽为0px 而且不可见的SurfaceView。

2 有人遇到了xwalkView中的闪烁，https://blog.csdn.net/qq2364121253/article/details/82253996,解决方案在文章内。

3 有人在flutter的GitHub issue中提了问题，主要是在原生中启动flutter页面（而非act中嵌入Fragment）的闪烁和黑屏问题，和重置flutterView大小遇到的问题

https://github.com/flutter/flutter/issues/19189

综合几种方案，能够找到一个比较简单的方式, 构建你的flutterView后设置属性

public class MyFlutterFragment extends BaseFlutterFragment implements BasicMessageChannel.MessageHandler<String>{
   private BasicMessageChannel<String> messageChannel;
   @Override
   public FlutterView onCreateView(@NonNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
       FlutterView flutterView = Flutter.createView(
               mActivity,
               getLifecycle(),
               "routename");
       
       //添加        
       flutterView.setZOrderOnTop(true);
       flutterView.getHolder().setFormat(PixelFormat.TRANSLUCENT);  
       
       messageChannel = new BasicMessageChannel<>(flutterView, "android_channel", StringCodec.INSTANCE);
       messageChannel.setMessageHandler(this);
       //todo 注册你的methodChannel
       // ......
       return flutterView;
   }

   @Override
   public void onMessage(String s, BasicMessageChannel.Reply<String> reply) {
      //todo
   }
}
复制代码

后续我会继续作记录，标记一些问题，最近在弄混合栈，在原生-flutter - web中自由跳转，借鉴咸鱼的混合栈（由于有些bug和没必要要功能，暂时没有采用）的思路，你们均可以写出本身的路由栈。