Flutter笔记-flutter与android的互调

ps：flutter版本已经更新到1.2.1

引入包

在build.gradle中可以找到这个

apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"

然后我们到该目录下找到flutter.gradle


flutter.gradle

在该文件中可以找到

Path baseEnginePath = Paths.get(flutterRoot.absolutePath, "bin", "cache", "artifacts", "engine")
String targetArch = 'arm'
if (project.hasProperty('target-platform') &&
     project.property('target-platform') == 'android-arm64') {
     targetArch = 'arm64'
}
debugFlutterJar = baseEnginePath.resolve("android-${targetArch}").resolve("flutter.jar").toFile()
profileFlutterJar = baseEnginePath.resolve("android-${targetArch}-profile").resolve("flutter.jar").toFile()
releaseFlutterJar = baseEnginePath.resolve("android-${targetArch}-release").resolve("flutter.jar").toFile()
dynamicProfileFlutterJar = baseEnginePath.resolve("android-${targetArch}-dynamic-profile").resolve("flutter.jar").toFile()
dynamicReleaseFlutterJar = baseEnginePath.resolve("android-${targetArch}-dynamic-release").resolve("flutter.jar").toFile()

我们继续查找目录


flutter.jar

这就是flutter.jar android部分编译生成的包

在AS中直接看源码的话只能找到编译好的flutter.jar包中的.class文件，这里可以去github下载源码
flutter内核源码：
https://github.com/flutter/engine/tree/45f69ac471b47e95dfeef36e5e81597b05ed19f5/shell/platform/android

OnCreate流程

flutter初始化分为4个部分：
FlutterMain、FlutterNativeView、FlutterView和Flutter Bundle的初始化
先看下Flutter初始化的时序图（图片来源于阿里咸鱼，自己就不献丑了）


时序图

分析过android启动流程的话，知道Application先于Activity执行，在AndroidManifest.xml中可以找到FlutterApplication

public class FlutterApplication extends Application {
    @Override
    @CallSuper
    public void onCreate() {
        super.onCreate();
        //初始化
        FlutterMain.startInitialization(this);
    }

    private Activity mCurrentActivity = null;
    public Activity getCurrentActivity() {
        return mCurrentActivity;
    }
    public void setCurrentActivity(Activity mCurrentActivity) {
        this.mCurrentActivity = mCurrentActivity;
    }
}

先看FlutterMain的初始化：

public class FlutterMain {
    ...
    public static void startInitialization(Context applicationContext, Settings settings) {
        if (Looper.myLooper() != Looper.getMainLooper()) {
          throw new IllegalStateException("startInitialization must be called on the main thread");
        }
        // Do not run startInitialization more than once.
        if (sSettings != null) {
          return;
        }

        sSettings = settings;
        //记录初始化资源的起始时间
        long initStartTimestampMillis = SystemClock.uptimeMillis();
        initConfig(applicationContext);
        initAot(applicationContext);
        initResources(applicationContext);
        //加载libflutter.so库
        if (sResourceUpdater == null) {
            System.loadLibrary("flutter");
        } else {
            sResourceExtractor.waitForCompletion();
            File lib = new File(PathUtils.getDataDirectory(applicationContext), DEFAULT_LIBRARY);
            if (lib.exists()) {
                System.load(lib.getAbsolutePath());
            } else {
                System.loadLibrary("flutter");
            }
        }
        //初始化完成时间
        long initTimeMillis = SystemClock.uptimeMillis() - initStartTimestampMillis;
        nativeRecordStartTimestamp(initTimeMillis);
    }
}

接下来看一下MainActivity，继承自FlutterActivity，找到其的onCreate方法

public class FlutterActivity extends Activity implements FlutterView.Provider, PluginRegistry, ViewFactory {
    private final FlutterActivityDelegate delegate = new FlutterActivityDelegate(this, this);
    private final FlutterActivityEvents eventDelegate = delegate;
    ...
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        eventDelegate.onCreate(savedInstanceState);
    }
}

实际上调用的是FlutterActivityDelegate的onCreate方法

