Layout Buttons with Both Vertical box and horizontal box

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
public function runMove(dir:String, e:Event):void {
if (dir == "up") {
b4.y = b4.y - 5;
} else if (dir == "down") {
b4.y = b4.y + 5;
} else if (dir == "left") {
b4.x = b4.x - 5;
} else if (dir == "right") {
b4.x = b4.x + 5;
}
}
</mx:Script>
<mx:VBox horizontalAlign="center">
<mx:Button id="b1" label="Up" click='runMove("up",event);' width="50" />
<mx:HBox horizontalAlign="center">
<mx:Button id="b2" label="Left" click='runMove("left",event);' width="50" />
<mx:Button id="b3" label="Right" click='runMove("right",event);' width="50" />
</mx:HBox>
<mx:Button id="b4" label="Down" click='runMove("down",event);' width="50" />
</mx:VBox>
</mx:Application>
Related examples in the same category