Gluon 移动应用 NavigationDrawer 后退按钮问题

Question

我正在使用 FXML 处理一个多视图项目，该项目由 IntelliJ 的 Gluon 插件生成。

当我从主视图导航到辅助视图并按下物理 android 设备上的后退按钮时，该视图变回主视图。这是正常行为。

问题是 NavigationDrawer 停留在辅助视图上。您可以观察到这一点，因为您将无法导航到辅助视图。当您在导航窗格中按下辅助按钮时，什么也没有发生。此行为类似于尝试导航到您当前所在的页面，但它也没有任何作用。

有人知道解决办法吗？这是一个错误吗？报告 Gluon 错误的最佳方式是什么，因为他们不想将所有支持转移到 SO？

Answer 1

NavigationDrawer 基本上是一个带有项目列表的弹出窗口，其中通常每个项目都允许 selection of a View。

如果只能通过抽屉访问视图，那么您不会有任何问题，因为 selected 项目总是与活动视图相关。

当您通过其他方式（例如后退按钮）访问视图时会出现您遇到的问题。

默认情况下，抽屉列表不会跟踪活动视图以自动 select 相关项目。如果稍后，您尝试 select 一个已经 selected 的项目，侦听器将不会触发视图切换。

虽然这可以由控件在内部完成（即将到来的版本可能会管理它），但它很容易实现。

只需在主 class 上添加 viewProperty() 的侦听器，每当视图发生变化时，更新抽屉中的 selected 项目。由于这会触发 navigationDrawer.selectedItemProperty() 中的更改，因此在更新 selection 之前，我们需要删除侦听器，然后重新添加它。

public static final String PRIMARY_VIEW = HOME_VIEW;
public static final String SECONDARY_VIEW = "Secondary View";
public static final String MENU_LAYER = "Side Menu";

private Item primaryItem;
private Item secondaryItem;

private final ChangeListener listener = (obs, oldItem, newItem) -> {
        hideLayer(MENU_LAYER);
        switchView(newItem.equals(primaryItem) ? PRIMARY_VIEW : SECONDARY_VIEW);
    };

@Override
public void init() {
    addViewFactory(PRIMARY_VIEW, () -> new PrimaryView(PRIMARY_VIEW).getView());
    addViewFactory(SECONDARY_VIEW, () -> new SecondaryView(SECONDARY_VIEW).getView());

    NavigationDrawer drawer = new NavigationDrawer();

    primaryItem = new Item("Primary", MaterialDesignIcon.HOME.graphic());
    secondaryItem = new Item("Secondary", MaterialDesignIcon.DASHBOARD.graphic());
    drawer.getItems().addAll(primaryItem, secondaryItem);

    primaryItem.setSelected(true);
    drawer.selectedItemProperty().addListener(listener);

    addLayerFactory(MENU_LAYER, () -> new SidePopupView(drawer));

    viewProperty().addListener((obs, ov, nv) -> {
        drawer.selectedItemProperty().removeListener(listener);
        if (nv.getName().equals(PRIMARY_VIEW)) {
            primaryItem.setSelected(true);
            secondaryItem.setSelected(false);
            drawer.setSelectedItem(primaryItem);
        } else {
            primaryItem.setSelected(false);
            secondaryItem.setSelected(true);
            drawer.setSelectedItem(secondaryItem);
        }
        drawer.selectedItemProperty().addListener(listener);
    });
}

Gluon 移动应用 NavigationDrawer 后退按钮问题

Gluon mobile app NavigationDrawer back button issue

mobile

android

gluon