public final class FlutterActivityDelegate
        implements FlutterActivityEvents,
                   FlutterView.Provider,
                   PluginRegistry {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        //sdk版本大于21，即5.0，和沉浸式状态栏有关
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            Window window = activity.getWindow();
            window.addFlags(LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
            window.setStatusBarColor(0x40000000);
            window.getDecorView().setSystemUiVisibility(PlatformPlugin.DEFAULT_SYSTEM_UI);
        }

        String[] args = getArgsFromIntent(activity.getIntent());
// 1.        
 FlutterMain.ensureInitializationComplete(activity.getApplicationContext(), args);

        flutterView = viewFactory.createFlutterView(activity);
        //flutterView默认的创建结果是null，必然进入
        if (flutterView == null) {
            FlutterNativeView nativeView = viewFactory.createFlutterNativeView();
            // 2. 
            flutterView = new FlutterView(activity, null, nativeView);
            //界面置为全屏
            flutterView.setLayoutParams(matchParent);
            //flutterView为显示的主界面
            activity.setContentView(flutterView);
            launchView = createLaunchView();
            if (launchView != null) {
                addLaunchView();
            }
        }

        if (loadIntent(activity.getIntent())) {
            return;
        }

        String appBundlePath = FlutterMain.findAppBundlePath(activity.getApplicationContext());
        if (appBundlePath != null) {
            //3. 
            runBundle(appBundlePath);
        }
    }
}

assets资源已经初始化完毕，将资源路径传递给native端进行处理

public class FlutterMain {
    public static void ensureInitializationComplete(Context applicationContext, String[] args) {
       ...
        String appBundlePath = findAppBundlePath(applicationContext);
        String appStoragePath = PathUtils.getFilesDir(applicationContext);
        String engineCachesPath = PathUtils.getCacheDirectory(applicationContext);
        nativeInit(applicationContext, shellArgs.toArray(new String[0]),
                appBundlePath, appStoragePath, engineCachesPath);
        sInitialized = true;
        ...       
    }
}

然后看下FlutterView是个什么

public class FlutterView extends SurfaceView implements BinaryMessenger, TextureRegistry {
    ...
    public FlutterView(Context context, AttributeSet attrs, FlutterNativeView nativeView) {
        super(context, attrs);

        Activity activity = (Activity) getContext();
        if (nativeView == null) {
            mNativeView = new FlutterNativeView(activity.getApplicationContext());
        } else {
            mNativeView = nativeView;
        }

        dartExecutor = mNativeView.getDartExecutor();
        flutterRenderer = new FlutterRenderer(mNativeView.getFlutterJNI());
        mIsSoftwareRenderingEnabled = FlutterJNI.nativeGetIsSoftwareRenderingEnabled();
        mMetrics = new ViewportMetrics();
        mMetrics.devicePixelRatio = context.getResources().getDisplayMetrics().density;
        setFocusable(true);
        setFocusableInTouchMode(true);

        mNativeView.attachViewAndActivity(this, activity);

        mSurfaceCallback = new SurfaceHolder.Callback() {
            @Override
            public void surfaceCreated(SurfaceHolder holder) {
                assertAttached();
                mNativeView.getFlutterJNI().onSurfaceCreated(holder.getSurface());
            }

            @Override
            public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
                assertAttached();
                mNativeView.getFlutterJNI().onSurfaceChanged(width, height);
            }

            @Override
            public void surfaceDestroyed(SurfaceHolder holder) {
                assertAttached();
                mNativeView.getFlutterJNI().onSurfaceDestroyed();
            }
        };
        getHolder().addCallback(mSurfaceCallback);

        mActivityLifecycleListeners = new ArrayList<>();
        mFirstFrameListeners = new ArrayList<>();

        // Create all platform channels
        navigationChannel = new NavigationChannel(dartExecutor);
        keyEventChannel = new KeyEventChannel(dartExecutor);
        lifecycleChannel = new LifecycleChannel(dartExecutor);
        localizationChannel = new LocalizationChannel(dartExecutor);
        platformChannel = new PlatformChannel(dartExecutor);
        systemChannel = new SystemChannel(dartExecutor);
        settingsChannel = new SettingsChannel(dartExecutor);

