Skip to content

Experimental: Add Flutter View

Matt Carroll edited this page Mar 29, 2019 · 8 revisions

Everything in this doc and linked from this doc is experimental. These details WILL change. Do not use these instructions or APIs in production code because we will break you.

Add a Flutter View

Flutter can be added to an Android app as a single View in an Activity's View hierarchy.

Before adding Flutter as a single View, you should consider if it is possible to add Flutter as a Fragment or an Activity to reduce your development burden.

If you really need to add Flutter as a single View then do the following.

How to use FlutterView

Ensure Flutter is initialized

At some point before setting up your FlutterView with a FlutterEngine, be sure that Flutter is initialized. You can call the following method from your Application, Activity or any other place that executes before the creation of your FlutterEngine instance.

FlutterMain.ensureInitializationComplete(applicationContext, new String[]{});

Create and start a FlutterEngine

Setup a FlutterEngine instance wherever you plan to create and control your FlutterView, e.g., in your Activity.

FlutterEngine flutterEngine = new FlutterEngine(this);
flutterEngine.getDartExecutor().executeDartEntrypoint(
  new DartExecutor.DartEntrypoint(
    getAssets(),
    FlutterMain.findAppBundlePath(applicationContext),
    "main"
  )
);

Calling executeDartEntrypoint() on your FlutterEngine's DartExecutor will cause the specified Dart method to being executing. Thus, at this point your Flutter app is running.

Create a FlutterView and add to layout

// Instantiate a new FlutterView.
FlutterView flutterView = new FlutterView(this);

// Add your FlutterView wherever you'd like. In this case we add
// the FlutterView to a FrameLayout.
FrameLayout frameLayout = findViewById(R.id.framelayout);
frameLayout.addView(flutterView);

Your FlutterView will not render anything at this point because it is not backed by any particular Flutter app.

Attach your FlutterView to your FlutterEngine

flutterView.attachToFlutterEngine(flutterEngine);

At this point you should see your Flutter UI rendering to your FlutterView, and touch interaction should work.

Create and configure platform plugin

TODO(mattcarroll): update this info about the platform plugin

Fundamental communication between the Android platform and your Flutter app takes place over a MethodChannel with the name "flutter/platform". For example, Android's onPostResume() call must be forwarded over the flutterPlatformChannel with the message "AppLifecycleState.resumed".

  platformPlugin = new PlatformPlugin(activity);
  MethodChannel flutterPlatformChannel = new MethodChannel(
    flutterEngine.getDartExecutor(),
    "flutter/platform",
    JSONMethodCodec.INSTANCE
  );
  flutterPlatformChannel.setMethodCallHandler(platformPlugin);

Add accessibility support

TODO(mattcarroll)

Add support for plugins

TODO(mattcarroll)

Handling orientation change

TODO(mattcarroll)

Flutter Wiki

Process

Framework repo

Engine repo

Infrastructure

Experimental features

Release Notes

Clone this wiki locally
You can’t perform that action at this time.