Использование механизма навигации и истории просмотров URL

Этот раздел содержит примеры использования механизма навигации и истории просмотров URL.

Предположим, у нас есть сущность Event и экран EventInfo с информацией о выбранном событии.

Контроллер экрана EventInfo содержит аннотацию @Route для указания маршрута к экрану:

@UiController("eventInfo")
@UiDescriptor("event-info.xml")
@Route("event-info")
public class EventInfo extends Screen {
}

В результате пользователь может открыть экран, введя http://localhost:8081/#main/event-info в адресной строке:

event info route

Когда экран открыт, адрес также содержит метку состояния.

Отображение состояния на URL

Предположим, на экране EventInfo отображается информация об одном событии и присутствует элемент управления для переключения событий. Вы можете отобразить просматриваемое событие в адресной строке, чтобы иметь возможность скопировать URL, а затем открыть экран для этого конкретного события, вставив URL в адресную строку.

Следующий код реализует отображение выбранного события на URL:

@UiController("eventInfo")
@UiDescriptor("event-info.xml")
@Route("event-info")
public class EventInfo extends Screen {
    @Autowired
    protected EntityComboBox<Event> eventField;

    @Autowired
    protected UrlRouting urlRouting;

    @Subscribe("selectBtn")
    protected void onSelectBtnClick(Button.ClickEvent e) {
        Event event = eventField.getValue(); (1)
        if (event == null){
            urlRouting.replaceState(this); (2)
            return;
        }
        String serializedEventId = UrlIdSerializer.serializeId(event.getId()); (3)

        urlRouting.replaceState(this, ImmutableMap.of("event_id", serializedEventId)); (4)
    }
}
1 Получить текущее событие из EntityComboBox.
2 Удалить параметры URL, если событие не выбрано.
3 Сериализовать идентификатор события с помощью вспомогательного класса UrlIdSerializer.
4 Заменить текущее состояние URL новым, содержащим в качестве параметра сериализованный идентификатор события.

В результате URL приложения изменяется, когда пользователь выбирает событие и нажимает кнопку Select Event:

event info url change

UrlParamsChangedEvent

Теперь давайте выполним последнее требование: когда пользователь вводит URL с маршрутом и параметром event_id, приложение должно показать экран с соответствующим выбранным событием.

Ниже приведен пример подписки на UrlParamsChangedEvent в коде контроллера экрана:

@Subscribe
protected void onUrlParamsChanged(UrlParamsChangedEvent event) {
    String serializedEventId = event.getParams().get("event_id"); (1)

    UUID eventId = (UUID) UrlIdSerializer.deserializeId(UUID.class, serializedEventId); (2)

    eventField.setValue(dataManager.load(Event.class).id(eventId).one()); (3)
}
1 Получить значение параметра из UrlParamsChangedEvent.
2 Десериализовать идентификатор события.
3 Загрузить экземпляр события и установить его в поле.