Flutter应用管理插件app_manager的使用

发布于 1周前 作者 htzhanglong 来自 Flutter

Flutter应用管理插件app_manager的使用

Flutter App Manager (app_manager) #

Flutter App Manager 是一个轻量级的Flutter包，它简化了Flutter应用的定制化。

通过这个包你可以实现以下功能：

  • 轻松管理你的应用主题，允许你创建自定义主题。
  • 方便管理你的应用语言设置。

还有更多...

查看示例应用以了解实际用法示例。

如果你喜欢，可以在GitHub上为它点赞，并在pub.dev上给它一个好评。你也可以查看我在pub.dev上的其他包。

目录 #

开始使用 #

从现在起，这篇文章将为你提供一个全面的逐步指南，涵盖所有你需要知道的关于使用app_manager包的知识。

创建核心 #

app_manager 包使用称为核心的子单元。你可以将核心视为模式处理器。它存储模式并使应用程序能够使用当前活动的模式。该模式是可以改变的，并且可以响应系统的变化。

创建核心 #

创建一个核心就像扩展一个类一样简单。要创建一个核心，只需扩展AppManagerCore 类。

class YourCore extends AppManagerCore {}

AppManagerCore 需要三个重写。

1. modes获取器

在modes 获取器中，AppManagerCore 存储其模式。每个模式由键和值组成，因此模式存储在一个映射中。模式的键被定义为一个枚举，并称为模式键，而模式的值是一个模型，称为模式模型。

为了创建你的模式键，定义一个枚举，并为你的模式模型创建一个模型类。

enum YourCoreModes {
  mode1,
  mode2,
  mode3,
}

class YourCoreModel {
  final String yourString;

  YourCoreModel({
    required this.yourString,
  });
}

接下来，你可以通过使用你创建的模式键作为键，并将相应的模型作为值来创建你的模式。

class YourCore extends AppManagerCore {
  [@override](/user/override)
  Map<YourCoreModes, YourCoreModel> get modes => {
        YourCoreModes.mode1: YourCoreModel(
          yourString: "mode1 strig",
        ),
        YourCoreModes.mode2: YourCoreModel(
          yourString: "mode2 strig",
        ),
        YourCoreModes.mode3: YourCoreModel(
          yourString: "mode3 strig",
        ),
      };
}

现在你已经为你的核心创建了模式，我们还需要完成最后一步。我们必须始终使用AppManagerCore 类的泛型。该类包含两个泛型字段：第一个应与模式键枚举相对应，第二个应与你创建的模式模块类相对应。

class YourCore extends AppManagerCore<YourCoreModes, YourCoreModel> {
  [@override](/user/override)
  Map<YourCoreModes, YourCoreModel> get modes => {
        YourCoreModes.mode1: YourCoreModel(
          yourString: "mode1 strig",
        ),
        YourCoreModes.mode2: YourCoreModel(
          yourString: "mode2 strig",
        ),
        YourCoreModes.mode3: YourCoreModel(
          yourString: "mode3 strig",
        ),
      };
}

2. defaultMode获取器

当本地没有存储模式时，defaultMode 获取器会被使用。因此，设置你希望使用的模式的模式键作为默认模式。

defaultMode 必须存在于modes 映射中的模式键中。

注意：它的用法会在核心绑定到实用工具时发生变化。

class YourCore extends AppManagerCore<YourCoreModes, YourCoreModel> {
  [@override](/user/override)
  YourCoreModes get defaultMode => YourCoreModes.mode1;

  [@override](/user/override)
  Map<YourCoreModes, YourCoreModel> get modes => {
        YourCoreModes.mode1: YourCoreModel(
          yourString: "mode1 strig",
        ),
        YourCoreModes.mode2: YourCoreModel(
          yourString: "mode2 strig",
        ),
        YourCoreModes.mode3: YourCoreModel(
          yourString: "mode3 strig",
        ),
      };
}

3. 绑定实用工具与核心

一个实用工具充当核心与系统的中间人。实用工具监听系统，并通知核心关于系统的模式。

如果提供了实用工具，核心将使用系统的模式，只有当前模式与提供的系统模式匹配时才会使用。

