2012-03-15 32 views
2
  • 是否有可能,以及如何做到(如果是)有一個多行的TabBar,基於容器的寬度?
+1

我不確定如何做到這一點,但延長TabBar是一個很好的開始。你有沒有看到這個[link] http://blog.everythingflex.com/2009/08/27/multirowtabs-flex-component-redux/?雖然完整的源代碼鏈接被破壞,也許這對你有一些幫助。另外我知道這不是你要求的,但如果你不喜歡普通的TabBar,來自[link] http://code.google.com/p/flexlib/wiki/ComponentList的SuperTabBar有點不錯:) – Sebastian 2012-03-15 12:00:33

+4

I猜猜你可以將TileLayout應用於自定義TabBarSkin而不是Horizo​​ntalLayout。這樣你甚至不需要擴展TabBar – RIAstar 2012-03-15 12:12:35

+1

我已經添加了TileLayout,但是有一些奇怪的差距正在標籤下方一直保持不變。 :| – 2012-03-15 13:50:49

回答

8

就像給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 with TileLayout

你看到的TabBar下面的差距,產生因爲TileLayout將默認分配一定的行數。您可以通過將requestedRowCount設置爲您所期望的行數(本例中爲2)來覆蓋此值。

如果你希望它是真正的動態,你可以通過比較計算所需行數的的TabBar總width到TileLayout的columnWidth,並結合所產生的號碼給requestedRowCount財產。

+1

它確實有效,但仍然是在TabBar對象之後出現的一個蹩腳的間隙。 :| \t \t \t \t \t \t \t \t這是如果它在幫助某種方式。 Flex 4.6。 – 2012-03-15 20:57:43

+1

@YordanYanakiev我已經更新了我的答案,並解決了該問題。 – RIAstar 2012-03-15 22:17:42

+2

height =「{(int(dataProvidersTabs.length /(width/90))+ 1)* 21}」這是另一個修復,但也許有很多美麗的解決方案。 – 2012-03-16 07:36:20