Question

我正在使用NativeScript Angular，并将TabView设置为底部位置。我想允许用户在iOS和Android的标签页之间滑动，但是在jQuery Promise中，它表示当位置设置为底部时，滑动已被禁用。

如何启用TabView上的滑动？

Answer 1

在阅读了手势API之后，我最终通过在TabView中添加了滑动事件监听器来完成了此操作：

HTML：

<TabView #tabview (swipe)="onSwipe($event)" androidTabsPosition="bottom">

    <page-router-outlet
        *tabItem="{title: 'Start', iconSource: getIconSource('play')}"
        name="startTab">
    </page-router-outlet>

    <page-router-outlet
        *tabItem="{title: 'Settings', iconSource: getIconSource('settings')}"
        name="settingsTab">
    </page-router-outlet>

</TabView>

TypeScript：

@ViewChild("tabview") tabview!: ElementRef<TabView>;
...
  onSwipe(event: SwipeGestureEventData) {
    if (this.tabview.nativeElement.selectedIndex === 0 && event.direction === SwipeDirection.left){
      this.tabview.nativeElement.selectedIndex = 1;
    } else if(this.tabview.nativeElement.selectedIndex === 1 && event.direction === SwipeDirection.right){
      this.tabview.nativeElement.selectedIndex = 0;
    }
  }
...

在TabView中启用滑动

1 个答案: