Dart 如何使用hero在两个不同按钮之间具有相同的页面目标

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

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!'),
        ),
        )
      ),
    );
  }
}

导入“包装：颤振/材料.省道”；
void main（）{
runApp(
材料聚丙烯(
标题：“导航基础”，
debugShowCheckedModeBanner:false，
主页：FirstRoute（），
)
);
}
类FirstRoute扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“第一条路线”），
),
正文：中(
子：列(
儿童：[
英雄(
标签：“打开”，
孩子：升起按钮(
子项：文本（“开放路线”），
已按下：（）{
导航器。推(
上下文
MaterialPartnerRoute（生成器：（上下文）=>SecondRoute（）），
);
},
),
),
英雄(
标签：“打开”，
孩子：升起按钮(
子项：文本（“开放路线”），
已按下：（）{
导航器。推(
上下文
MaterialPartnerRoute（生成器：（上下文）=>SecondRoute（）），
);
},
),
)
]
)
),
);
}
}
类SecondRoute扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“第二条路线”），
),
正文：中(
孩子：英雄(
标签：“打开”，
孩子：升起按钮(
已按下：（）{
Navigator.pop（上下文）；
},
child:Text（'Go back！'），
),
)
),
);
}
}

---

但出于某种原因，存在一个问题。如果我按下这些按钮，我可以打开页面，但不能返回。如何修复此问题？

请确保使用唯一的

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!'),
        ),
      )),
    );
  }
}

导入“包装：颤振/材料.省道”；
void main（）{
runApp（材料应用程序）(
标题：“导航基础”，
debugShowCheckedModeBanner:false，
主页：FirstRoute（），
));
}
类FirstRoute扩展了无状态小部件{
最后一个字符串open1='open'；
最后一个字符串open2='open2'；
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“第一条路线”），
),
正文：中(
子项：列（子项：[
英雄(
标签：open1，
孩子：升起按钮(
子项：文本（“开放路线”），
已按下：（）{
导航器。推(
上下文
材料路线(
生成器：（上下文）=>SecondRoute(
开放：开放1，
)),
);
},
),
),
英雄(
标签：open2，
孩子：升起按钮(
子项：文本（“开放路线”），
已按下：（）{
导航器。推(
上下文
材料路线(
生成器：（上下文）=>SecondRoute(
开放：开放2，
)),
);
},
),
)
])),
);
}
}
类SecondRoute扩展了无状态小部件{
最后一串打开；
第二条路线（{this.open}）；
@凌驾
小部件构建（构建上下文）{
返回脚手架(
appBar:appBar(
标题：文本（“第二条路线”），
),
正文：中(
孩子：英雄(
标签：打开，
孩子：升起按钮(
已按下：（）{
Navigator.pop（上下文）；
},
child:Text（'Go back！'），
),
)),
);
}
}

尽量提供问题的最小可重复性示例。感谢您的反馈。我现在已经编辑了我的答案。您需要在同一屏幕上显示唯一的

英雄
标记。谢谢您的帮助，但我有一个小问题。当我按下按钮2时，动画将应用于按钮1。我如何解决这个问题？小部件之间的动画是基于英雄标记的-相同的标记意味着动画将在它们中发生这里是具有相同标签名称的按钮1。若我们对按钮2做相同的标记，那个么框架会对它需要动画的小部件产生混淆。所以解决它，将带有导航器的标记传递到下一个屏幕。