Question

I’m pretty new in Flex development. Now I’m learning layouts in Flex. I try to make the following layout.
alt text http://get2know.it/wp-content/uploads/2010/04/2010-04-23_232857.png
The red arrow means when enlarge the window, the red arrow widget will become large too. Can anyone implement this layout in Flex? Thanks in advance.

Answer 1

Here goes Yousui good luck:

<s:layout>
    <s:BasicLayout/>
</s:layout>
<s:Label text="Name:" left="9.8" top="16.4" width="38" height="12"/>
<s:Label text="Description:" left="9.75" top="45.85"/>
<s:Label text="Pattern:" left="9.5" top="76"/>
<s:TextInput left="85" top="10" right="353"/>
<s:TextInput left="85.5" top="40" right="10.5"/>
<s:TextArea left="86" top="70" right="7" bottom="34"/>
<s:Button label="Insert Variable" bottom="6" left="86"/>
<s:Label text="Context:" width="45" top="16" right="300"/>
<s:ComboBox width="150" top="10" right="143"/>
<s:CheckBox label="Automatically insert" top="11" right="10.700012"/>
<s:Button label="Cancel" right="7" bottom="6.450012"/>
<s:Button label="OK" right="84.599976" bottom="6.799988"/>

If you are using Flash Builder Mac or Win version you have the Design view available (Linux Flash Builder doesn’t have), this design would be easy to do.

But i guess that you probably aren’t used to the way that Flash Builder handles control positioning, if thats the case:

• Paste this code in the MXML file you have
• Go to Design view and select one of these controls.
• You will see in the Properties Panel in the Size and Position section, a sub section named Constrains, there is were you can lock (right, left, top and bottom) the corners of your control in a way that you would get the desired effect that you needed.

Case your Properties panel isn’t visible. Go to Window > Show View > Properties.

Hope this helps.

EDIT:

If you have the MinWidth and MinHeight properties specified in your Application tag, beware that when shrinking your Flash App, the layout will adjust your layout to a minimum specified in those properties.