Flutter MVP架构模式插件go_mvp的使用

Flutter MVP架构模式插件go_mvp的使用

简介

go_mvp 是一个用于简化项目中每个屏幕的准备工作的包，采用MVP（模型-视图-呈现器）架构。

特性

• MVP架构：轻松创建具有MVP架构的屏幕。
• 导航简便：通过 go_router 进行导航。可以轻松管理传递到屏幕的数据以及屏幕关闭时的返回数据。
• 类似Android的生命周期事件：实现了类似于Android的生命周期方法（如 onCreate 和 onResume），使从Android开发过渡到Flutter的开发者更容易上手。
• 易于使用：设计简洁且对开发者友好，减少了设置屏幕和导航所需的样板代码。
• 命令行工具：快速创建新屏幕，无需担心架构问题。

安装

要求

安装 go_mvp 包之前，确保满足以下要求：

• Flutter SDK 已安装并配置好。
• 项目已经初始化。

项目配置

在项目的 pubspec.yaml 文件中添加依赖：

dependencies:
  go_mvp: ^x.y.z

然后运行 flutter pub get 来获取依赖。

创建新屏幕

使用 go_mvp 提供的命令行工具快速创建新屏幕：

flutter pub run go_mvp:create_screen --name MyScreen

这将生成一个新的屏幕文件。

生命周期

实现

go_mvp 提供了类似于Android的生命周期方法，使得状态管理和生命周期处理更加直观。这些方法包括 onCreate、onResume 等。

导航

go_mvp 使用 go_router 进行导航，提供了简单而强大的路由管理功能。

状态管理

从ViewModel中使用

在ViewModel中，可以通过 setState 方法更新状态，并触发视图更新。

class MyViewModel extends ViewModel {
  String _message = "Hello";

  void setMessage(String message) {
    setState(() {
      _message = message;
    });
  }

  String getMessage() {
    return _message;
  }
}

从Presenter中使用

在Presenter中，可以通过调用ViewModel的方法来更新状态。

class MyPresenter extends Presenter<MyViewModel> {
  void updateMessage(String message) {
    viewModel.setMessage(message);
  }
}

从视图中使用

在视图中，可以通过 onChanged 或其他回调函数来更新状态。

class MyView extends StatelessWidget {
  final MyPresenter presenter;

  MyView(this.presenter);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("My Screen")),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            presenter.updateMessage("Hello World!");
          },
          child: Text("Update Message"),
        ),
      ),
    );
  }
}

示例代码

以下是一个完整的示例，展示了如何使用 go_mvp 创建一个简单的屏幕。

import 'package:example/data/model/generated/model.g.dart';
import 'package:flutter/material.dart';
import 'package:go_mvp/go_mvp.dart';

import 'routes.dart';

void main() {
  AppManager().configure(
    router: router,
    object: Model(),
    debug: false,
    lowPerformance: false,
    refreshLatency: 500,
    slashResolution: '',
    additionalClasses: [],
    screenVisible: (String screen) async {
      // do something with the visible screen information
    },
  );
  runApp(const MyApp());
}

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

  [@override](/user/override)
  Widget build(BuildContext context) => const AppWidget(
        title: "Example App",
      );
}