Flex：多行 TabBar？

Question

• 是否有可能，以及如何（如果有）根据容器的宽度拥有一个多行 TabBar？

Answer 1

就像给你的 TabBar 一个 TileLayout 一样简单。您不必为 TabBar 子类化，甚至不必为它创建自定义皮肤类。只需这样做：

<s:TabBar dataProvider="{dp}" left="0" right="0">
    <s:layout>
        <s:TileLayout horizontalGap="-1" verticalGap="-1" 
                      requestedRowCount="2" />
    </s:layout>
</s:TabBar>

这会产生这样的结果：

你看到的 TabBar 下方的空隙，是因为 TileLayout 默认会分配一定数量的行。您可以通过将 requestedRowCount 设置为您期望的行数（本例中为 2）来覆盖它。

如果您希望它真正动态化，您可以通过将 TabBar 的总 width 与 TileLayout 的 columnWidth 进行比较来计算所需的行数，并将结果数绑定到 requestedRowCount 属性。