Flex layout problem

Question

<mx:TextInput x="917" y="10" width="111"/>

I have many declarations like the abovein my flex code :

I wrote the following code, without thinking about how would it look like on a resolution like 800x600 or even 1024x768.

So, now some portion of my UI is not displayed on machines with above mentioned resolutions.

How do I solve this problem?

Is there any way to specify the x,y co-ordinates in percentage?

Answer 1

use constraints

<mx:TextInput left="10" top="10" width="111"/>

This will put the text input 10pxfrom the top and 10px from the left

Answer 2

To specify x/y coordinates in percentages, try this:

<!-- x = 60% of parent width, width = 20% of parent width, etc -->
<mx:TextInput x="{width*0.60}" y="{height*0.10}" width="20%"/>

Answer 3

You need to use layout constraint, however this functionality is restricted to the parent container of the Text Input.

For instance you can only use constraint layout with a panel, canvas or application: ( left, right, top, or bottom )

For Application and Panel component you need to set the layout property to absolute. With the Canvas absolute is the default one.

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

Flex Documentation