核心会搜索与系统模式匹配的模式。在此过程中，核心会比较模式键的名称，如果找到与实用工具返回的系统模式字符串相匹配的模式，则使用该模式。

要将实用工具与核心绑定，你应该覆盖核心的util 获取器。该获取器接受一个AppManagerUtilOptions 类，其中有两个参数。util 参数接受一个AppManagerUtil 实例，而system 参数则接受一个模式键。

提供给system 参数的模式键不仅仅是一个普通的模式键。这个模式键用作系统模式键，因此它不能用于modes 映射或作为默认模式。即使系统模式键不在modes 映射中，核心仍然可以像普通模式键一样使用它。它不是只提供一个模式，而是根据系统的模式进行调整和变化。根据系统模式选择的模式将是您提供的modes 中的一个。如果核心找到了匹配的模式，它将使用该模式。但是，如果找不到与系统模式匹配的模式，它将使用默认模式。

最后，当本地没有存储模式时，核心优先使用系统模式而不是默认模式。你可以通过将useSystemAsDefault 获取器设置为false 来禁用这种行为。默认情况下，它是true。

你可以向util 获取器提供内置的或你自己的自定义实用工具。我们将在创建自定义实用工具章节中讨论创建自定义实用工具。对于内置的实用工具，我们有以下选项：

  • AppManagerUtil.theme 或 AppManagerThemeUtil
  • AppManagerUtil.lang 或 AppManagerLangUtil

AppManagerUtil.theme 将核心绑定到系统主题模式。如果系统使用深色模式，则寻找名为dark 的模式键；如果使用浅色模式，则寻找名为light 的模式键。正如前面所解释的，这两个模式必须存在于modes 映射中；否则，将使用默认模式 代替不存在的模式。

AppManagerUtil.lang 将核心绑定到系统语言模式。它搜索名为当前语言代码 的模式键。你可以在IANA 语言子标记注册表中找到语言代码。

现在，让我们应用本章中涵盖的内容。首先，我们需要向我们的模式键 枚举添加一个枚举值，该枚举值不会在modes 映射中使用。这个枚举将作为我们的系统模式键。

enum YourCoreModes {
  system, // 添加这个以将其用作`系统模式键`，我们在示例中称之为`system`，但你可以将其命名为任何你喜欢的名字。
  mode1,
  mode2,
  mode3,
}

接下来，当我们向核心的util 参数提供一个AppManagerUtilOptions 时，我们将系统模式键 设置为system 参数的值，并将我们希望使用的实用工具作为util 参数的值获取器，我们就完成了。

class YourCore extends AppManagerCore<YourCoreModes, YourCoreModel> {
  [@override](/user/override)
  AppManagerUtilOptions<YourCoreModes>? get util => AppManagerUtilOptions(
        util: AppManagerUtil.<util>, // 你要使用的实用工具。
        system: YourCoreModes.system, // 你创建的用作系统模式键的枚举值。
      );

  [@override](/user/override)
  YourCoreModes get defaultMode => YourCoreModes.mode1;

  [@override](/user/override)
  Map<YourCoreModes, YourCoreModel> get modes => {
        YourCoreModes.mode1: YourCoreModel(
          yourString: "mode1 strig",
        ),
        YourCoreModes.mode2: YourCoreModel(
          yourString: "mode2 strig",
        ),
        YourCoreModes.mode3: YourCoreModel(
          yourString: "mode3 strig",
        ),
      };
}

如果你更喜欢在本地没有存储模式时使用默认模式，你也可以使用useSystemAsDefault 获取器并将其值设置为false。

class YourCore extends AppManagerCore<YourCoreModes, YourCoreModel> {
  [@override](/user/override)
  AppManagerUtilOptions<YourCoreModes>? get util => AppManagerUtilOptions(
        util: AppManagerUtil..<util>,
        system: YourCoreModes.system,
      );

  [@override](/user/override)
  YourCoreModes get defaultMode => YourCoreModes.mode1;

  [@override](/user/override)
  YourCoreModes get useSystemAsDefault => false; // 使用`默认模式`。

  [@override](/user/override)
  Map<YourCoreModes, YourCoreModel> get modes => {
        YourCoreModes.mode1: YourCoreModel(
          yourString: "mode1 strig",
        ),
        YourCoreModes.mode2: YourCoreModel(
          yourString: "mode2 strig",
        ),
        YourCoreModes.mode3: YourCoreModel(
          yourString: "mode3 strig",
        ),
      };
}

