Artículos de la serie Flutter: desarrollo del complemento Flutter

En este artículo, aprenderemos cómo desarrollar un complemento de Flutter para realizar la interacción entre Flutter y la plataforma nativa. Presentaremos el proceso de desarrollo del complemento en detalle, incluido cómo crear un proyecto de complemento, implementar la comunicación del método, manejar tareas asincrónicas, etc. Finalmente, también demostraremos cómo empaquetar y publicar el complemento en la comunidad Flutter.

Parte 1: Flutter interactúa con plataformas nativas

En un proyecto de Flutter, es posible que necesites interactuar con la plataforma nativa para implementar algunas funciones que Flutter no puede completar directamente. En este momento, puedes implementar estas funciones desarrollando complementos de Flutter.

1. Cree el proyecto de complemento
   Primero, cree un nuevo proyecto de complemento de Flutter. Utilice las herramientas de línea de comando proporcionadas por Flutter para crear:

flutter create -t plugin my_plugin

2. Implementar la comunicación del método
   El núcleo del complemento Flutter es implementar la comunicación del método entre el lado de Flutter y el lado nativo. Por ejemplo, creemos un complemento simple que obtenga el nivel de batería de un dispositivo.

En la carpeta lib, cree el archivo my_plugin.dart:

import 'dart:async';
import 'package:flutter/services.dart';

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

  static Future<int> getBatteryLevel() async {
    final int result = await _channel.invokeMethod('getBatteryLevel');
    return result;
  }
}

En el lado nativo, implemente la llamada al método y devuelva el nivel de la batería. En el archivo android/src/main/java/com/example/my_plugin/MyPluginPlugin.java:

package com.example.my_plugin;

import android.content.Context;
import android.os.BatteryManager;
import androidx.annotation.NonNull;
import io.flutter.embedding.engine.plugins.FlutterPlugin;
import io.flutter.plugin.common.MethodCall;
import io.flutter.plugin.common.MethodChannel;
import io.flutter.plugin.common.MethodChannel.MethodCallHandler;
import io.flutter.plugin.common.MethodChannel.Result;
import io.flutter.plugin.common.PluginRegistry.Registrar;

/** MyPluginPlugin */
public class MyPluginPlugin implements FlutterPlugin, MethodCallHandler {
  private Context context;
  private MethodChannel channel;

  @Override
  public void onAttachedToEngine(@NonNull FlutterPluginBinding flutterPluginBinding) {
    context = flutterPluginBinding.getApplicationContext();
    channel = new MethodChannel(flutterPluginBinding.getBinaryMessenger(), "my_plugin");
    channel.setMethodCallHandler(this);
  }

  @Override
  public void onMethodCall(@NonNull MethodCall call, @NonNull Result result) {
    if (call.method.equals("getBatteryLevel")) {
      int batteryLevel = getBatteryLevel();
      result.success(batteryLevel);
    } else {
      result.notImplemented();
    }
  }

  private int getBatteryLevel() {
    BatteryManager batteryManager = (BatteryManager) context.getSystemService(Context.BATTERY_SERVICE);
    int batteryLevel = batteryManager.getIntProperty(BatteryManager.BATTERY_PROPERTY_CAPACITY);
    return batteryLevel;
  }

  @Override
  public void onDetachedFromEngine(@NonNull FlutterPluginBinding binding) {
    channel.setMethodCallHandler(null);
  }
}

3. Usando un complemento en la interfaz de Flutter
   En la interfaz de Flutter, use nuestro complemento para obtener el nivel de la batería. En tu página de Flutter:

import 'package:flutter/material.dart';
import 'package:my_plugin/my_plugin.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: BatteryLevelScreen(),
    );
  }
}

class BatteryLevelScreen extends StatefulWidget {
  @override
  _BatteryLevelScreenState createState() => _BatteryLevelScreenState();
}

class _BatteryLevelScreenState extends State<BatteryLevelScreen> {
  int batteryLevel = 0;

  @override
  void initState() {
    super.initState();
    _getBatteryLevel();
  }

  void _getBatteryLevel() async {
    int level = await MyPlugin.getBatteryLevel();
    setState(() {
      batteryLevel = level;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Battery Level'),
      ),
      body: Center(
        child: Text('Battery Level: $batteryLevel%'),
      ),
    );
  }
}

Segunda parte: empaquetado y publicación del complemento

1. Empaquetar un complemento
   Después de desarrollar un complemento, puede empaquetarlo en una biblioteca que otros puedan usar. En el directorio raíz del proyecto del complemento, ejecute el siguiente comando:

flutter pub publish

Esto publicará su complemento en el sistema de administración de paquetes Dart. Debe iniciar sesión en su cuenta y seguir las instrucciones para completar la publicación.

2. Uso de complementos
   Otros desarrolladores pueden usar su complemento agregándolo a pubspec.yaml:

dependencies:
  flutter:
    sdk: flutter
  my_plugin: ^0.0.1  # 修改为插件的版本号

Luego ejecute flutter pub para instalar el complemento.

Resumir

A través de este artículo, aprendimos cómo desarrollar un complemento de Flutter para realizar la interacción entre Flutter y la plataforma nativa. Hemos dominado la creación de complementos, la comunicación de métodos y el manejo de tareas asincrónicas. Finalmente, también aprendimos cómo empaquetar y distribuir complementos para que los utilicen otros desarrolladores.

Espero que este artículo pueda ayudarlo a obtener una comprensión más profunda del desarrollo de complementos de Flutter y brindar más posibilidades para sus proyectos. Si tiene alguna pregunta o necesita más orientación, no dude en preguntarme.