Nativescript - Android TabView кнопка возврата, пользовательская навигация - PullRequest
Новая
       31

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

0 голосов
/ 22 января 2019

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

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

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

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

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

Ответы [ 2 ]

0 голосов
/ 23 января 2019

Наконец, я реализовал решение, вдохновленное ответом @ 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 }) вернуть true, я просто вернусь: this.routerExtension.back({ outlets: [this.tabVisibleName], relativeTo: this.activeRoute });

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

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

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

0 голосов
/ 23 января 2019

Вам нужно сохранить выбранную вкладку в вашем 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; }

...