创建一个带有静态应用栏和左上角后退按钮的应用程序

Question

我是 flutter 新手，我正在尝试创建一个简单的应用程序，其“静态”不会在页面之间发生变化。我还希望应用程序栏有一个后退按钮，页面已更改，我怎样才能记住这一点。

我为应用程序栏创建了一个小部件，并尝试使其成为有状态小部件并保存导航器状态，以便在它更新时我将更新我的 appBar 小部件。

我还将添加如何更改页面的代码：

onTap: () {
  Navigator.push(
    context,
    PageRouteBuilder(
      pageBuilder: (context, animation, secondaryAnimation) =>
          UserInfoPage(data: 'Hello from Home Page!'),
      transitionsBuilder:
          (context, animation, secondaryAnimation, child) {
        return FadeTransition(opacity: animation, child: child);
      },
    ),
  );
},

谢谢大家的帮助，我是来学习的:)

Answer 1

为了帮助您导航和控制 AppBar 中的后退按钮，一个好的做法是在每个页面上使用 Scaffold 小部件并通过导航器管理导航。然后，您可以使用AppBar的automaticImplyLeading属性将每个页面的AppBar配置为在需要时自动显示后退按钮。这将使 Flutter 在导航堆栈中有上一页时显示后退按钮。

这是一个简化的方法：

import 'package:flutter/material.dart';

class MyAppBar extends StatelessWidget implements PreferredSizeWidget {
  final String title;

  MyAppBar({required this.title});

  @override
  Widget build(BuildContext context) {
    return AppBar(
      title: Text(title),
      // O botão de voltar será exibido automaticamente quando necessário
      automaticallyImplyLeading: true,
    );
  }

  @override
  Size get preferredSize => Size.fromHeight(kToolbarHeight);
}