ALIGHMENT

These buttons are for the alignment purpose:

Figure 2-28 Alignment tools

Horizontal Alignment

There are three buttons in this group:

Figure 2-29 Horizontal Alignment

They represent “align to left”, “align to center”, and “align to right” functions.

Vertical Alignment

There are three buttons in this group:

Figure 2-30 Vertical Alignment

They represent “align to top”, “align to center” and “align to bottom” functions.

These six buttons are only functional when two or more widgets are selected. Otherwise, these six buttons are invalid:

Figure 2-31 Invalid Alignment Tools

Align to Center

This particular alignment function is to align to a center of circle:

Figure 2-32 Align to Center

This button is to align the centers of circle for two and more widgets that have the centers of circle (for example, circular gauge and rotation image). Users can group two or more widgets that have the attribute of center of circle and align these centers to a same center of circle automatically.

Note: ADE aligns widgets to the first widget that is dragged to the design area.

For example, there are two widgets (circular scale and rotation image) in the HMI design panel:

Figure 2-33 Align to Center Example 1

First, let’s select these two widgets and then press “Align to Center” button, then the centers of circle of these two widgets will align at a same point. This button is to prevent the misalignment caused by manual adjustment:

Figure 2-34 Align to Center Example 2

Note: Please refer to Edit Design Panel on how to select widgets in the design panel.