gluon mobile：菜单中的菜单闪烁

Question

您好stackoverflow社区...

我已经将多个（JavaFX）Menu -instances放入一个Menu（位于GluonMobile-View的子节点中）：

问题是，当滑鼠将鼠标悬停在其中时，子菜单会闪烁并相互重叠：

所以我的问题是，是否有人知道我的问题的解决方案。 （该视图是使用SceneBuilder构建的）

Answer 1

首先，经典桌面菜单并不是真正打算在移动应用程序中使用。

您应该考虑其他方法，例如NavigationDrawer （ javadoc ）或BottomNavigation控件（ javadoc ）。

无论如何，如果您确实需要使用它们，以下是对您面临的问题的说明：

在Scene Builder上，当您添加MenuBar ，它默认包含一些Menu和MenuItem控件。 如果启用Gluon Mobile主题：

您会注意到Menu上的填充最小，而MenuItem填充较大，并且高度和宽度已设置为最小。

如果将Menu添加为另一个Menu子Menu ，则如果未选择此菜单或未选中该菜单，则其样式将类似于MenuItem ，但是如果将其聚焦，则将其样式化为Menu ，从而强制重新布局。

例如，在此PIC， Edit在顶部是选择菜单，而Edit不选择在底部。

在布局之后，如果鼠标光标足够靠近下一个项目，则可能现在正在选择它，它将对其进行扩展。 同时，先前选择的菜单将被取消选择，并且将再次增长...

这是解决问题的一种简单方法：在视图的css文件中，添加类似以下内容：

.menu,
.menu:focused,
.menu-item {
    -fx-padding: 10;
}

因此菜单和菜单项在所有情况下都具有相同的填充，以防止任何可能的闪烁。

请注意，使用css可以覆盖以前的任何现有样式，并根据自己的喜好对其进行修改。