Nativescript - пользовательская навигация по кнопке "Назад" в Android TabView

В приложении Nativescript мне нужно реализовать настраиваемый сценарий навигации для Android, когда пользователь нажимает кнопку материала / мягкого возврата.

Для простоты, начиная с шаблона вкладок входа (https://github.com/ADjenkov/login-tabs-ng), и я хочу реализовать навигацию, такую ​​как Instagram, Facebook, WhatsApp, Pinterest и многие другие ...

Это с примером шаблона вкладок входа в систему, когда я перехожу с вкладки «Игроки» на вкладку «Команды», а затем нажимаю кнопку «Назад», я хочу вернуться на вкладку «Игроки» (на странице, которую я оставил на этой вкладке).

Сегодня, когда история навигации выхода вкладки Teams пуста, а история навигации корневого выхода пуста, приложение закрывается. Я бы хотел, чтобы это было близко, если я нажму кнопку «Назад» после возврата на вкладку «Игроки» и если история навигации на вкладке «Игроки» будет пустой.

Надеюсь понятно, подскажите, если не так. Есть ли способ реализовать такое поведение?


nativescript tabview router-outlet nativescript-angular
person jeba    schedule 22.01.2019    source источник
comment
Вы должны прослушать событие activityBackPressed и установить args.cancel = true когда пользователь находится на вкладке "Команды" (путем проверки selectedIndex в TabView), затем перейдите по URL-адресу на вкладку "Игроки".   -  person Manoj    schedule 22.01.2019
comment
Привет @Manoj, спасибо за быстрый ответ. На самом деле для этого простого случая это работает, но если вкладок больше двух, как мне узнать, на какой вкладке был пользователь раньше? Другими словами, существует ли глобальная история просмотров или мне нужно сохранять ее вручную каждый раз, когда пользователь переходит на вкладку?   -  person jeba    schedule 22.01.2019
comment
@Manoj для завершения: перейдя на вкладку "Игроки" по URL-адресу, я теряю текущую историю переходов на вкладке "Игроки". Если пользователь был на сведениях об игроке, он вернется к списку игроков вместо того, чтобы перейти на страницу, на которой он был.   -  person jeba    schedule 22.01.2019

Ответы (2)


arrow_upward
1
arrow_downward

Наконец, я реализовал решение, вдохновленное ответом @Manoj.

Я слушаю activityBackPressed event и устанавливаю args.cancel = true для предотвращения поведения по умолчанию.

При каждом изменении вкладки я сохраняю ранее посещенную вкладку. Затем каждые activityBackPressed event я проверяю, может ли текущая розетка вернуться или нет с помощью this.routerExtension.canGoBack({ outlets: [this.tabVisibleName], relativeTo: this.activeRoute }).

В противном случае я программно возвращаюсь к предыдущей вкладке, если список посещенных вкладок не пуст. Если список посещенных вкладок пуст, я устанавливаю args.cancel = false для выхода из приложения.

Если this.routerExtension.canGoBack({ outlets: [this.tabVisibleName], relativeTo: this.activeRoute }) вернусь, я просто вернусь: this.routerExtension.back({ outlets: [this.tabVisibleName], relativeTo: this.activeRoute });

Примечание: вы должны удалить слушателя, когда приложение переходит в фоновый режим, иначе у вас будет несколько слушателей (один по резюме):

application.on(application.exitEvent, (args) => {
            if (args.android) {
                application.android.off(application.AndroidApplication.activityBackPressedEvent);
            }
        });

Спасибо за вашу помощь

person jeba    schedule 23.01.2019

arrow_upward
0
arrow_downward

Вам необходимо сохранить выбранную вкладку в своем data.service, и когда пользователь вернется на tabs.component.html, вы можете использовать selectedIndex. В этом случае вы также можете пропустить прослушивание activityBackPressed.

в вашем tabs.component.html

<TabView (selectedIndexChanged)="onSelectedIndexChanged($event)" [(ngModel)]="selectedTabIndex" width="100%">

и в ваших tabs.component.ts constructor( private routerExtension: RouterExtensions, private activeRoute: ActivatedRoute, private _dataService: DataService ) { this.selectedTabIndex = this._dataService.selectedTabIndex; } и

onSelectedIndexChanged(args: SelectedIndexChangedEventData) { const tabView = <TabView>args.object; const selectedTabViewItem = tabView.items[args.newIndex]; this._dataService.selectedTabIndex = args.newIndex; }

person Narendra    schedule 23.01.2019
comment
Это может сработать, но я реализовал другое решение, описанное ниже. Спасибо за вашу помощь - person jeba; 23.01.2019