Flutter学习笔记(30)--Android原生与Flutter混编
设置完成之后点击Finish,创建完module后我们来看一下工程的目录结构
第二步:在app下的build.gradle添加依赖
//在android下添加jdk1.8支持 compileOptions { sourceCompatibility 1.8 targetCompatibility 1.8 } //在dependencies下添加flutter依赖 implementation project(':flutter') implementation 'android.arch.lifecycle:runtime:1.1.0' implementation 'android.arch.lifecycle:extensions:1.1.0'
第三步:在根目录下的settings.gradle添加配置
setBinding(new Binding([gradle: this])) evaluate(new File( settingsDir.parentFile, 'AndroidProject/flutter_module/.android/include_flutter.groovy' ))
最后同步一下,将相关的依赖下载下来,至此就成功集成了FlutterModule了。
2.Flutter视图是如何展示到前台界面的
其实Flutter视图是以View的形式添加到原生页面中的,这个和weex很像,简单的来说就是我们首先要通过某一个方法来创建一个Flutter的视图,然后在原生的Activity中创建一个容器,这个容器的作用就是来装载我们Flutter的视图,最后我们将Flutter的View添加到容器里面就可以了。接下来我们看一下实现的代码。
package com.example.flutterdemo; import android.os.Bundle; import android.view.View; import android.widget.FrameLayout; import androidx.annotation.Nullable; import androidx.appcompat.app.AppCompatActivity; import io.flutter.facade.Flutter; import io.flutter.view.FlutterView; public class MyFlutterActivity extends AppCompatActivity { @Override protected void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_flutter); //创建一个FlutterView final FlutterView flutterView = Flutter.createView(this, getLifecycle(), "route1"); //实例化容器 final FrameLayout layout = findViewById(R.id.flutter_container); //将FlutterView添加到容器中去 layout.addView(flutterView); //解决原生页面跳转Flutter页面黑屏的问题(原理就是先让界面隐藏,等第一帧绘制完成后,再让他显示出来) final FlutterView.FirstFrameListener[] listeners = new FlutterView.FirstFrameListener[1]; listeners[0] = new FlutterView.FirstFrameListener() { @Override public void onFirstFrame() { layout.setVisibility(View.VISIBLE); } }; flutterView.addFirstFrameListener(listeners[0]); } }