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