创建样式核心 #

一个样式核心类似于常规类。你可以访问其值、方法和获取器。除此之外，样式核心还会重建它所在的部件，并且它还允许你无需上下文即可访问核心。

创建一个样式核心比创建一个常规核心更容易。要创建一个样式核心，只需扩展AppManagerStyleCore 类。

class YourStyleCore extends AppManagerStyleCore {}

就是这样。现在你可以像使用常规类一样使用它，并利用它提供的附加功能。例如，让我们访问我们之前创建的YourCore 核心。

class YourStyleCore extends AppManagerStyleCore {
  YourCore get yourCoreCurrentMode => core<YourCore>().current; // 返回当前活动的模式（你将稍后学习如何访问核心）
}

将AppManager连接到你的应用 #

现在我们已经创建了核心，让我们的应用意识到它们是很重要的。AppManagerScope 使得在其下的小部件可以访问其核心，我们通过指定一个AppManagerConfig 作为其config 参数的值来配置它。因此，让我们首先讨论如何使用AppManagerConfig。

使用AppManagerConfig #

要创建一个配置，只需扩展AppManagerConfig 类。

class YourConfig extends AppManagerConfig {}

现在，你可以配置你在应用中打算使用的那些核心。这些核心只有在包含在提供给cores 获取器的列表中时才会工作。尝试使用未包含在cores 列表中的核心会导致错误。

class YourConfig extends AppManagerConfig {
  [@override](/user/override)
  List<AppManagerBaseCore>? get cores => [
        YourCore(),
        YourStyleCore(),
      ];
}

使用AppManagerScope #

在使用你的核心之前，确保你将AppManagerScope 放置在你想访问核心的位置之上。我们建议将其放置在MaterialApp 小部件之上，以确保所有页面都可以访问它。完成后，将你创建的配置类传递给config 参数。这样，你就可以开始在你的应用中使用你的核心了。

void main() {
  runApp(const YourApp());
}

class YourApp extends StatelessWidget {
  const YourApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return AppManagerScope(
      config: YourConfig(), /// 使用你的配置
      child: const MaterialApp(),
    );
  }
}

使用核心 #

现在，让我们探索如何在你的应用中使用你的核心。

访问核心 #

访问你的核心很简单。你可以调用AppManager 类的core 方法或使用context 扩展的core 方法。

使用AppManager 访问核心：

AppManager.core<YourCore>(context);

使用context 访问核心：

context.core<YourCore>();

如前所述，样式核心 类似于常规类，因此你可以使用它们的获取器、方法或变量及其附加功能。例如，当核心的模式更新时，它们会重建调用它们的小部件。这是因为它们的值可能会发生变化。

context.core<YourStyleCore>().<yourGetter>;

要访问核心的当前活动模式，使用其current 获取器。

context.core<YourCore>().current;

它将提供对当前活动模式的模式模型 字段的访问。

context.core<YourCore>().current.yourString; // 访问当前活动模式的YourCoreModel (模式模型)的`yourString` 字段。

更改核心模式 #

要更改核心的模式，调用其changeMode 方法并提供你想要切换到的目标模式的模式键。

context.core<YourCore>().changeMode(YourCoreModes.mode2);

之后，当你调用核心的current 方法时，你将访问新的模式模型。

context.core<YourCore>().current; // 现在你将访问YourCoreModes.mode2的模式模型。

如果你想“保存”或“不保存”当前模式，你可以使用changeMode 方法的saveChanges 参数。此参数是可选的，默认值设置为true。

这可能在你想要预览一个模式时有用。

context.core<YourCore>().changeMode(YourCoreModes.yourMode, false); // 这个模式将不会被本地保存，当应用再次启动时将使用上次保存的模式。

创建自定义实用工具 #

你可以通过扩展AppManagerUtil 类来创建你自己的实用工具。

class YourUtil extends AppManagerUtil {}

AppManagerUtil 只需要一个重写，即systemMode 获取器。

