Plugin structure

Learn the Dart and native parts of a Flutter plugin.

Plugin structure

A Flutter plugin consists of two sides: the Dart side talks to the app, the native side (Android/iOS) communicates with the system. The two sides are connected via a MethodChannel.

// lib/my_plugin.dart
class MyPlugin {
  static const _channel = MethodChannel('my_plugin');
  static Future<String> getVersion() async {
    return await _channel.invokeMethod('getVersion');
  }
}

MethodChannel bridge

MethodChannel is the bridge between Dart and native. Dart sends a message to native with invokeMethod, and native replies via MethodCall. The channel name must be the same on both sides.

Exercise MyPlugin Dart class

Define a class named MyPlugin. Set static const _channel = MethodChannel('my_plugin'). The static Future<String> getVersion() async method should return _channel.invokeMethod('getVersion'). In main, print MyPlugin.

Show example solution

import 'package:flutter/services.dart';

class MyPlugin {
  static const _channel = MethodChannel('my_plugin');

  static Future<String> getVersion() async {
    return await _channel.invokeMethod('getVersion');
  }
}

void main() {
  print(MyPlugin);
}

Test yourself

Which two sides does a Flutter plugin consist of?
- Frontend and backend
- iOS and only iOS
- Dart and native
- Web and mobile
Show answer

Dart and native — The plugin's Dart side talks to the app, the native side (Android/iOS) talks to the system; the two are bridged via MethodChannel.

Create a MethodChannel

static const _channel = ____('my_plugin');

Show answer

static const _channel = MethodChannel('my_plugin');

Plugin structure matches

plugin

Two-sided package
Dart

App side
native

System side
MethodChannel

Bridge

Next lesson: MethodChannel registration

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies