GAMBAS BOOK 3.18.0

The IconView component (gb.qt4) implements a control that can display labeled icons. IconView elements are indexed by a key. The component has an internal cursor for accessing its elements. Use the MoveFirst, MoveNext, MovePrevious, MoveBack or MoveTo methods to move the internal cursor and the Item property to display the current element.

Figure 17.6.1: IconView in the Project Explorer

The Project Explorer in the examples of Gambas under the heading Miscellaneous uses an IconView to display the directory structure.

The following 2 tables describe selected properties and methods of an IconView:

tablelayout

Table 17.6.1.1: Selected properties of the component IconView

You can assign a self-defined context menu to an IconView, which you call by clicking with the right mouse button (RMT).

The alignment of the displayed text and the icon can take the values Arrange.vertical (text under the icon and vertical display of the icon) or Arrange.horizontal (text next to the icon and horizontal display of the icon).

Methods of an IconView:

tablelayout

Special events of the IconView component can be found here:

tablelayout

Table 17.6.2.1: Overview of events of an IconView

You can use the IconView.sorted property to display the elements in an IconView sorted by the displayed text. The property IconView.Compare and the event IconView_Compare(Key As String, OtherKey As String) also enable you to sort by user-defined criteria. Use the Compare property to display the result of the comparison of a Compare event. The return value of the comparison is valid:

• 0 means that the two elements are equal.
• 1 means that the first element is after the second.
• -1 means that the first element is before the second.

Figure 17.6.3.1: IconView with three elements

The order of the display at program start is determined by the order in which the IconView is filled → Figure 17.6.3.1.

Figure 17.6.3.2: IconView with sorted elements

After sorting with the sort criterion Image.width ∗ Image.height the display has changed → Figure 17.6.3.2. The source text is fully specified:

' Gambas class file
 
Public Sub Form_Open()
  Dim aPaths As String[] = ["icon:/48/book", "icon:/64/calendar", "icon:/32/play"]
  Dim sPath As String
 
  FMain.Center 
  FMain.Resizable = False 
' Als Key wird der Pfad zum Bild gewählt.
  For Each sPath In aPaths
    ivwIcons.Add(sPath, File.BaseName(sPath), Picture[sPath]) ' Füllen der IconView
  Next ' sPath  
End ' Form_Open()
 
Public Sub ivwIcons_Compare(Key As String, OtherKey As String)
  Dim iSize, iOtherSize As Integer
' Sortier-Kriterium: Bild.Breite * Bild.Höhe
  With ivwIcons[Key].Picture
    iSize = .W * .H
  End With
  With ivwIcons[OtherKey].Picture
    iOtherSize = .W * .H
  End With
  ivwIcons.Compare = IIf(iSize = iOtherSize, 0, IIf(iSize > iOtherSize, 1, -1))
  ' Alternative:
  ' ivwIcons.Compare = Sgn(iSize - iOtherSize)
End
 
Public Sub btnSort_Click()
  ' Nach dem Setzen von ivwIcons.Sorted auf True wird das IconView im Hintergrund
  ' eine Reihe von Compare-Events auslösen, um die Liste sortieren zu lassen.
  ' Wird ivwIcons.Sorted auf False gesetzt, dann wird nicht weiter sortiert.
 
  ivwIcons.Sorted = Not ivwIcons.Sorted  
  If ivwIcons.Sorted Then
     btnSort.Text = ("Icon sind sortiert.")
     btnSort.Enabled = False
  Endif ' ivwIcons.Sorted = True ?  
End ' btnSort_Click()

If you set the IconView.editable property to True, you can set a selected element to edit mode with F2, change the text and exit edit mode with Enter. The changed text is copied:

Figure 17.6.4.1: IconView - Rename elements

The extract from the source code allows the edit mode for an icon view with saving of the old text of the renamed icon:

Private $sLastIconName As String
 
Public Sub Form_Open()
  FMain.Center
  FMain.Resizable = True
  ...
  IconView.Editable = True 
End ' Form_Open()
 
Public Sub IconView_Rename()
  Message.Info("Das Icon '" & $sLastIconName & "' wurde umbenannt in " & "'" & \\
                IconView.Current.Text & "'")
End ' IconView_Rename()
 
Public Sub IconView_Select()
  $sLastIconName = IconView.Current.Text
End ' IconView_Select()

Die Komponente IconView (gb.qt4) implementiert ein Steuerelement, das beschriftete Symbole anzeigen kann. IconView-Elemente werden durch einen Schlüssel indiziert. Die Komponente verfügt über einen internen Cursor für den Zugriff auf seine Elemente. Verwenden Sie u.a. die Methoden MoveFirst, MoveNext, MovePrevious, MoveBack oder MoveTo, um den internen Cursor zu bewegen und die Item-Eigenschaft, um das aktuelle Element anzuzeigen.

Abbildung 17.6.1: IconView im Projekt Explorer

Das Projekt Explorer in den Beispielen von Gambas unter der Rubrik Verschiedenes nutzt eine IconView für die Anzeige der Verzeichnisstruktur.

