Flutter 学习之旅 之 flutter 作为 module ,在 Android 的工程中继承FlutterActivity直接启动Flutter界面功能的简单整理
目录
Flutter 学习之旅 之 flutter 作为 module ,在 Android 的工程中继承FlutterActivity直接启动Flutter界面功能的简单整理
二、Android 工程中使用 MainActivity extends FlutterActivity 来实现 Android 中直接 启动 Flutter 的实现原理
一、简单介绍
Flutter 是一款开源的 UI 软件开发工具包,由 Google 开发和维护。它允许开发者使用一套代码同时构建跨平台的应用程序,包括移动设备(iOS 和 Android)、Web 和桌面平台(Windows、macOS 和 Linux)。
Flutter 使用 Dart 编程语言,它可以将代码编译为 ARM 或 Intel 机器代码以及 JavaScript,从而实现快速的性能。Flutter 提供了一个丰富的预置小部件库,开发者可以根据自己的需求灵活地控制每个像素,从而创建自定义的、适应性强的设计,这些设计在任何屏幕上都能呈现出色的外观和感觉。
二、Android 工程中使用 MainActivity extends FlutterActivity 来实现 Android 中直接 启动 Flutter 的实现原理
在 Android 工程中,通过让 MainActivity
继承自 FlutterActivity
来直接启动 Flutter 界面,这种实现方式的核心原理是利用 Flutter 提供的嵌入机制(Flutter Embedding),将 Flutter 引擎和 Flutter 界面集成到 Android 应用中。以下是详细的实现原理:
1. Flutter 引擎初始化
Flutter 引擎是 Flutter 应用的核心,负责运行 Dart 代码、管理渲染和交互逻辑。当 MainActivity
继承自 FlutterActivity
时,Flutter 框架会自动初始化 Flutter 引擎。
-
FlutterEngine:
FlutterActivity
内部会创建一个FlutterEngine
实例。FlutterEngine
是 Flutter 的核心运行时环境,它负责加载和执行 Dart 代码。 -
Dart 入口点:Flutter 引擎会加载 Flutter 模块中的 Dart 入口点(通常是
main.dart
文件中的main()
函数)。Dart 代码的执行由 Flutter 引擎的 Dart 执行器(DartExecutor
)负责。
2. FlutterActivity 的作用
FlutterActivity
是 Flutter 提供的一个封装类,它继承自 Android 的 AppCompatActivity
,并实现了以下功能:
-
初始化 Flutter 引擎:
FlutterActivity
会自动初始化FlutterEngine
,并将其绑定到当前 Activity。 -
加载 Flutter 界面:
FlutterActivity
会创建一个FlutterView
,并将其作为当前 Activity 的根视图。FlutterView
是 Flutter 界面的 Android 表示,负责渲染 Flutter 的 UI。 -
管理生命周期:
FlutterActivity
会处理 Android 的生命周期事件(如onCreate
、onResume
、onPause
等),并将这些事件传递给 Flutter 引擎,确保 Flutter 界面能够正确响应。
3. Flutter 界面的加载
当 FlutterActivity
被启动时,Flutter 引擎会加载 Dart 入口点,并开始执行 Dart 代码。Dart 代码会构建 Flutter 界面,并通过 Flutter 引擎将其渲染到 FlutterView
中。
-
Dart 入口点:Flutter 的 Dart 入口点通常在
main.dart
文件中定义 -
FlutterView:
FlutterView
是一个 Android 的View
,它负责将 Flutter 的渲染内容显示到屏幕上。Flutter 引擎会将渲染的帧传递给FlutterView
,并由FlutterView
进行显示。
三、简单效果预览
四、案例简单实现步骤
1、在 Android Studio 中创建一个 Flutter 工程
2、选择创建 一个 Flutter Module
3、编写一个简单的 Flutter 界面
4、先再创建一个 Android 工程
5、回到 Flutter 工程,进行 Flutter - Build AAR 编译
6、编译完成后, 会有提示如何在 Android 工程中引用
7、在 Android 工程中,根据提示,在 settings.gradle 和 build.gradle 添加如下的提示内容
8、在 MainActivity 中 引入 Flutter 相关,并实现继承启动 Flutter 界面的代码
9、在 AndroidManifest.xml 中,添加需要的一些配置
10、打包运行,简单效果如下
五、关键代码
1、main.dart
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo', // 设置应用的标题,显示在系统任务栏或窗口标题中
theme: ThemeData(
primarySwatch: Colors.blue, // 设置应用的主题颜色,这里使用蓝色作为主色调
),
home: MyHomePage(), // 设置应用的初始页面为 MyHomePage
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold( // 使用 Scaffold 提供一个基本的页面布局结构
appBar: AppBar( // 添加一个应用栏(AppBar)作为页面的顶部导航
title: Text('Flutter Module in Android'), // 设置应用栏的标题
),
body: Center( // 设置页面的主体内容
child: Text('Hello from Flutter!'), // 在页面中心显示一条文本消息
),
);
}
}
2、MainActivity.java
package com.example.test_android_embedding_flutter_0428;
// 导入 FlutterActivity 类,这是 Flutter 提供的一个封装类,用于嵌入 Flutter 界面
import io.flutter.embedding.android.FlutterActivity;
// 定义 MainActivity 类,并继承自 FlutterActivity
// 继承 FlutterActivity 表示 MainActivity 将直接加载 Flutter 界面
public class MainActivity extends FlutterActivity {
// MainActivity 类中不需要额外的代码实现
// FlutterActivity 已经封装了以下功能:
// 1. 初始化 Flutter 引擎(FlutterEngine)。
// 2. 创建 FlutterView 并将其设置为当前 Activity 的根视图。
// 3. 管理 Android 生命周期事件(如 onCreate、onResume、onPause 等),
// 并将这些事件传递给 Flutter 引擎,确保 Flutter 界面能够正确响应。
}
3、AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<application
android:allowBackup="true"
android:dataExtractionRules="@xml/data_extraction_rules"
android:fullBackupContent="@xml/backup_rules"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/Theme.Test_Android_Embedding_Flutter_0428"
tools:targetApi="31">
<activity
android:name=".MainActivity"
android:exported="true"
android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
android:hardwareAccelerated="true"
android:windowSoftInputMode="adjustResize">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
4、settings.gradle
pluginManagement {
// 配置插件管理相关的设置
repositories {
// 定义插件管理的仓库来源
google {
// 使用 Google 的 Maven 仓库
content {
// 定义需要包含的组(group)正则表达式
includeGroupByRegex("com\\.android.*") // 包含以 "com.android" 开头的组
includeGroupByRegex("com\\.google.*") // 包含以 "com.google" 开头的组
includeGroupByRegex("androidx.*") // 包含以 "androidx" 开头的组
}
}
mavenCentral() // 使用 Maven Central 仓库
gradlePluginPortal() // 使用 Gradle 插件门户
}
}
dependencyResolutionManagement {
// 配置依赖解析相关的设置
repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS) // 设置仓库模式,如果项目中有仓库配置错误则失败
repositories {
google() // 使用 Google 的 Maven 仓库
mavenCentral() // 使用 Maven Central 仓库
}
// 定义 Flutter 模块的存储 URL
String storageUrl = System.env.FLUTTER_STORAGE_BASE_URL ?: "https://storage.googleapis.com"
// 如果环境变量 FLUTTER_STORAGE_BASE_URL 未设置,则使用默认的 Flutter 存储 URL
// 注意:该 URL 是 Flutter 依赖项的默认存储位置,但由于网络原因,可能无法直接访问
// 如果您遇到问题,请检查链接的合法性或在网络正常的情况下重试
repositories {
maven {
// 定义本地 Maven 仓库路径
url 'D:/UsingForXAN/Projects/AndroidStudioProjects/FlutterProject/test_flutter_module_0418/build/host/outputs/repo'
}
maven {
// 定义远程 Maven 仓库路径
url "$storageUrl/download.flutter.io"
}
}
}
// 设置项目的根项目名称
rootProject.name = "Test_Android_Embedding_Flutter_0428"
// 包含子项目 'app',这是 Android 项目的主模块
include ':app'
5、build.gradle
plugins {
alias(libs.plugins.android.application)
}
// 定义项目使用的插件
// 这里使用了 alias 来引用预定义的插件,通常是定义在 buildSrc 或其他地方的插件别名
// 这里引用的是 Android 应用插件,用于构建 Android 应用
android {
namespace 'com.example.test_android_embedding_flutter_0428'
// 设置项目的命名空间,用于区分不同的应用
compileSdk 35
// 设置编译 SDK 的版本,这里是 API 级别 35
defaultConfig {
applicationId "com.example.test_android_embedding_flutter_0428"
// 设置应用的唯一标识符
minSdk 28
// 设置应用支持的最低 SDK 版本
targetSdk 34
// 设置应用的目标 SDK 版本
versionCode 1
// 设置应用的版本代码,用于内部版本管理
versionName "1.0"
// 设置应用的版本名称,显示给用户
testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
// 设置用于运行 Android 测试的测试运行器
}
buildTypes {
release {
minifyEnabled false
// 是否启用代码混淆,这里设置为 false 表示不启用
proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
// 指定 ProGuard 配置文件,用于代码混淆规则
}
profile {
initWith debug
// 将 profile 构建类型初始化为 debug 构建类型的配置
}
}
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
// 设置源代码的 Java 版本兼容性
targetCompatibility JavaVersion.VERSION_1_8
// 设置目标字节码的 Java 版本兼容性
}
}
dependencies {
// 定义项目的依赖项
implementation libs.appcompat
// 添加 AndroidX AppCompat 库的依赖,用于支持旧版本 Android 的兼容性
implementation libs.material
// 添加 Material Design 组件库的依赖,用于构建 Material Design 风格的界面
implementation libs.activity
// 添加 Activity 组件库的依赖,用于支持新的 Activity API
implementation libs.constraintlayout
// 添加 ConstraintLayout 布局库的依赖,用于构建复杂的布局
testImplementation libs.junit
// 添加 JUnit 测试框架的依赖,用于编写单元测试
androidTestImplementation libs.ext.junit
// 添加扩展的 JUnit 测试框架的依赖,用于 Android 测试
androidTestImplementation libs.espresso.core
// 添加 Espresso 测试框架的依赖,用于编写 UI 测试
debugImplementation 'com.example.test_flutter_module_0418:flutter_debug:1.0'
// 在 debug 构建类型中添加 Flutter 模块的 debug 版本依赖
profileImplementation 'com.example.test_flutter_module_0418:flutter_profile:1.0'
// 在 profile 构建类型中添加 Flutter 模块的 profile 版本依赖
releaseImplementation 'com.example.test_flutter_module_0418:flutter_release:1.0'
// 在 release 构建类型中添加 Flutter 模块的 release 版本依赖
}