Flutter 混合開發實戰問題記錄(一)FlutterView閃爍

本人主要從事android開發,從開始研究到項目實戰接入大概有一個半月了,前期的摸索階段花的時間不是不少,天天抽出1小時來看,學習路線大概是:java

搭建環境---語言熟悉---寫demo---寫案例----摘取實際項目中的模塊徹底翻譯爲dart版本----接入到項目中
複製代碼

目前還算順利,遇到的問題大都解決了。dart語法相似於js,也和java8,kt等之後的語法糖相通,熟悉下便可上手。android

我隨手記錄了些比較繁瑣難解決,實施不是很簡單的問題,相似於widget佈局等就再也不詳細描述了,只是時間問題,熟悉下就好了。git

咱們項目中嵌入Flutter的入口是主頁的第四個tab,須要一個fragment,能夠在flutterfragment中return flutterView。github

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之間切換則沒有。web

翻閱源碼能夠看到flutterView自己就是surfaceView,作android原生開發朋友知道,即便不使用flutter,在作自定義相機,視頻渲染,以及相似於XWalkView 的使用中都會遇到相似問題。設計模式

對flutter瞭解不深,不明白爲什麼選取surface來作載體,使用textureView會有什麼問題。bash

【Surfaceview的特性】:內部維護了兩個線程即主線程和渲染線程,渲染線程能夠在主線程以外的線程中向屏幕上繪圖。這樣能夠避免主線程因繪圖任務繁重致使程序的阻塞,從而提升了程序的反應速度。在遊戲開發中多用surfaceView,遊戲的背景,任務,動做盡可能在畫布Canvas中繪製。這種雙線程的設計模式,極大的消耗了CPU內存,爲此,SurfaceView可見時才被建立,SurfaceView隱藏時便被銷燬,從而達到節約內存的目的。 
複製代碼

搜索資料,因爲場景不一樣解決方案也不一樣。ide

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和沒必要要功能,暫時沒有采用)的思路,你們均可以寫出本身的路由棧。

相關文章
相關標籤/搜索