In den folgenden 2 Tabellen werden ausgewählte Eigenschaften und Methoden einer IconView beschrieben:

Tabelle 17.6.1.1: Ausgewählte Eigenschaften der Komponente IconView

Sie können einer IconView ein selbst definiertes Kontext-Menü zuordnen, das Sie über einen Klick mit der rechten Maustaste (RMT) aufrufen.

Die Ausrichtung des angezeigten Textes und des Icon kann die Werte Arrange.Vertical (Text unter dem Icon und vertikale Anzeige der Icon) oder Arrange.Horizontal (Text neben dem Icon und horizontale Anzeige der Icon) annehmen.

Methoden einer IconView:

Tabelle 17.6.1.2: Übersicht zu ausgewählten Methoden der Klasse IconView

Spezielle Ereignisse der Komponente IconView finden Sie hier:

Tabelle 17.6.2.1: Übersicht zu Ereignissen einer IconView

Mit Hilfe der Eigenschaft IconView.Sorted können Sie die Elemente in einer IconView nach dem angezeigten Text sortiert anzeigen lassen. Über die Eigenschaft IconView.Compare und das Ereignis IconView_Compare(Key As String, OtherKey As String) gelingen Ihnen auch Sortierungen nach selbst festgelegten Kriterien. Verwenden Sie die Eigenschaft Compare, um das Ergebnis des Vergleichs eines Compare-Ereignisses anzuzeigen. Dabei gilt für den Rückgabewert des Vergleichs:

• 0 bedeutet, dass die beiden Elemente gleich sind.
• 1 bedeutet, dass das erste Element nach dem zweiten steht.
• -1 bedeutet, dass das erste Element vor dem zweiten steht.

Abbildung 17.6.3.1: IconView mit drei Elementen

Die Reihenfolge der Anzeige beim Programmstart wird durch die Rangfolge beim Füllen der IconView vorgegeben → Abbildung 17.6.3.1.

Abbildung 17.6.3.2: IconView mit sortierten Elementen

Nach dem Sortieren mit dem Sortierkriterium Bild.Breite ∗ Bild.Höhe hat sich die Anzeige geändert → Abbildung 17.6.3.2. Der Quelltext wird vollständig angegeben:

' Gambas class file
 
Public Sub Form_Open()
  Dim aPaths As String[] = ["icon:/48/book", "icon:/64/calendar", "icon:/32/play"]
  Dim sPath As String
 
  FMain.Center 
  FMain.Resizable = False 
' Als Key wird der Pfad zum Bild gewählt.
  For Each sPath In aPaths
    ivwIcons.Add(sPath, File.BaseName(sPath), Picture[sPath]) ' Füllen der IconView
  Next ' sPath  
End ' Form_Open()
 
Public Sub ivwIcons_Compare(Key As String, OtherKey As String)
  Dim iSize, iOtherSize As Integer
' Sortier-Kriterium: Bild.Breite * Bild.Höhe
  With ivwIcons[Key].Picture
    iSize = .W * .H
  End With
  With ivwIcons[OtherKey].Picture
    iOtherSize = .W * .H
  End With
  ivwIcons.Compare = IIf(iSize = iOtherSize, 0, IIf(iSize > iOtherSize, 1, -1))
  ' Alternative:
  ' ivwIcons.Compare = Sgn(iSize - iOtherSize)
End
 
Public Sub btnSort_Click()
  ' Nach dem Setzen von ivwIcons.Sorted auf True wird das IconView im Hintergrund
  ' eine Reihe von Compare-Events auslösen, um die Liste sortieren zu lassen.
  ' Wird ivwIcons.Sorted auf False gesetzt, dann wird nicht weiter sortiert.
 
  ivwIcons.Sorted = Not ivwIcons.Sorted  
  If ivwIcons.Sorted Then
     btnSort.Text = ("Icon sind sortiert.")
     btnSort.Enabled = False
  Endif ' ivwIcons.Sorted = True ?  
End ' btnSort_Click()

Wenn Sie die Eigenschaft IconView.Editable auf True setzen, können Sie ein markiertes Element mit F2 in den Edit-Modus setzen, den Text ändern und mit Enter den Edit-Modus wieder verlassen. Der geänderte Text wird übernommen:

Abbildung 17.6.4.1: IconView – Elemente umbenennen

Der Auszug aus dem Quelltext ermöglicht den Edit-Modus für ein IconView mit Speicherung des alten Textes des umbenannten Icon:

Private $sLastIconName As String
 
Public Sub Form_Open()
  FMain.Center
  FMain.Resizable = True
  ...
  IconView.Editable = True 
End ' Form_Open()
 
Public Sub IconView_Rename()
  Message.Info("Das Icon '" & $sLastIconName & "' wurde umbenannt in " & "'" & \\
                IconView.Current.Text & "'")
End ' IconView_Rename()
 
Public Sub IconView_Select()
  $sLastIconName = IconView.Current.Text
End ' IconView_Select()