|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| ||
|
|
|
|
|
|
|
|
|
|
|
|
|
| |||||
Resizing basics - the puzzling functionality |
| |||||||||||||||||
|
| |||||||||||||||||
Applies
to: Basis for proper
resizing of a graphical window are four straight lines named "puzzle
helper lines". They subdivide the background into a "puzzle"
with nine pieces. When resizing the application, these areas will behave
differently. |
| |||||||||||||||||
The illustration
to the right describes the resize behaviour of the puzzle areas concerning
the different dimensions of possible resizing. |
|
![]() |
|
|
|
|
| |||||||||||
When changing the
width of the application, the regions between the vertical puzzle helper
lines are stretched. The region between
the vertical lines can't shrink to a value smaller than zero. I.e. when
designing the application, its minimum width will be the sum of the non-resizable
corner pieces. |
|
![]() |
|
|
|
| ||||||||||||
|
![]() ![]() |
|
| |||||||||||||||
Changing the height of the browser works analog in the same way: only the region between the horizontal puzzle helper lines are stretched. |
|
![]() |
|
|
|
|
| |||||||||||
|
|
|
|
|
|
|
![]() ![]() |
|
|
|
|
|
|
| ||||
When resizing the application in both
directions, the two situations described come together. This makes it clear that only the center-piece will be resized in two dimensions and the corner-pieces stay constant in size. |
|
![]() |
|
|
|
| ||||||||||||
|
![]() ![]() |
|
| |||||||||||||||
|
|
|
|
|
|
|
|
|
![]() ![]() |
|
|
|
|
|
| |||
!
|
|
For an effective and precise result, the comprehension of this mechanism is crucial. Already during the design phase of the application you should have in mind which parts of your background graphic will correspond to which puzzle pieces. |
|
| ||||||||||||||
|
|
Approach: |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
|
|
| ||||||||||||||||
|
|
|
|
|
| |||||||||||||
|
The inner regions behave graphically neutral concerning their size. The puzzle center piece is invisible, hiding behind the Main Web. |
|
![]() |
| ||||||||||||||
|
For pixel-accuracy you also may enter the position of helper lines numerically on the properties dialog. |
|
| |||||||||||||||
|
![]() |
|||||||||||||||||
|
|
![]() |
| |||||||||||||||
|
|
|
|
|
![]() |
| ||||||||||||
|
|
|
|
![]() |
|
| ||||||||||||
!
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| ||
If an application uses resizing, all objects placed on the Main Dialog or on resizable panels need to have proper alignment settings. |
| |||||||||||||||||
Related topics: |
| |||||||||||||||||
|
| |||||||||||||||||
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|