Component Typesetting Alignment

1. Version description

2. Application scenarios

When using absolute layout to design a dashboard, the layout details are generally difficult to debug, and there are often the following problems:

• Difficult to keep the gap between components consistent

• It is difficult to precisely control the uniform distribution of components

• Components in overlapping positions are difficult to select

10.0.19 add a new typesetting  alignment function  to solve the problems that are difficult to adjust the layout details and affect the efficiency of report development.

3. Function entrance

In the dashboard body or absolute canvas block, hold down the Ctrl key and select more than 2 components at the same time. The layout alignment pane will pop up in the lower right corner. There are 2 setting items:

• Alignment: It is only available when 2 or more components are selected at the same time, and the alignment of these components can be adjusted at the same time.

• Automatic spacing: It is only available when 3 or more components are selected at the same time, and the spacing of these components can be adjusted to the same size.

After the components are selected, there are 6 alignment modes for selection, and the component can be aligned and adjusted in a certain direction. The effect is shown in the following figure:

The effects of these 6 alignment methods are shown in the following table:

Align	Effect picture
Left Align
Horizental Center Align
Right Align
Top Align
Vertical Center Align
Bottom Align

Note: When choosing the left align, take the component closest to the left as a reference, and other components are aligned with the left edge of this component. The same is true for right, top, and bottom.

The direct spacing of the components can be automatically adjusted from the horizontal and vertical directions, and the effect is as follows:

• Horizontal distribution

• Vertical distribution