Flutter插件serenatarch使用方法

Flutter插件serenatarch使用方法

Serenat Arch

Serenat Arch 是一个用于在 Flutter 中实现页面状态管理的插件。它通过 SerenatApp 提供全局状态管理，并允许页面之间共享状态。此插件特别适合需要在多个页面间传递数据或维护统一状态的应用场景。

以下是一个简单的示例，展示如何使用 serenatarch 插件来实现页面之间的状态共享和导航。

示例代码

// 主函数入口
void main() => runApp(const MyApp());

// 应用根组件
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return SeranatApp(
      debugShowCheckedModeBanner: false, // 隐藏调试标志
      initialState: SerenatState<MyState>(), // 初始化全局状态
    );
  }
}

// 全局状态类
class MyState {
  String profilAvatar = ""; // 用户头像
  String profilName = "";   // 用户名称
  List<String> profilList = []; // 用户列表
}

// 第一页组件
class Page1 extends SerenatPage {
  Page1() : super(stateConnective: _Page1());
}

class _Page1 extends State<Page1> {
  late final TextEditingController controller; // 文本控制器
  late final TextEditingController controllera; // 文本控制器

  [@override](/user/override)
  void initState() {
    super.initState();
    controller = TextEditingController();
    controllera = TextEditingController();
  }

  [@override](/user/override)
  void dispose() {
    controller.dispose();
    controllera.dispose();
    super.dispose();
  }

  [@override](/user/override)
  void setState(VoidCallback fn) {
    widget.setState!(fn); // 调用父级 setState 方法
    super.setState(fn);
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Text("Sayfa1"), // 页面标题
          TextField(
            controller: controller,
            onChanged: (s) {
              // 更新全局状态中的用户名
              (widget.viewBag!.state as MyState).profilName = s;
              setState(() {}); // 触发页面刷新
            },
          ),
          TextField(
            controller: controllera,
            onChanged: (s) {
              // 更新全局状态中的用户头像
              (widget.viewBag!.state as MyState).profilAvatar = s;
              setState(() {}); // 触发页面刷新
            },
          ),
          TextButton(
            onPressed: () {
              // 导航到第二页
              widget.push!(Page2());
            },
            child: Text("跳转到第二页"),
          )
        ],
      ),
    );
  }
}

// 第二页组件
class Page2 extends SerenatPage {
  Page2() : super(stateConnective: _Page2(), onReturnPage: Page1());
}

class _Page2 extends State<Page2> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: [
          Text("Sayfa22"), // 页面标题
          Text((widget.viewBag!.state as MyState).profilName), // 显示用户名
          Container(
            width: 100,
            height: 100,
            child: Image.network((widget.viewBag!.state as MyState).profilAvatar), // 显示用户头像
          ),
          ...((widget.viewBag!.state as MyState).profilList) // 显示用户列表
              .map((e) => Text(e))
              .toList(),
          TextButton(
            onPressed: () {
              // 返回上一页
              widget.pop!();
            },
            child: Text("返回"),
          )
        ],
      ),
    );
  }
}