Question

在Nativescript应用程序中，当用户单击材料/软后退按钮时，我需要为Android实现自定义导航方案。

为简单起见，从登录选项卡模板（https://github.com/ADjenkov/login-tabs-ng）开始，我想实现一种导航，如Instagram，Facebook，WhatsApp，Pinterest等...

这是登录选项卡模板的示例，当我从“玩家”选项卡导航到“团队”选项卡，然后点击“后退”按钮时，我想返回“玩家”选项卡（在此选项卡中我留下的页面上）。

今天，由于“团队”选项卡出口的导航历史为空，而根出口的导航历史为空，因此该应用程序已关闭。如果希望在返回到“播放器”选项卡后单击“后退”按钮并且“播放器”选项卡的导航历史记录为空，则希望它已关闭。

我希望很清楚，如果不是这样，请告诉我。有没有办法实现这种行为？

Answer 1

您需要将所选的Tab保存在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; }

Answer 2

最后，我实现了一个受@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);
            }
        });

感谢您的帮助

本机脚本-Android TabView后退按钮自定义导航

2 个答案: