2012-09-14 24 views
0

我們正在將一些Flex3重構爲Flex4代碼,並且我遇到了Spark TabBar控件的問題。在4.5中縮小到所有選項卡寬度以下時,選項卡會縮小。我沒有看到這與Flex4和做一些谷歌搜索後,我似乎無法找到解決方案。Flex TabBar製表符不會在其顯示寬度下調整大小

看來正在發生的事情是,TabBar的minWidth被設置爲所有按鈕的總和加上它們之間的間隙。

Anythoughts?將是最有幫助的。我認爲這很容易,但一直無法解決它。

<s:TabBar id="myTabBar" top="0" width="100%" dataProvider="{myTabs}" > 
    <s:layout> 
     <s:HorizontalLayout gap="1" variableColumnWidth="true" /> 
    </s:layout> 
</s:TabBar> 

更新:
我想出了一個解決方案,雖然我不知道它是一種理想的一個。我使用默認的TabBarSkin並修改爲添加度量方法。在度量方法中,我遍歷選項卡,找到標籤對象並計算寬度。我用它來設置父組件的maxWidth。它似乎有效,但會歡迎對此方法提出任何意見。我也拿出了上面的佈局標籤。

 protected override function measure():void 
     { 
      //TODO Auto-generated method stub 
      super.measure(); 


      // Calculate the maximum size of the button should stretch to and then set the host Component 
      // To the maxWidth. This is accomplished by iterating through the children of the dataGroup 
      // and then getting the label components from labelDisplay. Once you have that then we can 
      // get the PreferredBoundsWidth and add them all up. The left and right values are added in as 
      // that is the spacing on each side of the label. 
      var totalButtonWidth:Number = 0; 
      var tab:UIComponent; 
      var calculatedWidth:Number; 

      for (var i:int = 0; i < dataGroup.numElements; i++) 
      { 
       tab = dataGroup.getElementAt(i) as UIComponent; 
       calculatedWidth = 0; 
       if (tab.hasOwnProperty("labelDisplay")) 
       { 
        var tabLabel:Label = (tab["labelDisplay"] as Label); 
        calculatedWidth = tabLabel.getPreferredBoundsWidth() + tabLabel.left + tabLabel.right; 
       } 
       totalButtonWidth = totalButtonWidth + calculatedWidth; 

      } 

      hostComponent.maxWidth = totalButtonWidth; 
      trace("totalWidth is " + totalButtonWidth); 
     } 

如果我還記得,它是確定從SDK採取的皮膚並對其進行修改並重新使用它的權利?

回答

1

是的,完全可以做你剛纔所說的更新。

但是,從頭開始定義自己的皮膚比修改現有的皮膚容易得多。看看this文檔。