space
Previous Page | Next Page

Adding Attachments to Frame Controls

Selecting the Direction and Type for the Attachment

The direction and type for attachments define how you want the connection between two components to be interpreted when one of the components moves or is resized. There are two basic types of attachments, absolute and relative:

The type ... Is represented by ... And maintains an attachment value of ...
absolute

[untitled graphic]


a fixed number of pixels between the connection points of the attached components
relative

[untitled graphic]


a percentage of the parent component's space between the connection points of the attached components. If the size of the parent component changes, the space between the components remains proportional.

Unless the size of the parent component changes, absolute attachments and relative attachments produce the same effect.

While you are working in define attachment mode, you can move or resize any component from which you are defining attachments. When you do this, the values of any affected attachments are modified. This enables you to move components closer together or farther apart without having to temporarily remove any existing attachments.

To demonstrate the difference between absolute and relative attachments, this example shows two components attached to their common parent.

The top item uses an absolute attachment and the bottom uses a relative attachment.

[The top item uses an absolute attachment and the bottom uses a relative attachment.]

If the size of the common parent grows from either the right or left side, the absolute attachment preserves the actual distance between the top item and the left edge of the parent, and the relative attachment preserves the percentage distance between the bottom item and the left edge of the parent.

[If the size of the common parent grows from either the right or left side, the absolute attachment preserves the actual distance between the top item and the left edge of the parent, and the relative attachment preserves the percentage distance between the bottom item and the left edge of the parent.]

The attachment direction controls which component is affected when the attached component is resized or moved. Attachments can be single directional or bidirectional:

Attachment Type
Direction Effect
bidirectional

[untitled graphic]


Both components respond to resizing or moving either component.
single directional

[untitled graphic]

[untitled graphic]


The component that the arrow points to responds to resizing or moving the component that is anchored by the end node. [untitled graphic] is the default.

Resizing or moving a component is considered to be propagated by an attachment if resizing or moving a component, combined with the attachment, results in another component being resized or moved. An attachment is considered to be honored if resizing or moving a component is propagated because of the attachment.

In the following window, components a, b and c have a common parent component and are all attached to the right side of their parent with absolute attachments.

a's attachment is bidirectional; b's attachment is single directional going out of b; and c's attachment is single directional going into c.

[a's attachment is bidirectional; b's attachment is single directional going out of b; and c's attachment is single directional going into c.]

If the right side of the common parent is moved further to the right, only a and c move because the parent generated the initial resize event and the direction of a's and c's attachments allowed the attachment to be honored. The attachment associated with b, however, was given a new value.

[If the right side of the common parent is moved further to the right, only a and c move because the parent generated the initial resize event and the direction of a's and c's attachments allowed the attachment to be honored. The attachment associated with b, however, was given a new value.]

Notice that if b moves to the left, the right hand side of the parent region is pulled to the left since b's attachment is honored only from b. Resizing the parent results in honoring the attachments to a and c. If a is moved, the parent will also move because a's attachment is bidirectional.

[Notice that if b moves to the left, the right hand side of the parent region is pulled to the left since b's attachment is honored only from b. Resizing the parent results in honoring the attachments to a and c. If a is moved, the parent will also move because a's attachment is bidirectional.]

If c is moved, only c moves. Because the attachment associated with c is honored only coming into c, resizing c is not propagated (that is, resizing c does not move or resize other regions). Note that the attachment from the parent region to c is given a new value in this case.

[If c is moved, only c moves. Because the attachment associated with c is honored only coming into  c, resizing c is not propagated (that is, resizing  c does not move or resize other regions). Note that the attachment from the parent region to c is given a new value in this case.]

space
Previous Page | Next Page | Top of Page