javascript - Nativescript Angular TabStrip可见性设置为折叠仍然占用空间

Question

我有一个导航选项卡，如下所示。我希望隐藏 tabStrip 并将可见性设置为折叠来完成这项工作。然而隐藏的 tabStrip 仍然占据了该区域的空白区域。有什么想法可以完全消除空白吗？

<Tabs selectedIndex="0" tabsPosition="top" >

    <TabStrip [visibility]="hideTab() ? 'visible' : 'collapse'">
        <TabStripItem class="special">
            <Label text="test"></Label>
        </TabStripItem>
    </TabStrip>

    <TabContentItem>
    </TabContentItem>
</Tabs>

Answer 1

为了在 iOS 上隐藏 TabBar，您必须在加载内容后调整框架大小。

onTabViewLoaded(tabView) {
    const viewController = tabView.viewController,
        tabBar = viewController.tabBar;

    tabBar.frame = CGRectMake(tabBar.frame.origin.x, tabBar.frame.origin.y, tabBar.frame.size.width, 0);
}

Playground Sample