Skip to content Skip to sidebar Skip to footer

Gluon Mobile App Navigationdrawer Back Button Issue

I'm working with a multiple view project with FXML, generated by the Gluon plugin for IntelliJ. When I navigate to the secondary view, coming from the primary view, and I push the

Solution 1:

The NavigationDrawer basically is a popup with a list of items, where usually each of these items allows the selection of a View.

If views can only be accessed through the drawer, then you won't have any issue, given that always the selected item will be related to the active view.

The issue you are having occurs when you access views by other means, like the back button.

By default, the drawer list doesn't track the active view to auto select the related item. If later, you try to select an item that is already selected, the listener won't fire the switch of views.

While this could be done internally by the control (incoming versions will probably manage that), it's easy to achieve.

Just add a listener to viewProperty() on your main class, and whenever the view changes, update the selected item on the drawer. Since this will trigger a change in the navigationDrawer.selectedItemProperty(), before updating the selection, we need to remove the listener, and add it again.

publicstaticfinalStringPRIMARY_VIEW= HOME_VIEW;
publicstaticfinalStringSECONDARY_VIEW="Secondary View";
publicstaticfinalStringMENU_LAYER="Side Menu";

private Item primaryItem;
private Item secondaryItem;

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

@Overridepublicvoidinit() {
    addViewFactory(PRIMARY_VIEW, () -> newPrimaryView(PRIMARY_VIEW).getView());
    addViewFactory(SECONDARY_VIEW, () -> newSecondaryView(SECONDARY_VIEW).getView());

    NavigationDrawerdrawer=newNavigationDrawer();

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

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

    addLayerFactory(MENU_LAYER, () -> newSidePopupView(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);
    });
}

Post a Comment for "Gluon Mobile App Navigationdrawer Back Button Issue"