2010-11-22 13 views
0
<s:VGroup horizontalAlign="center" horizontalCenter="0" verticalCenter="0" gap="0"> 
    <mx:ViewStack id="view" width="450" height="300" /> 
    <!-- NavigatorContent dynamically gets added to view on appComplete--> 
    <s:TabBar dataProvider="{view}" skinClass="skins.CustomSparkTabBarSkin" /> 
</s:VGroup> 

Özel Cilt:yerleştirin kıvılcım TabBar (+ aşağıya dönük yuvarlak köşeler)

<s:Skin 
xmlns:fx="http://ns.adobe.com/mxml/2009" 
xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:fb="http://ns.adobe.com/flashbuilder/2009"  
alpha.disabled="0.5"><fx:Metadata> 
    <![CDATA[ 
    [HostComponent("spark.components.TabBar")] 
    ]]> 
</fx:Metadata> 

<fx:Script fb:purpose="styling" > 
    <![CDATA[ 

    import mx.core.UIComponent; 

    /** Push the cornerRadius style to the item renderers.*/ 
    override protected function updateDisplayList(unscaledWidth:Number, unscaleHeight:Number):void { 
     const numElements:int = dataGroup.numElements; 
     const cornerRadius:int = hostComponent.getStyle("cornerRadius"); 

     for (var i:int = 0; i < numElements; i++) { 
      var elt:UIComponent = dataGroup.getElementAt(i) as UIComponent; 
      if (elt) 
       elt.setStyle("cornerRadius", cornerRadius); 
     } 
     super.updateDisplayList(unscaledWidth, unscaledHeight); 
    } 

    ]]>    
</fx:Script> 
<s:states> 
    <s:State name="normal" /> 
    <s:State name="disabled" /> 
</s:states> 
<!--- @copy spark.components.SkinnableDataContainer#dataGroup --> 
<s:DataGroup id="dataGroup" width="100%" height="100%"> 


gibi bir şey ortaya Comes öyleyse: http://yozef.com/files/tabExample.png

Bu TabBar'ı, görünüm çizgisinin alt kısmına, köşeleri yuvarlatılmış şekilde gösteren bir yere yerleştirmek istiyorum.

+0

Eğer tabBar 'na rotation =" 180 "eklerseniz: ' , konuyu daha da gülünç hale getirecek. Neden alt kısımdaki düğmelerle bir TabNavigator oluşturmak çok zor ?! – Yozef

cevap

0

Sıfırdan başlayarak ... Tasarım modundayken ... Anahat görünümünde Sekme Çubuğu'nu tıklatın, özellikler görünümünde Görünüm'ün yanındaki açılır menüyü tıklatın ve Oluştur Cilt ... seçeneğini seçin. ButtonBarButton ve buna dönüş = "180" ekleyin ... (Bu neredeyse istediğiniz gibi fakat metin baş aşağı olacak) Tasarım görünümüne geri dönün (TabBar özel teninizde) ve Anahat görünümünde ButtonBarButton'a tıklayın ve özellikler görünümünde, Cilt'in yanındaki açılır menüyü tıklayın ve Dış Görünüm görünümünde Dış Görünüm görünümünde Skin ... öğesini seçin ve rotation = "180" değerini girin.

Bu, sizin neyi başardığınızı düşünebilmem için en hızlı yoldur. Arıyorsunuz, özel ButtonBarButton cildinde diğer değerleri değiştirmek istediğinizi bulabilirsiniz metin tam olarak istediğiniz gibi değilse ...

+0

Bu bir kesmek ... ve şimdi her iki köşem de yuvarlanmış ... Ayrıca, İndeks Gezgini'ni düşünün ... İndeks her zaman yanlış: S – Yozef