Automatically Sizing and Locating Controls
Anchors
Anchors provide the capability to design your components so that when they are resized at runtime, all the child controls can automatically move and resize themselves to use the available space, without the need for manual programming.
When you set an anchor, you determine which edges of the control you want to remain relatively constant to its parent whenever the parent is resized. For example, if you anchored a control to the right edge, it would move horizontally to ensure that it keeps the same distance to the right edge that existed when the objects were created. If you anchored a control to all edges, then its height and width would change whenever its parent's size changed. In all cases, the target of setting anchors is to maintain the same relative size and location of controls to their parent.
A single property, peAnchors, has been added to each control. peAnchors describes how you want the control to react whenever its container (dbView, Group, etc.) changes size.
Set peAnchors to one of the following constants:
| Constant | Description |
|---|---|
anNone |
The control should do nothing when the parent changes size. |
anTop |
The control will maintain the same distance from the top edge of the parent. The control will not move or resize itself. |
anBottom |
The control will maintain the same distance from the bottom edge of the parent. The control will move vertically when its parent's height is changed. |
anTopBottom |
The control will maintain the same distance from the top and bottom edges of the parent. The control's height will change when its parent's height is changed. |
anLeft |
The control will maintain the same distance from the left edge of the parent. The control will not move or resize itself. |
anTopLeft |
The control will maintain the same distance from the left and top edges of the parent. The control will not move or resize itself. |
anBottomLeft |
The control will maintain the same distance to the bottom and left edges. This will result in the control moving when the parent is resized. |
anTopBottomLeft |
The control will maintain the same distance to the top, bottom, and left edges of the parent. This will result in the control changing its height when the parent is resized. |
anRight |
The control will maintain the same distance to the right edge of the parent. This will result in the control moving horizontally when the width of the parent is changed. |
anTopRight |
The control will maintain the same distance to the top and right edges of the parent. This will result in the control moving horizontally when the width of the parent is changed. |
anBottomRight |
The control will maintain the same distance to the bottom and right edges of the parent. This will result in the control moving vertically and horizontally when the width and height of the parent are changed. |
anTopBottomRight |
The control will maintain the same distance to the top, bottom, and right edges of the parent. This will result in the control's height changing and the control moving horizontally when the height and width of the parent are changed. |
anLeftRight |
The control will maintain the same distance to the left and right edges of the parent. This will result in the control getting wider when the width of the parent is changed. |
anTopLeftRight |
The control will maintain the same distance to the top, left, and right edges of the parent. This will result in the control getting wider when the width of the parent is changed. |
anBottomLeftRight |
The control will maintain the same distance to the bottom, left, and right edges of the parent. This will result in the control getting wider when the width of the parent is changed and the control moving vertically when the parent's height is changed. |
anAll |
The control will maintain the same distance to the top, bottom, left, and right edges of the parent. This will result in the control's height changing when the parent's does, and its width changing when its parent's does. |
Here is a dbView that has been designed to make careful use of anchors:
We would want to change this View so that when it was resized, the controls would change size and location intelligently. The decision of which anchors to set is completely dependent upon the contents being displayed. In this example, the Edit control was deemed to be the most important, and so the other anchors are set to reflect this. This is how the peAnchor property was set for these controls:
Edit = anAll
NOK = anBottomLeftRight
Age = anBottomRight
When resized by the end-user, it can look like this:
Note: You will need to ensure that you set the Component's Border_Style property to Border_Thick; otherwise, you will not be able to resize the border, meaning that the Components can never get bigger, which, in turn, also means that none of the child control's anchors will ever be applied.
Minimum and Maximum Sizes
Allowing the end-user to change the sizes of Components (dbView, ModalPanels, etc.) brings a new challenge: specifically, the temptation to see what happens when the Component is shrunk as small as it will go. This is what they will see:
Hardly satisfactory! The solution to this is to limit the minimum size that a Component can be. You achieve this by setting the piMinSize property. The piMinSize property follows the same pattern as Size. That is, you set piMinSize in the same way that you set the Size:
Set Size To 100 250
Set piMinSize To 100 250
In the preceding example, the Component's minimum size will be the same as the size of the object, meaning that it can only get larger. If you wish, you can set it to be smaller, but test it to be certain that it cannot be shrunk to an unacceptable size.
You can control the maximum size to which a Component can be resized by setting the piMaxSize property:
Set Size To 100 100
Set piMinSize To 50 50
Set piMaxSize To 200 600
In Summary
A property, peAnchors, has been added to all controls (any visual objects), which ensures that the control retains the distance to the edges that it is anchored against whenever the parent's size is changed.
Two properties, piMinSize and piMaxSize, have been added to the Component object (dbView, ModalPanel, etc.) that limit the size to which the Component can be resized.
You need to ensure that you set the Component's Border_Style property to Border_Thick (which is not the default); otherwise, Windows will not let the end-user change the size of the Component.
Think carefully about how you want to set the anchors. It is entirely possible to set anchors in such a way that they will not logically work together. For example, if you have two Forms on the same row and you set them both to anchor left-and-right, they will overlap each other as the Component gets wider (the first Form's right edge will go beyond the left—unmoving—edge of the second Form). The solution would be to make one anchor left-and-right, but the other to be anchored left (if it was the first control) or right (if it was the second control). Alternatively, if you really want them both to get wider, then put them on different rows.