        // Create and setup plugins
        PlatformPlugin platformPlugin = new PlatformPlugin(activity, platformChannel);
        addActivityLifecycleListener(platformPlugin);
        mImm = (InputMethodManager) getContext().getSystemService(Context.INPUT_METHOD_SERVICE);
        mTextInputPlugin = new TextInputPlugin(this, dartExecutor);
        androidKeyProcessor = new AndroidKeyProcessor(keyEventChannel, mTextInputPlugin);
        androidTouchProcessor = new AndroidTouchProcessor(flutterRenderer);

        sendLocalesToDart(getResources().getConfiguration());
        sendUserPlatformSettingsToDart();
    }
    ...
}

FlutterView是一个SurfaceView，那么再看其surfaceCreated方法，调用的是FlutterJNI中的native方法

  @UiThread
  public void onSurfaceCreated(@NonNull Surface surface) {
    ensureAttachedToNative();
    nativeSurfaceCreated(nativePlatformViewId, surface);
  }

  private native void nativeSurfaceCreated(long nativePlatformViewId, Surface surface);

也即是说flutter其实是自己绘制，然后在surfaceview上显示的，稍微深入一下来验证一下：
来找一下这个native方法，看一下里面到底做了什么，来到platform_view_android_jni.cc文件下（路径：engine/shell/platform/android/io/platform_view_android_jni.cc）

//platform_view_android_jni.cc
static const JNINativeMethod flutter_jni_methods[] = {
  ...
  {
          .name = "nativeSurfaceCreated",
          .signature = "(JLandroid/view/Surface;)V",
          .fnPtr = reinterpret_cast<void*>(&shell::SurfaceCreated),
   },
  ...
}

这是jni中动态注册的方式，nativeSurfaceCreated对应了SurfaceCreated方法

//platform_view_android_jni.cc
static void SurfaceCreated(JNIEnv* env,
                           jobject jcaller,
                           jlong shell_holder,
                           jobject jsurface) {
  fml::jni::ScopedJavaLocalFrame scoped_local_reference_frame(env);
  //创建新的窗口用于显示
  auto window = fml::MakeRefCounted<AndroidNativeWindow>(
      ANativeWindow_fromSurface(env, jsurface));
  ANDROID_SHELL_HOLDER->GetPlatformView()->NotifyCreated(std::move(window));
}

通过ANativeWindow与surfaceView进行绑定，再看NotifyCreated方法

//platform_view_android.cc
void PlatformViewAndroid::NotifyCreated(
    fml::RefPtr<AndroidNativeWindow> native_window) {
  if (android_surface_) {
    InstallFirstFrameCallback();
    android_surface_->SetNativeWindow(native_window);
  }
  PlatformView::NotifyCreated();
}

SetNativeWindow(native_window)与我们的window相关，继续追踪，因android_surface_是一个std::unique_ptr<AndroidSurface>（ptr是动态指针，即AndroidSurface类型）

//android_surface.h
class AndroidSurface {
 public:
  static std::unique_ptr<AndroidSurface> Create(bool use_software_rendering);
  ...
  virtual bool SetNativeWindow(fml::RefPtr<AndroidNativeWindow> window) = 0;
};
}

我们找其方法实现的类

//android_surface_gi.cc
bool AndroidSurfaceGL::SetNativeWindow(
    fml::RefPtr<AndroidNativeWindow> window) {
  onscreen_context_ = nullptr;
  if (!offscreen_context_ || !offscreen_context_->IsValid()) {
    return false;
  }

  // Create the onscreen context.
  onscreen_context_ = fml::MakeRefCounted<AndroidContextGL>(
      offscreen_context_->Environment(),
      offscreen_context_.get() );

  if (!onscreen_context_->IsValid()) {
    onscreen_context_ = nullptr;
    return false;
  }

  if (!onscreen_context_->CreateWindowSurface(std::move(window))) {
    onscreen_context_ = nullptr;
    return false;
  }
  return true;
}

