Support > Repository > Layout > Basic configuration

You can design the screen layout by "vertical alignment" or "side by side" layout.

If you do not specify a layout, the sequence of model items will be reflected on the screen as is.(FIGS. 1 and 2)

Figure 1 Model definition without specifying layout
Figure 2 Standard screen layout

Screen example

Figure 3 shows an example of setting side-by-side layouts.
The "customer name" and "customer kana" items are lined up next to each other in the panel named "personal information".
The alignment ratio is 50%, 50%.

Figure 3 Example of side by side layout

Definition method

Open the "Layout Name" tab.Fill out the layout name "Personal information" in the item you want to designate the layout.

Figure 3 Specifying side by side layout (1)

Next, open the "Group tab" tab.Choose New from Gear icon and prepare layout entry field.(FIG. 4, FIG. 5)

Figure 4 Specifying side by side layout (2)
Figure 5 Specifying side by side layout (3)

For the layout name, you can select the name specified in Figure 3.
Here, set the "alignment direction" as "horizontal" and enter the display ratio as "50%, 50%".

Figure 6 Specifying side by side layout (4)
Wagby layout designation is set by ratio.

Screen example

An example of specifying the vertical layout is shown in Fig.Items are arranged vertically in the "Personal information" panel.

Figure 8 Example of vertical layout

Definition method

In the setting shown in Fig. 6, the direction of arrangement is "vertical".In the case of vertical arrangement, the display ratio is ignored and it is blank.

Figure 9 Specifying the portrait layout
Even if you build without setting Figure 9, it will be displayed as shown in Figure 8.(When it is omitted, it becomes "portrait".)

Screen example

On one screen, you can mix horizontally arranged and vertically aligned layouts.(FIG. 10)

Figure 10 Mixing side by side layout and vertical arrangement

Definition method

For each item, set the layout name and determine the alignment direction.(FIGS. 11 and 12)

Figure 11 Definition of side by side layout and vertical arrangement layout (1)
Figure 12 Definition of side by side layout and vertical arrangement layout (2)
Layout names must be sequenced.In Figure 11, multiple layout names can not be placed separately.

Wagby's screen layout is set by ratio, so even if you enlarge or reduce the screen size the layout image will not change.(FIG. 13)

Figure 13 Example of Reducing Web Browser Screen Size
Therefore, even if you browse with PC or tablet with different screen resolution, you can operate with almost the same screen image.