The two classes HBox and VBox present containers in which objects are automatically arranged horizontally or vertically:
Figure 18.8.1: HBox (3) and VBox (1) in a container HSplit
Container (2) in container HSplit (horizontal splitter) is a panel without frame and with property Panel.Arrangement = Arrange.Vertical and thus behaves like a VBox.
Figure 18.8.2: HBoxes and VBoxes and a panel with special properties in an application.
Property | Data type | Description |
---|---|---|
.AutoResize | Boolean | If true, then the size of the HBox adjusts to the content in the container. |
.Indent | Boolean | If true, the first element is indented. The indent depth is Desktop.Scale (pixels). The direction is determined by the value of .Invert. |
.Invert | Boolean | If true, the content in the container is not arranged from left to right but the other way round. |
.Margin | Boolean | If true, then a space is inserted between the container margin and the elements in the container. This space is Desktop.Scale (Pixel). |
.Padding | Integer | A space of k pixels (default 0) is inserted between the container border and the elements in the container. |
.Spacing | Boolean | If true, a (horizontal) space is inserted between the elements in the container. This spacing is Desktop.Scale (Pixel). |
Table 18.8.1.1: Overview Properties HBox
The properties of the two containers HBox and VBox differ only very slightly and the VBox lacks the property .Invert.
Property | DataType | Description |
---|---|---|
.AutoResize | Boolean | If true, then the size of the VBox adjusts to the content in the container. |
.Indent | Boolean | If true, the first element is indented. The indentation depth is Desktop.Scale (Pixel). |
.Margin | Boolean | If true, a space is inserted between the container edge and the elements in the container. This space is Desktop.Scale (Pixel). |
.Padding | Integer | A space of k pixels (default 0) is inserted between the container border and the elements in the container. |
.Spacing | Boolean | If true, a (horizontal) space is inserted between the elements in the container. This spacing is Desktop.Scale (Pixel). |
Table 18.8.2.1: Overview of VBox properties
In this project, the focus is not on the client functions but on the design of the components on the form (IDE). To arrange the containers on the form as shown in Figure 18.8.2, some properties of the containers used and their contents have to be specified in a special way. These requirements should be met:
In the next section, you will only see the excerpt from the source code that implements the above requirements:
Public Sub Form_Open() FMain.Center FMain.Arrangement = Arrange.Vertical FMain.Expand = False FMain.Margin = True FMain.Spacing = True ' Container HSplit HSplit1.Layout = [100, 0] ' Man sieht nach dem Programmstart die Box für die Anhänge zunächst nicht ' Container VBox links im Container HSplit vboxLeft.Margin = True ' Fester Abstand zwischen VBox-Rand und den 4 inneren HBoxen vboxLeft.Spacing = True ' Fester vertikaler Abstand zwischen den 4 inneren HBoxen hboxTo.Spacing = True ' Fester Abstand zwischen TextLabel und TextBox in der HBox (Empfänger) txlTo.W = 120 ' Feste Breite des TextLabels. Gilt für alle 4 TextLabel! txlTo.Alignment = Align.Right ' Text-Ausrichtung auf dem TextLabel ist "rechts" txbTo.Expand = True ' Die Weite der Textbox passt sich dynamisch an die Container-Weite von VBox an hboxCC.Spacing = True txlCC.W = 120 txlCC.Alignment = Align.Right txbCC.Expand = True hboxBCC.Spacing = True txlBCC.W = 120 txlBCC.Alignment = Align.Right txbBCC.Expand = True hboxSubject.Spacing = True lblSubject.W = 120 lblSubject.Alignment = Align.Right txbSubject.Expand = True ' Container rechts im Container HSplit ' vboxSubstitute ist ein Panel mit spezifischen Eigenschaftswerten (ohne Rand, Anordnung vertikal) vboxSubstitute.Border = Border.None ' Panel ohne Rand vboxSubstitute.Arrangement = Arrange.Vertical ' Vertikale Anordnung der 2 inneren Komponenten vboxSubstitute.Margin = True ' Fester Abstand zwischen VBox-Substitute und den zwei inneren HBoxen vboxSubstitute.Spacing = True ' Fester (vertikaler) Abstand zwischen den zwei inneren HBoxen lblAttachment.Alignment = Align.TopLeft ' Textanzeige in der linken, oberen Ecke hboxLIstBox.Expand = True ' Maximale Ausdehnung ListBox1.Expand = True ' Maximale Ausdehnung ListBox1.ScrollBar = Scroll.Both ' Komponente TextArea txaMailBody.Expand = True ' Füllt automatisch die Fläche, die HSplit und HBox (unten) frei lassen ' Container HBox unten hboxBottom.Height = 24 hboxBottom.Margin = False hboxBottom.Spacing = True panelSpace.Expand = True ' Schiebt die 2 Button an den linken bzw. an den rechten Rand des Containers End
All colour values have been set in the IDE. These have nothing to do with the arrangement of the containers and their contents.
Projects