dart - 如何使用英雄在 2 个不同的按钮之间有相同的页面目标

Question

我现在正在尝试制作一个可以通过两个不同按钮打开的页面。因此，例如，在我的主页上会有这些按钮，当我按下它们时，它会打开一个页面。然后当我按下另一个按钮时，它会像这样打开相同的页面:

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp (
      title: 'Navigation Basics',
      debugShowCheckedModeBanner: false,
      home: FirstRoute(),
    )
  );
}

class FirstRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('First Route'),
      ),
      body: Center(
        child: Column (
          children: <Widget> [ 
            Hero (
              tag: 'open',
            child: RaisedButton(
              child: Text('Open route'),
              onPressed: () {
                Navigator.push(
                context,
                  MaterialPageRoute(builder: (context) => SecondRoute()),
                );
              },
            ),
            ),
            Hero (
              tag: 'open',
            child: RaisedButton(
              child: Text('Open route'),
              onPressed: () {
                Navigator.push(
                context,
                  MaterialPageRoute(builder: (context) => SecondRoute()),
                );
              },
            ),
            )
          ]
        )
      ),
    );
  }
}

class SecondRoute extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold (
      appBar: AppBar(
        title: Text("Second Route"),
      ),
      body: Center(
        child: Hero (
          tag: 'open',
        child: RaisedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('Go back!'),
        ),
        )
      ),
    );
  }
}

但是由于某种原因出现了问题。如果我按下这些按钮，我可以打开页面但不能返回。我该如何解决这个问题？

Answer 1

确保使用唯一的 hero 标签。

import 'package:flutter/material.dart';

void main() {
  runApp(MaterialApp(
    title: 'Navigation Basics',
    debugShowCheckedModeBanner: false,
    home: FirstRoute(),
  ));
}

class FirstRoute extends StatelessWidget {
  final String open1 = 'open';
  final String open2 = 'open2';
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('First Route'),
      ),
      body: Center(
          child: Column(children: <Widget>[
        Hero(
          tag: open1,
          child: RaisedButton(
            child: Text('Open route'),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => SecondRoute(
                          open: open1,
                        )),
              );
            },
          ),
        ),
        Hero(
          tag: open2,
          child: RaisedButton(
            child: Text('Open route'),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => SecondRoute(
                          open: open2,
                        )),
              );
            },
          ),
        )
      ])),
    );
  }
}

class SecondRoute extends StatelessWidget {
  final String open;

  SecondRoute({this.open});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Second Route"),
      ),
      body: Center(
          child: Hero(
        tag: open,
        child: RaisedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('Go back!'),
        ),
      )),
    );
  }
}