How to set horizontal alignment for form items

Smart GWT Technical Q&A
1

Hi all,

I need to set the horizontal alignment for the form items. I’ve tried to perform this in two ways:[ul][li]invoking the method setAlign() on the form (inherited from Canvas)[/li][li]invoking the method setAlign() on the layout containing the form[/li][/ul]but nothing changed.

Has anyone faced the same problem?

Any suggestion is welcome!

2

Can you provide some more details on the exact layout of your form and what you want. The form items are within cells, so the number of cells per row, spanning/no spanning, alignment of the individial cells all impact layout. If you have some minimal code for your form and a description of what you want, probably can be of more help.

3

Hy svjard,

I’m sorry for my late reply.
This is the hierarchy where I placed my DynamicForm

<div>
  VLayout
    DynamicForm

I’ve tried the following invocation:

  • VLayout.setAlign
  • DynamicForm.setAlign
  • DynamicForm.setLayputAlign
    but nothing of them works.
    The form is rendered as a table.

Any suggestion?

4

Maybe a screen shot would help but so your form is like Left aligned or something and you want it to be centered or something? Couple things here, the alignment will relate to the parent, do you set the VLayout size at all? Try setting the VLayout to 100% width and setLayoutAlign on the form. Also the <div> can affect it if you set a specific width for it as well. But I may be misunderstanding your intent too which is why a screenshot would help.

5

Good afternoon.

I have this page and I want to align date range control to the right.

My code is:

VLayout mainVL = new VLayout();
MiniDateRangeItem miniItem1 = new MiniDateRangeItem("miniitem1");

DynamicForm dateForm = new DynamicForm();  
dateForm.setWidth(450);  

dateForm.setItems(miniItem1);

ListGrid grid = new ListGrid();
grid.setWidth100();  
grid.setHeight(224);  
grid.setShowAllRecords(true);  

mainVL.setBorder("3px solid black");
dateForm.setBorder("1px solid blue");

mainVL.addMember(dateForm);
mainVL.addMember(grid);
mainVL.setMargin(5);
mainVL.setWidth100();
mainVL.setHeight100();

mainVL.draw();

I’ve tried few alternatives, but for some reason not all give results and moreover - some give unexpected results…

No effect have these tries:

dateForm.setAlign(Alignment.RIGHT);
mainVL.setLayoutAlign(Alignment.RIGHT);

mainVL.setAlign(Alignment.RIGHT); aligns vertically for some reason… Can you explain it? I’m not using VerticalAlignment, I’m using Alignment here, so it should be horizontal as I see…

miniItem1.setAlign(Alignment.RIGHT); makes very strange alignment:

dateForm.setLayoutAlign(Alignment.RIGHT); helped to align whole form, yes, it can be an unique solution here

But what to do with these unexpected alignments? How to align VerticalLayout’s content horizontally and how to layout DynamicForm’s content?

Thanks.