Nativescript Angular TabView 可滚动

Question

我可以知道如何使 TabView 可滚动，这样标签名称就不会被包装

<TabView selectedIndex="1" (selectedIndexChange)="onIndexChanged($event)" sdkExampleTitle sdkToggleNavButton> <StackLayout *tabItem="{title: 'Tab 1'}"> <tabone></tabone> </StackLayout> <StackLayout *tabItem="{title: 'Tab 2'}"> <tabtwo></tabtwo> </StackLayout> <StackLayout *tabItem="{title: 'Tab 3'}"> <tabthree></tabfree> </StackLayout> <StackLayout *tabItem="{title: 'Tab 4'}"> <tabfour></tabfour> </StackLayout> <StackLayout *tabItem="{title: 'Tab 5'}"> <tabfive></tabfive> </StackLayout> </TabView>

它看起来像这样。

Answer 1

我不知道有任何 NativeScript api 允许您将 tabview 设置为可滚动。所以在过去，我使用水平滚动视图创建了一个自定义选项卡组件。这是一个使用水平滚动视图的好例子：http://www.nativescriptsnacks.com/snippets/2016/05/30/horizontal-scroller.html。然后根据点击的按钮显示和隐藏不同的部分。

Answer 2

NativeScript-angular ~5.2.0 提供了它。谢谢NS！

这里可以证明官方的简单实现：

https://docs.nativescript.org/angular/cookbook/tab-view-ng

_automaticallyAdjustsScrollViewInsets 方法负责执行此操作。

https://docs.nativescript.org/api-reference/classes/_ui_tab_view_.tabview

截图：

我希望这会有所帮助！