The class IconPanel (gb.form) is a multi-container that can display large icons and text on its tabs (tab). This class behaves like a read-only array. An IconPanel consists of a left and a right pane.
You can use the Container component IconPanel to create decorative navigation for several sub-programmes with minimal effort. For each entry in the navigation bar (left pane) with a large icon and text, a corresponding area (right pane 1…k) is available for the arrangement of the components:
Figure 18.15.1: Use of the IconPanel component (Gambas IDE)
The properties of the IconPanel component are described in the following table:
IconPanel | Data type | Default | Description |
---|---|---|---|
Border | Boolean | False | Determines whether a border is displayed or returns this value. |
Count | Integer | 1 | Returns the number of tabs. |
Font | Font | System | Determines which font is used or returns the font used. The font must be installed in the system. |
Index | Integer | 1 | Determines which tab is active or returns the index of the active tab. |
Picture | Picture | Null | Determines which icon should be displayed in the current tab or returns the picture name. |
Text | String | - | Sets the text to be displayed in the current tab or returns the text. |
TextFont | Font | System | Sets the font to be used for the left pane only or returns the font. If this property is not set (zero), the value of the font property is used for both panes together. |
Table 18.15.1.1: IconPanel properties
The container component has only one special Click event. It is triggered when the current tab changes.
This project follows on from the example presented above of using the IconPanel component in the Gambas IDE to specify global settings, and provides guidance on some aspects of using the component to make your work easier. This is especially true at development time for
In the planning phase, you should determine the (starting) number of individual tabs, note their order, icon and text for the left-hand window area and record and comment on the arrangement of the components in the right-hand window areas - at least schematically.
Here you can see the arrangement of the components for Tab2 with matching icon and the caption text 'Settings' in the IDE and below at runtime:
Figure 18.15.3.1: Project - Development time
Figure 18.15.3.2: Project - runtime with changed text on Tab2.
For all work in the IDE it is important that the container component IconPanel is selected. Check this carefully! The surest way to do this is to click in the right pane of the IconPanel component. Before giving the source code in excerpts, here are some hints:
The source code is manageable because only a few properties are set at runtime and the functionality is limited to selecting the default font (→ Figure 18.15.3.2, red circle).
' Gambas class file Public Sub Form_Open() FMain.Center FMain.Resizable = False FMain.Caption = "Projekt-Einstellungen für das aktuelle Projekt: " & Application.Name FMain.Arrangement = Arrange.Fill FMain.Margin = True FMain.Spacing = True FMain.Persistent = True FMain.Utility = True ipnOption.Arrangement = Arrange.Vertical ipnOption.Border = True ipnOption.Margin = True ipnOption.Spacing = True ' Zur Kontrolle und zum Experimentieren: ' Print ipnOption.Font.ToString() ' Auslesen des eingesetzten Fonts (Z.B. Ubuntu, 11) ' ipnOption.Font = Font["Arial,10,Italic"] ' Font für die Komponente IconPanel setzen ' ipnOption.TextFont = Font["Arial,11,Bold"] ' Font speziell für den linken Fensterbereich setzen ipnOption.Index = 1 ' Der 2. Eintrag ist aktiv ipnOption[1].Background = &HE1EAF6 ' Hintergrundfarbe Tab1 ipnOption[1].Text = "Allgemeine Einstellungen" ' Text für Tab1 ändern! btnClearGlobalFont.Tooltip = "Standard-Schriftart setzen" End Public Sub txtGlobalFont_Click() If Dialog.SelectFont() Then Return ' Aktion: Abbrechen txtGlobalFont.Text = Dialog.Font.Name & " " & Dialog.Font.Size End Public Sub btnClearGlobalFont_Click() txtGlobalFont.Text = "Ubuntu 11" End Public Sub Form_Close() FMain.Close End