systemMode 获取器接受一个字符串，以告知核心关于系统的当前模式。返回的字符串将被用来在modes 映射中查找对应的模式。如果模式键（枚举）的名称与其返回的字符串匹配，核心将使用该模式。如果没有找到匹配项，它将使用默认模式。

class YourUtil extends AppManagerUtil {
  [@override](/user/override)
  String get systemMode => isMode1Active ? "mode1" : "mode2";
}

之后，你需要通过调用AppManagerUtil 的onSystemChange 方法来通知核心。此方法通知核心，并在那之后，核心将使用systemMode 获取器来访问当前系统模式的名称。在调用onSystemChange 方法之前，始终使用isCoreBound 获取器检查是否安全使用onSystemChange。

class YourUtil extends AppManagerUtil {
  [@override](/user/override)
  String get systemMode => isMode1Active ? "mode1" : "mode2";

  void didChangePlatformMode() {
    if (isCoreBound) onSystemChange!(); // 像这样使用它
  }
}

最后，你可以通过将其传递给其实用工具选项的util 参数来使用你的实用工具与核心绑定，正如我们在绑定实用工具与核心章节中讨论的那样。

example/lib/main.dart

import 'package:app_manager/app_manager.dart';
import 'package:app_manager_example/app_manager/config.dart';
import 'package:app_manager_example/home_page.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const App());
}

class App extends StatelessWidget {
  const App({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return AppManagerScope(
      config: ManagerConfig(),
      child: const MaterialApp(
        home: HomePage(),
      ),
    );
  }
}

更多关于Flutter应用管理插件app_manager的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

Harmonyos Next教程
1 回复

更多关于Flutter应用管理插件app_manager的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然，以下是一个关于如何在Flutter应用中使用app_manager插件的示例代码。需要注意的是，app_manager并不是Flutter官方插件库中的一个广泛认可的插件，因此我假设这里你指的是一个假想的或自定义的插件，用于管理应用内的某些功能或组件。如果app_manager是实际存在的第三方插件，请参考该插件的官方文档进行调整。

假设app_manager插件提供了管理应用内页面、组件或功能的能力，以下是一个基本的示例代码框架，展示如何集成和使用该插件。

1. 添加依赖

首先，确保在pubspec.yaml文件中添加了app_manager依赖（注意：这是一个假设的依赖名，实际使用时请替换为真实的插件名）。

dependencies:
  flutter:
    sdk: flutter
  app_manager: ^x.y.z  # 替换为实际版本号

然后运行flutter pub get来安装依赖。

2. 导入插件

在你的Dart文件中导入app_manager插件。

import 'package:app_manager/app_manager.dart';

3. 使用插件

以下是一个简单的示例，展示如何使用app_manager插件来管理应用内的页面。

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter App Manager Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final AppManager _appManager = AppManager();

  @override
  void initState() {
    super.initState();
    // 假设插件提供了注册页面的方法
    _appManager.registerPage('home', (context) => HomeScreen());
    _appManager.registerPage('settings', (context) => SettingsScreen());

    // 初始化时可以设置默认页面
    Navigator.pushNamed(context, 'home');
  }

  void _navigateToSettings() {
    Navigator.pushNamed(context, 'settings');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('App Manager Demo'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: _navigateToSettings,
          child: Text('Go to Settings'),
        ),
      ),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Home Screen'),
      ),
      body: Center(
        child: Text('This is the home screen.'),
      ),
    );
  }
}

class SettingsScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Settings Screen'),
      ),
      body: Center(
        child: Text('This is the settings screen.'),
      ),
    );
  }
}

注意

  1. 插件API：上面的代码假设AppManager类提供了registerPage和Navigator.pushNamed风格的页面跳转功能。实际使用时，请查阅app_manager插件的文档以了解其具体API。

  2. 错误处理：在实际应用中，应添加错误处理逻辑，例如检查页面是否已注册等。

  3. 插件实现：如果app_manager插件不存在，你可能需要自己实现一个类似功能的插件，或者寻找一个满足需求的第三方插件。

  4. 路由管理：Flutter中通常使用flutter/material提供的路由管理功能，如果app_manager插件提供了额外的功能，确保与现有路由系统兼容。

希望这个示例对你有所帮助！如果有具体的app_manager插件文档或API，请根据实际情况进行调整。

回到顶部