覆盖焦点调查
本次调查基于我们在 super_editor 中遇到的弹出工具栏问题。
考虑一个文档编辑器。当用户选择文本时,会弹出一个工具栏。该工具栏仅应在用户选中某些文本时出现,这也意味着文档编辑器具有焦点。
问题在于,尚不清楚开发者在这种情况下应该如何处理共享焦点。可能会有几种配置用于显示此类工具栏。每种情况都会带来不同的问题。
工具栏覆盖在内容之上
首先,人们可能会尝试将弹出工具栏显示在文档编辑器的 Stack 上方。该小部件位置是否理想,取决于应用的整体布局。
要共享文档编辑器和工具栏之间的焦点,开发者必须在工具栏和文档编辑器共同祖先的上方介入一个 FocusScope。从 super_editor 的文档角度来看,这种介入很繁琐,但应该是可以实现的。鉴于开发者添加了一个 Stack 来容纳文档编辑器和工具栏,开发者可以直接在 Stack 小部件上方添加 FocusScope 小部件。此时,用户可以点击工具栏按钮,而不会从文档编辑器中抢走焦点。
但是,对于工具栏中的下拉菜单如何处理尚不清楚。下拉菜单出现在它们自己的路由中,这似乎总是会抢走焦点。如何打开下拉菜单而不从文档编辑器中移开焦点?
最后,这种工具栏定位方法并非理想,因为文档编辑器的边界可能不是开发者想要的工具栏边界。弹出框通常出现在新的路由或覆盖层中,以便弹出框可以完全控制屏幕放置。
工具栏在全局覆盖层中
将工具栏放置在全局 Overlay 中可能是开发者为弹出工具栏所采取的默认方法。
将工具栏放置在全局 Overlay 中允许用户点击工具栏按钮而不丢失焦点。
但是,当用户点击下拉菜单时,下拉菜单路由会抢走焦点,从而关闭工具栏。
此外,即使我们能够打开下拉菜单,菜单也会出现在新的路由中,该路由位于全局 Overlay 的下方。因此,工具栏会显示在下拉菜单的上方。
工具栏在自定义覆盖层中
为了解决全局 Overlay 位于下拉菜单上层的问题,我们可以使用我们自己的 Overlay 小部件。
要求开发者在 Scaffold 之上添加自己的 Overlay 小部件是一个不幸的要求。开发者不习惯这样做,并且使用全局 Overlay 似乎应该是一种受支持的用例。尽管如此,在 Navigator 下方添加我们自己的 Overlay 是技术上可行的,因此可以将下拉菜单显示在弹出工具栏的上方。
但是,我们仍然面临下拉菜单路由抢走焦点的难题。