how to allign UI Elements

[Former Member]

Hi,

Can you please tell em how to allign UI Elements?

I wan to provide some space between two Buttons or labels and Input Field.

I am using either Flow Lay out of Matrix Layout

[Former Member]

Hi ,

For flow layout you can change row spacing by VGutter property however if you want a column spacing you have to insert a horizontal gutter ( a UI element there) rule type:- area rule

width :- you can wary 100%

for other view if you have group with matrixlayout then each of label u can change it to matrix head data this will ensure all labels are starting in new row and aligned.

When you will change it to Matrix Head Data, you will find the Height and width regarding the Matrix Layout. You can also do adjustments there.

[former_member196517]

Hi Sonia,

its still not clear what layout you are using...

is it matrix or flow

Regards

Anuj Goyal

[Former Member]

For Button I have used a Transparent Container, which has 3 buttons and the layout of the container is Flow Layout.

In another view I have two Groups and each of the group has UI Elements , I wan to allign all the UI Elements of this two groups as all the labels will start from Same vertical line and same for the Input Fields. and the layout of the Groups is Matrix Layout and Layout of the ROOTUIELEMENTCONTAINER is Flow Layout

[former_member196517]

Hi Sonia,

For flow layout you can change row spacing by VGutter property however if you want a column spacing you have to insert a horizontal gutter ( a UI element there) rule type:- area rule

width :- you can wary 100%

for other view if you have group with matrixlayout then each of label u can change it to matrix head data this will ensure all labels are starting in new row and aligned

Can you try

Regards

Anuj

[Former Member]

Hi Anuj,

Your answer solved my problem partially, thanks.

Actually in a particular group all the labels are alligned properly, but I need to alling the Input Fields of these two groups with a same Vertical line, but the input Fields are positioned based on label's Text Length, so they are not alligned with a single vertical line

thanks

Sonia

[Former Member]

hi sonia,

keep the ROOTUIELEMENTCONTAINER as matrix layout for the second view which u have mentioned(containing two group).

The advantage of matrix layout over flow layout is that it will align all the ui elements.

flow layout will not align the ui elements. It is always better have matrix layout rather than going for flow or row layout.

u can also find ui properties, which can also be used for the alignment purpose.

Regards...

Arun.

Reward points if useful.

[former_member196517]

Hi Sonia,

Is it still open.. else request u to close this..

Regards

Anuj Goyal

[Former Member]

Hi Anuj,

The issue is still opened because, all the answers solved the problem partially,

Presently I am using matrix layout for all the Groups in a vew and setting the vgutter and cell design property of the Layout Data(Matrix data), I have two labels & input field/dropdown in each row, and I want to allign them.

My requirement is like..each row has 4 UI Elements(max) or 2 UI elements(min) and now I wan to allign them such that the over all view will look like there is four column and in each column the UI elements are verticlly alligned .

Once , I managed to allign them, but the allignment is getting affected by the resolution and the width of the screen.

How to maintain uniform allignment, irrespective of screen width/resolution?

Also I used a table in one of my view and the Column Header of each column is coming from OTR Text, I need to put Line break in Column Header other wise for long Column Header the width of the columns are getting increased and overall width of the table is also getting affected for this.

Thaks for your help

Sonia

[former_member196517]

hi Sonia,

I think if you assign UI elements width in percentage then it should not be a problem and it should be taken care by framework.. leaving it blank could be a problem here....

also splitting OTR in two lines i think it is not possible here.. only thing you can try is get the text of OTR and insert html break b r ( i have put space beteen alphabets deliberately otherwise it wont be visible in sdn html page also ) between wherever you want a break and try.. it may work.... not a standard but worth trying...

Regards

Anuj Goyal

Message was edited by:

Anuj Goyal

Message was edited by:

Anuj Goyal