Ширина кнопок вертикальной панели кнопок

Я создаю вертикальную панель кнопок с 3 кнопками. Как сделать одинаковую ширину для всех трех кнопок, чтобы это не выглядело как дерьмо?

<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>

buttonbar apache-flex flex4
person MonoThreaded    schedule 15.04.2010    source источник

Ответы (3)


arrow_upward
1
arrow_downward

У меня тоже была эта проблема, поэтому я отказался от s:VerticalLayout и использовал s:TileLayout с фиксированной шириной столбца, и это сработало.

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

arrow_upward
0
arrow_downward

Не забудьте определить зазор, чтобы избежать расстояния между кнопками.

<s:layout>
   <s:TileLayout verticalGap="-1" />
</s:layout>
person Giorgio Natili    schedule 17.06.2012

arrow_upward
0
arrow_downward

Без форсирования ширины или установки columnWidth в макете плитки вы можете добиться того же результата, используя свойство horizontalAlign вертикального макета.

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

Для панели кнопок на основе значков примените то же свойство с iconPlacement сверху, как это...

<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>

Я надеюсь, что это поможет для динамических длин текста...

Счастливый флексинг.

person Gowtham S    schedule 07.04.2014