一切相关的信息都在CreateWindowSurface中

//android_context_gi.cc
bool AndroidContextGL::CreateWindowSurface(
    fml::RefPtr<AndroidNativeWindow> window) {
  window_ = std::move(window);
  EGLDisplay display = environment_->Display();
  const EGLint attribs[] = {EGL_NONE};
  //创建一个通用的surface
  surface_ = eglCreateWindowSurface(
      display, config_,
      reinterpret_cast<EGLNativeWindowType>(window_->handle()), attribs);
  return surface_ != EGL_NO_SURFACE;
}

到这一步基本追踪完了，通过egl创建了一个surface_（EGLSurface）供c端使用

绘制

还记得之前在自定义控件是我们绘制圆形时使用的方法吗？

canvas.drawCircle(Offset(0, 0), 100, _paint);

深入源码一下

void drawCircle(Offset c, double radius, Paint paint) {
    assert(_offsetIsValid(c));
    assert(paint != null);
    _drawCircle(c.dx, c.dy, radius, paint._objects, paint._data);
  }
  void _drawCircle(double x,
                   double y,
                   double radius,
                   List<dynamic> paintObjects,
                   ByteData paintData) native 'Canvas_drawCircle';

这里也使用了native方法，即dart调用c语言，我们也来找一下它的源码简单分析一下
Canvas_drawCircle，和jni的命名不同，这个是表示在Canvas类中的drawCircle方法
其实dart.ui包就在engine中，painting.dart文件也在其中
在canvas.cc（路径：engine/lib/ui/painting/canvas.cc）文件中找到drawCircle方法

//canvas.cc
void Canvas::drawCircle(double x,
                        double y,
                        double radius,
                        const Paint& paint,
                        const PaintData& paint_data) {
  if (!canvas_)
    return;
  canvas_->drawCircle(x, y, radius, *paint.paint());
}

canvas_是一个SkCanvas*

//canvas.h
#include "third_party/skia/include/core/SkCanvas.h"
#include "third_party/skia/include/utils/SkShadowUtils.h"
class Canvas : public RefCountedDartWrappable<Canvas> {
 ...
 private:
  explicit Canvas(SkCanvas* canvas);
  SkPictureRecorder::beginRecording,
  SkCanvas* canvas_;
};

SkCanvas.h在engine工程中无法找到，不过我们能在github的skia工程中找到

void SkCanvas::drawCircle(SkScalar cx, SkScalar cy, SkScalar radius,
                          const SkPaint& paint) {
    if (radius < 0) {
        radius = 0;
    }

    SkRect  r;
    r.set(cx - radius, cy - radius, cx + radius, cy + radius);
    this->drawOval(r, paint);
}

到这就不再分析下去了，flutter是通过skia引擎直接渲染的，所以在绘制速度上要比原生还快些

互调接口

  1. AndroidView 来调用android原生的控件(Ios使用 UiKitView)
    目前还存在一些bug，感兴趣的可以查看一下flutter_webview_plugin开源库的实现源码
  2. EventChannel 传递和接收事件流
    MethodChannel 传递和接收方法
    BasicMessageChannel 传递和接收字符串

相关文章

  1. 深入理解Flutter Platform Channel
  2. Flutter Platform channel详解
  3. 在Flutter中嵌入Native组件的正确姿势是
  4. Flutter之在Flutter布局中嵌入原生组件Android篇
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 159,290评论 4赞 363
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 67,399评论 1赞 294
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 109,021评论 0赞 243
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 44,034评论 0赞 207
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 52,412评论 3赞 287
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 40,651评论 1赞 219
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 31,902评论 2赞 313
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 30,605评论 0赞 199
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 34,339评论 1赞 246
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,586评论 2赞 246
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,076评论 1赞 261
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 28,400评论 2赞 253
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 33,060评论 3赞 236
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,083评论 0赞 8
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,851评论 0赞 195
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 35,685评论 2赞 274
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 35,595评论 2赞 270

推荐阅读更多精彩内容