Flex, HBox: How to horizontally center all children?

I am unable to center components in my VBox. I would like to set the standard css element "align: center". How do I do this in Flex?

<mx:VBox>
    <mx:LinkButton label="Tag1" />
    <mx:Image source="@Embed(source='../icons/userIcon.png')" />
    <mx:Label id="username" text="Nickname" visible="false" fontWeight="bold"   />
</mx:VBox>

      

thanks

+2


a source to share


1 answer


Simply put, you can do this:

<mx:VBox width="200" horizontalAlign="center">
    <mx:Label text="foo" />
</mx:VBox>

      

I just tried this example and it worked fine. If the width of the container is dictated by its children, it may not look right:



<mx:VBox horizontalAlign="center" borderStyle="solid">
    <mx:Label text="foo" />
    <mx:Label text="bar" />
</mx:VBox>

      

However, by specifying the width, this attribute will work:

<mx:VBox width="200" horizontalAlign="center" borderStyle="solid">
    <mx:Label text="foo" />
    <mx:Label text="bar" />
</mx:VBox>

      

+3


a source







All Articles