設置選項卡的下角，拐角半徑的標籤導航

使用CSS，我可以設置一個選項卡的頂部邊角的圓角半徑在TabNavigator的：設置選項卡的下角，拐角半徑的標籤導航

<mx:Style> 
    .tabstyle 
    { 
     corner-radius: 10; 
    } 
</mx:Style> 

<mx:TabNavigator tabStyleName="tabstyle" />

不過，我也想底角有一個半徑。有誰知道這是怎麼做到的嗎？？

來源

2010-04-26 Maurits de Boer

你在tabnavigator中放置了哪些物品？帆布？ – ilikeorangutans 2010-04-26 14:56:52

的確，5個Canvas組件。但它是關於標籤本身，而不是Tabnavigator的孩子。 – 2010-04-27 07:55:37

假設您在TabNavigator中放置的項目是標準Flex控件集的一部分，您可以讓他們使用自定義編程皮膚來繪製其背景/邊框以匹配您所需的外觀。幸運的是，製作一個程序化皮膚相對容易，該程序皮膚的角度半徑值（grabs style information）就像是使用它來控制圖形的繪製方式 - 只需在互聯網上進行瀏覽，就可以在Flex 3中找到tutorials on skinning。

來源

2010-04-27 00:04:18 ZackBeNimble

ZackBeNimble的答案運作良好，但我確實有任何佈局應該很容易改變的額外要求。所以我現在所做的就是將選項卡的外觀設置爲具有我想要的角半徑的圖像。

<mx:Style> 
    .tabstyle 
    { 
     skin: Embed(source="../images/corner_radius_tabs.png", scaleGridLeft="44", scaleGridRight="45", scaleGridTop="1", scaleGridBottom="2"); 
     padding-left: 44; 
     padding-right: 44; 
    } 
</mx:Style> 

<mx:TabNavigator tabStyleName="tabstyle" />

來源

2010-04-27 08:53:40

擴大從@ZackBeNimble 答案這可能是更容易使用degrafa：

皮膚組件：

<degrafa:GraphicBorderSkin xmlns:degrafa="namespaceLovin"> 

<degrafa:geometry> 
    <degrafa:GeometryComposition> 
     <degrafa:RoundedRectangleComplex topLeftRadius="0" topRightRadius="0" bottomLeftRadius="5" bottomRightRadius="5" 
         height="{skinHeight}" 
         width="{skinWidth}" 
         fill="{someFill}" /> 

</degrafa:geometry> 


</degrafa:GraphicBorderSkin>

你需要填充。另外，skinWidth和height會降低它們在測試版中添加的內部變量 - 如果您使用較舊版本來獲取未縮放寬度和未縮放高度，則必須覆蓋updatedisplaylist。

然後在你剝皮組件，設置此樣式：borderSkin =「package.class.location」

可能是有點快，如果你用傳統編程剝皮不familliar ...我」我更喜歡el degrafa的粉絲。

來源

2010-04-27 16:42:00

設置選項卡的下角，拐角半徑的標籤導航

回答

相關問題