在 TabNavigator 中隐藏选项卡的最佳方法是啥？

Posted 2023-02-16

【中文标题】在 TabNavigator 中隐藏选项卡的最佳方法是啥？

【英文标题】：What's the best way to hide a tab in a TabNavigator?在 TabNavigator 中隐藏选项卡的最佳方法是什么？

【发布时间】：2010-10-24 06:39:51

【问题描述】：

我想有条件地隐藏 TabNavigator 中的选项卡。似乎设置 visible 无法正常工作（可能是因为 TabNavigator 隐藏当前未选择的选项卡的方式）。

这样做的正确方法是什么？

【参考方案1】：

隐藏是什么意思？如果您实际上是指删除，那么只需获取绑定到 TabNavigator 中数据的数组，然后从中删除适用的元素。

如果您只想暂时删除它们，请创建一个您自己的组件，该组件封装 TabNavigator 并具有一组已删除选项卡和一组实际选项卡。然后按您认为合适的方式处理。

【讨论】：

我的意思是“暂时不显示”。从 TabNavigator 中删除它似乎有点矫枉过正。以仅使用绑定的方式执行此操作会很好...

【参考方案2】：

您可能想查看flexlib 项目。他们有一个名为 SuperTabNavigator 的组件，它为基本的 Flex TabNavigator 添加了许多功能，包括隐藏选项卡（我认为）。

但是，如果您必须创建自己的组件，那就有点棘手了。要知道的是，“选项卡”实际上是特殊样式的按钮，包含在 TabBar 组件中（TabBar 然后包含在 TabNavigator 中）。然后，您需要做的是子类 TabNavigator 并在您的视图上拥有一些属性（即添加到 TabNavigator 的画布等），这些属性绑定到 TabBar 按钮的可见和 includeInLayout 属性。

本质上，您将拥有如下内容：

BindingUtils.bindProperty( tabButton, "visible", view, "someProperty" );
BindingUtils.bindProperty( tabButton, "includeInLayout", view, "someProperty" );

【参考方案3】：

我不知道 TabNavigator，但是在其他容器中，您可以将includeInLayout 属性设置为false，它将被忽略。您可能仍需要将其与visible 结合使用。

【参考方案4】：

您可以通过使用 TabNavigator 的 getTabAt() 方法来完成此操作，该方法返回构成可视选项卡的 Button。然后，您可以设置该按钮的可见属性。使用绑定进行此设置有点棘手，但它是可行的。

您也可以考虑只禁用选项卡，您可以通过在相应的 TabNavigator 子项上设置启用来做到这一点（可见对此不起作用）。

【讨论】：

这很好用，谢谢。您还需要在 Button 上设置 includeInLayout。我最终只是用普通的监听器来实现它，而不用担心尝试用绑定来实现它。

谢谢，今天遇到了同样的问题。

【参考方案5】：

var secondTab = tabNavigator.removeChildAt(0);