larghezza pulsanti verticale ButtonBar

Question

Sto creando una barra dei pulsanti verticale con 3 bottoni. Come forzo la stessa larghezza per tutti e tre i pulsanti in modo da non apparire come merda?

<s:ButtonBar x="10" y="10" dataProvider="{viewstack1}" >
    <s:layout>
        <s:VerticalLayout gap="-1"/>
    </s:layout>
</s:ButtonBar>
<mx:ViewStack id="viewstack1" left="115" paddingRight="0" right="0" bottom="0" top="0">
    <s:NavigatorContent label="ABC Products" width="100%" height="100%"><custom:Banner  width="100%" height="100%"/></s:NavigatorContent>
    <s:NavigatorContent label="Btn Player" width="100%" height="100%"><custom:Player /></s:NavigatorContent>
    <s:NavigatorContent label="Btn Cleaner" width="100%" height="100%"><custom:Cleaner width="100%"/></s:NavigatorContent>
</mx:ViewStack>

Answer 1

ho avuto quel problema troppo così ho lasciato cadere s: VerticalLayout e utilizzato s: TileLayout con una larghezza di colonna fissa e ha funzionato

<s:ButtonBar width="142" dataProvider="{almacen}" left="10" top="10">
   <s:layout>
      <s:TileLayout columnWidth="142"/>
   </s:layout>
</s:ButtonBar>

Answer 2

Ricordare di definire il gap , al fine di evitare distanza tra i pulsanti

<s:layout>
   <s:TileLayout verticalGap="-1" />
</s:layout>

Answer 3

Senza forzare la larghezza o l'impostazione del columnWidth in piastrelle layout si può ottenere lo stesso risultato utilizzando la proprietà HorizontalAlign del layout verticale.

<s:ButtonBar id="btnBarVertical1" dataProvider="{menuData}" requireSelection="true" labelField="label">
      <s:layout>
            <s:VerticalLayout gap="-1" horizontalAlign="justify"/>
      </s:layout>
</s:ButtonBar>

Per l'icona barra dei pulsanti in base applicare la stessa proprietà con iconPlacement al top come questo ...

<s:ButtonBar id="btnBarVertical2" dataProvider="{menuDataWithIcon}" requireSelection="true" labelField="label" 
                iconField="icon" iconPlacement="top">
    <s:layout>
        <s:VerticalLayout gap="-1" horizontalAlign="justify"/>
    </s:layout>
</s:ButtonBar>

spero che questo aiuto sarà per il testo dinamico lunghezze ...

Happy Flessione.