flutter与原生android交互

原创

mob649e815e6170 2023-07-19 11:46:24 ©著作权

文章标签 Android flutter java 文章分类 Android 移动开发

©著作权归作者所有：来自51CTO博客作者mob649e815e6170的原创作品，请联系作者获取转载授权，否则将追究法律责任

Flutter与原生Android交互教程

一、概述

在移动应用开发中，我们常常需要使用一些原生的功能或者原生的UI组件，而Flutter提供了与原生平台进行交互的能力。本文将向你介绍如何在Flutter中与原生Android进行交互。

二、整体流程

整个流程可以分为以下几个步骤：

步骤	描述
1	创建Flutter项目
2	在原生Android项目中添加Flutter模块
3	在Flutter中调用原生方法
4	在原生Android中调用Flutter方法

接下来，我们将详细介绍每个步骤需要做什么。

三、创建Flutter项目

首先，你需要创建一个Flutter项目。你可以使用Flutter SDK提供的命令行工具或者Flutter插件来创建项目。以下是使用命令行工具创建项目的步骤：

打开终端或命令提示符窗口。
运行以下命令创建一个新的Flutter项目：

flutter create my_flutter_app

cd my_flutter_app

运行以下命令来验证项目是否正确配置：

flutter doctor

如果一切正常，你现在已经成功创建了一个Flutter项目。

四、在原生Android项目中添加Flutter模块

接下来，你需要在原生Android项目中添加Flutter模块。这样，你可以在原生Android项目中嵌入Flutter界面。

打开你的原生Android项目。
在android/app/src/main/java目录下创建一个新的Java类，用于加载和显示Flutter界面。例如，你可以创建一个名为FlutterActivity.java的类。

import io.flutter.embedding.android.FlutterActivity;

public class FlutterActivity extends FlutterActivity {
}

在AndroidManifest.xml文件中注册你的FlutterActivity类。在<application>标签内添加以下代码：

<activity
    android:name=".FlutterActivity"
    android:configChanges="orientation|keyboard|keyboardHidden|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
    android:hardwareAccelerated="true"
    android:windowSoftInputMode="adjustResize"
    android:theme="@style/Theme.AppCompat.Light.NoActionBar">
    <intent-filter>
        <action android:name="android.intent.action.MAIN"/>
        <category android:name="android.intent.category.LAUNCHER"/>
    </intent-filter>
</activity>

现在，你已经在原生Android项目中成功添加了Flutter模块。

五、在Flutter中调用原生方法

在Flutter中调用原生方法需要使用Flutter提供的方法通道（MethodChannel）。以下是调用原生方法的步骤：

在Flutter项目中的lib目录下创建一个新的Dart文件，例如platform_channel.dart。
在platform_channel.dart文件中添加以下代码，用于调用原生方法：

import 'package:flutter/services.dart';

class PlatformChannel {
  static const platform = const MethodChannel('my_flutter_app');

  static Future<String> getNativeData() async {
    String nativeData;
    try {
      nativeData = await platform.invokeMethod('getNativeData');
    } catch (e) {
      nativeData = '';
    }
    return nativeData;
  }
}

在Flutter页面中，导入platform_channel.dart文件，并调用PlatformChannel.getNativeData()方法来获取原生数据。

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

class MyFlutterApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter App'),
      ),
      body: Center(
        child: FutureBuilder<String>(
          future: PlatformChannel.getNativeData(),
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return Text(snapshot.data);
            } else {
              return CircularProgressIndicator();
            }
          },
        ),
      ),
    );
  }
}

现在，你已经可以在Flutter中调用原生Android的方法并显示原生数据。