全屏细节与投影仪位置叠加

Fullscreen details overlay with beamer location

免责声明：我是一个 flutter 初学者，正在构建一个纯 web 项目！

我有一个包含一组项目的屏幕。点击其中一项后，应会显示全屏叠加层，其中包含有关该项目的更多详细信息。

在功能上，与此屏幕截图非常相似，但显然两者的内容不同，主页和叠加层。

我们称这两个屏幕为 ItemsWidget 和 ItemDetailsWidget。后者的背景不透明度为0.5，这意味着它应该是半透明的。

因为我正在使用 beamer 进行导航。我已经为 ItemsWidget 声明了位置 /items 并且为 ItemDetailsWidget

声明了 /items/:item_id

路由和设置工作正常，我可以在小部件之间导航。

但是，当 ItemDetailsWidget 显示时（即使背景是半透明的），ItemsWidget 从下方消失。

在截图示例中，它看起来像这样：

我明白 ItemDetailsWidget 它正在替换整个屏幕内容，但我想将它放在 ItemsWidget 之上。

我想这可以用一个 Stack 小部件和两个子小部件来完成，但是那必须在同一个 beamer 位置。我想 url 路由需要不同的 beamer 位置。

有什么想法或提示吗？ beamer甚至可以做到这一点吗？谢谢

我不熟悉 Beamer，但您为什么不将该功能实现为自定义对话框window？

Flutter 消除了屏幕上不存在的任何内容，以防止内存泄漏和不必要地使用不可见的小部件。

如果您有兴趣将功能转换为对话框，可以阅读有关对话框的精彩文章：https://material.io/components/dialogs/flutter

这个问题的答案是使用 beamer 对话框路由，如下例所示。