Align components

LOGO!Soft Comfort provides commands to align multiple components in one editing page. You can use these commands to create a web project with neat layout easily.

You can find these commands in the following ways:

Align Left

Click this command to align the selected components along their left edges. This command only works after you select more than one component in the page.

Align Center

Click this command to align the selected components vertically along their centers. This command only works after you select more than one component in the page.

Align Right

Click this command to align the selected components along their right edges. This command only works after you select more than one component in the page.

Align Top

Click this command to align the selected components along their top edges. This command only works after you select more than one component in the page.

Align Bottom

Click this command to align the selected components along their bottom edges. This command only works after you select more than one component in the page.

Distribute Horizontally

Click this command to arrange the selected components on the page, keeping the leftmost and rightmost components in their current position while distributing the intermediate components evenly. This command only works after you select more than two components in the page.

When there is not enough space between the selected components, causing them to overlap, the command will maintain the leftmost component's position and distribute the rest evenly.

Distribute Vertically

Click this command to arrange the selected components on the page, keeping the topmost and bottommost components in their current positions while distributing the intermediate components evenly. This command only works after you select more than two components in the page.

When there is not enough space between the selected components, causing them to overlap, the command will maintain the upmost component's position and distribute the rest evenly.

Note

Requirements for using the distribute commands

To ensure Distribute Horizontally and Distribute Vertically commands work correctly, make sure that the selected components are positioned on the page with sufficient space around them. Otherwise, some components may overlap.

Practical example

If you need to create a project with eight Analog Value components in two rows in a page, you can use align and distribute commands.

  1. Add four Analog Value in the editing page. You can drag four components, or copy one into four.

  2. Select all components.

  3. Use Align Left command. Now all four components are aligned along their left edge.

  4. Use Distribute Vertically command. Now the distance between each component is the same. Now these four components are in a row neatly.

    In practical operation, you can also carry out step 3 and step 4 in reverse order.

  5. Copy the row of components into another row on the right.

  6. Slightly adjust the row on the right to be the same level with the left row.