Layout question, position of input fields

[former_member711148]

Hi, I have a question regarding position of input fields.

I would like to position rows of label and input field so that the input field of all rows start at the same position no matter the width of the label. I have tried the different layout types, changing the different charactertics of the layout type but without success, so now is my question, how do I manage to get what I want?

Label :                         Input field A

Label with long text:    Input field B

Thank you for helping and regards Lena

[chengalarayulu · Accepted solution]

Hi Lena,

I hope below alignment will resolve your expected.

1. TCO_1 - TransparentContainer (layout type - MatrixLayout)

2. LBL_1 - Lable Enter Name (LaoutData - MatrixHeaderData)

3. INP_1 - InputField (LaoutData-MatrixData)

4. LBL_2 - Lable Enter Age (LaoutData - MatrixHeaderData)

5. INP_2 - InputField(LaoutData-MatrixData). 

Hope this will resolve.

[Former Member]

Hi Leena,

You could achieve this with the help of transparent container.

For this you could use Matrix layout and 2 transparent Containers.

Say Tr_cont1 for lables and TR_Cont1 for Input fields. For Tr_cont1 choose lay out data as matix head data and for Tr_cont2, choose matrix data. In Both the container choose Layout as matrix layout.

All your label put in Tr_cont1 and choose layout data as Matrix head data for each label. Similarly, all your input filed you put in Tr_cont2 and choose Layout data as matrix head data for each input field.

I hope this will solve your problem.

Regards,

Nitin

[Former Member]

Hi Lena

I usually make use of Grid Layout because it lays out all your UI elements nicely.

If however one label is longer than the rest of labels in the same column, the

second column is "pushed up" so it starts right after the label ends.

Tip 1 : Please note you can use attribute colSpan. This attribute helps

        you to spread a long label + inputfield over two columns.

Tip 2: you can put label and input field inside a TransparentContainer

           with Flow Layout and again this Tranparent container into your
           master container (defined as Grid Layout)

Try this.  

regards

yuval

[Former Member]

Hi,

For this type of Layout, You can use Layout Type as 'Matrix Layout'.

For each new Label in Select 'Layout Data' Property as 'Matrix Head Data' and for each input field keep 'Layout Data' Property as 'Matrix Data'.