how could i bulid view like this

For some reason Vaadin thinks it is enough to have "Forms" with one column of fields.

We have gotten around this by using the rowlayout addon to render each row, and then carefully setting the widths of labels and fields so that things align vertically. Really hairy stuff, but the end result looks good.

Unfortunately, this addon seems to have disappeared from the addon directory (though our maven dependency still works)

<dependency>
            <groupId>pl.lt</groupId>
            <artifactId>rowlayout</artifactId>
            <version>1.2</version>
        </dependency>

I guess it would also be possible to use CustomLayout; generate a html snippet with placeholders for each field:
https://vaadin.com/docs/-/part/framework/layout/layout-customlayout.html

Never tried that though.
 

No need to use any addons. A simple nesting of FormLayouts in a HorizontalLayout will be much easier. 

Guttorm Vik: For some reason Vaadin thinks it is enough to have "Forms" with one column of fields.

We have gotten around this by using the rowlayout addon to render each row, and then carefully setting the widths of labels and fields so that things align vertically. Really hairy stuff, but the end result looks good.

Unfortunately, this addon seems to have disappeared from the addon directory (though our maven dependency still works)

<dependency>
            <groupId>pl.lt</groupId>
            <artifactId>rowlayout</artifactId>
            <version>1.2</version>
        </dependency>

I guess it would also be possible to use CustomLayout; generate a html snippet with placeholders for each field:
https://vaadin.com/docs/-/part/framework/layout/layout-customlayout.html

Never tried that though.

 

Hi,Guttorm , that 'rowlayout' dependency is missing in central repository. and the customlayout is not good enough for me.
By the way , thanks for answering.
 

Marcus Hellberg: No need to use any addons. A simple nesting of FormLayouts in a HorizontalLayout will be much easier. 

this seems better , thanks for answering.

Marcus Hellberg: No need to use any addons. A simple nesting of FormLayouts in a HorizontalLayout will be much easier. 

That can be used in some cases, true.
Note that the tab order would then be condition1, condition3, condition2, condition4..
If you want 1,2,3,4 you will have to also set the tab order

As a generic solution, multiple FormLayouts side by side have some other problems as well, which is why we don't use it:
* if the individual 'lines' in the two forms have different heights, subsequent 'lines' will not align.
* You can not have fields with colspan.