A HBox
is just a box with a horizontal layout of children - it doesn't actually have vertical lines running between those children, so you're not going to be able to use borders or anything on the HBox.
Your best bet is probably adding VRule
components in between each child component, something like:
<mx:HBox width="100%" borderColor="#000000" borderStyle="solid">
<mx:Image />
<mx:VRule height="100%" strokeColor="#000000" strokeWidth="1"/>
<mx:Image />
<mx:VRule height="100%" strokeColor="#000000" strokeWidth="1"/>
<mx:Image />
</mx:HBox>
You can adjust the VRule and HBox border styles to be consistent however you like. The only other options I can think of are to put borders around each child component with no border on the HBox (may need child padding depending on your components), embed all your components in Box
components within the HBox like you suggest, or doing something completely crazy like using a HorizontalList
and embedding your components in a custom item renderer that is a consistent size with a border.
Personally I'd just use VRule separators and move on. I'd rather double up on children than have all my components of interest one family level deeper in the HBox. If you need to generate your HBox children from a variable array or suchlike, then you may want to put each one in a Box
and use a Repeater
or something. Some more detail would help for more specific answers.