how to center align a button in a hbox in flex?

Question

I have a VBox inside which I have 4 HBoxes. The second level HBox is initially hidden. When I click the label, 'Show more Options', the second level HBox is displayed. Now I have the space occupied by the 'second level HBOx' empty and the 'search' button appaers below the space. My first question is, Is there a way to position the Search Button in such a way that, the space is not there and after the 'Show more Options' label is clicked, the 'Second Level HBox' appears? And the second question is, Can I position the Search Button at the center of the page. Is there any method to center the contents of a HBox of a VBox? This is my code: ```

Accepted Answer

To center stuff inside a HBox, add the following attribute to the box in question,

```
horizontalAlign="center" width="100%"
```

As for the empty space created by invisible boxes (HBox or VBox), I dont know if there is any way, but I find myself adding this attribute to the invisible box,

```
height="{secondLevel.visible ? 200 : 0}"
```

Hope that helps

how to center align a button in a hbox in flex?

Solution

Problem