Die Komponente TImageList ist für das speichern und ablegen von Bildern dar. Die Komponente erstellt einem Index für die Bilder. Der Index kann durch einen Doppelklick auf die Komponente per Drag and Drop verwaltet werden siehe Abbildung 1.00 von TImageList.
Abb. 1.00 Bildeditor leer
Um Bilder und Grafiken zur TImageList hinzuzufügen können wir nun auf den Button hinzufügen klicken und Bilder, Icons oder andere Grafiken auswählen. In meinem Beispiel werde ich Icons auswählen und diese in einem TMainMenü verwenden. Ihr bekommt kostenlose Icons unter Flaticon.com. Ich habe dazu bereits einen Artikel geschrieben. Kostenpflichtige Icons gibt auf Stockfotoseiten wie fotolia.com und stockfoto.com für die kommerzielle Nutzung und bereits in verschiedenen schönen Farben.
Abb. 1.00 TSplitter
Die Komponente TSplitter findest du im Hauptmenü von Lazarus unter Addtional und sie ist die zehnte Komponente von Links und befindet sich direkt rechts neben der TLabeledEdit Komponente.
Bitte füge als erstes eine Komponente vom Typ TPanel ein. Diese findest du im Lazarus Hauptfenster unter Standard und ist die dritte Komponente von rechts. Du kannst die Komponente TPanel anklicken und dann in das Form1 klicken um sie zum Form1 hinzufügen. Jetzt gehst hin und vergrößerst die Komponente auf eine Breite von 246. In der Höhe nimmst du einen Abstand von 0 und zum Ende des Formulars ebenfalls von 0. Jetzt klickst du in den Objektinspektor und stellst die Eigenschaft Align auf alLeft. Der Panel nimmt nun auch bei einer Vergrößerung oder Verkleinerung des Form1 auf der linken Seite, oben und unten 100% sein.
Jetzt wähle im Hauptfenster von Lazarus die Komponente TSplitter aus und klicke es an und füge es an der rechten Seite des Panel1 an. Die beiden Komponenten sollten im Objektinspektor untereinander dargestellt werden und nicht hieratisch. Du kannst den Splitter nun positionieren und in an die linke Seite anheften lassen. Wenn du dein Programm jetzt startest kannst du deinen Panel1 nach links und nach rechts verschieben und den Panel1 sogar so verkleinern das es verschwindet.
Abb. 1.00 TPanel
Die Komponente TPanel dient dazu ein Form in Bereiche aufzuteilen. Die Komponente TPanel findest du unter Standard im Hauptfenster von Lazarus und ist die dritte Komponente von rechts. Klicke diese bitte an um sie auszuwählen und dann in dein Form um diese in dein Form einzufügen.
Für das Beispiel das ich dir gleich zeigen werde benötigst du zwei TPanel. Bitte positioniere ein Panel auf der linken Seite und ein Panel auf der rechten Seite. Mein Form1 hat im gezeigten Beispiel eine weite (width) von 629 Pixel und eine Höhe (height) von 400 Pixel. Das linke Panel ist Panel1 und das rechte Panel ist Panel2.
Klicke nun den linken Panel an und stelle die weite (width) auf 180 Pixel. Danach klickst du auf die Eigenschaft Align und wählst alLeft an. Der Panel füllt nun die gesamte linke Seite aus. Nun gehe zum linken Panel2 und lege in an dem linken Panel an und ziehe ihn bis ganz rechts. Lasse den Panel2 zusätzlich von oben 0 Pixel Platz (Eigenschaft Top = 0). Und ziehe mit der Maus dem Panel bis an das untere Ende.
Dann gehst du in den Objektinspektor und klickst auch hier die Eigenschaft Align an. Stelle jetzt den Panel 2 auf alClient. Zur Farblichen Unterscheidung kannst du bei beiden Panel eine unterschiedliche Farbe auswählen. Die Farbe der Panel kann man mit den Standard Farben unter Color ändern.
Bereits jetzt solltest du sehen können das beim Vergrößern und verkleinern des Form1 mit der Maus Panel 1 nach links, oben und unten die gesamte linke Seite ausfüllt. Beim Panel2 wirst du bei vergrößern und verkleinern sehen das sich das Panel nach rechts ausbreitet beim vergrößern und beim verkleinern verkleinert es sich. Auf diese Art lassen sich für eure Programme dynamische Benutzeroberflächen gestalten.
Anbei kannst du dir das kleine Programm als Demo herunterladen.
Zum herunterladen
Anwendung awtpanelgui.7z
Abb. 1.00 TMemo
Das TMemofeld findest du in der Rubrik Standard und ist die sechste Komponente von Links. Das Memo1 ist von Typ TMemo. Die Komponente kann durch das Anklicken ausgewählt werden und dann mit einem weiteren Klick in das Form1 eingefügt werden. Nachdem das Memofeld eingefügt wurde, kann es per Drag and Drop, also durch das Anklicken und ziehen verkleinert und vergrößert werden. Weitere Möglichkeiten es In der Höhe und Breite zu definieren hast du über den Objektinspektor. Die Eigenschaft width ist hier die Breite und Height die Höhe. Mit der Eigenschaft left kann man das Memofeld von Links und Top mit der Eigenschaft Top von oben positionieren. Daten hinzufügen kannst du bei der Eigenschaft Lines und dann den Button mit den drei Punkten auswählen. Die Daten in dem sich öffnenden Fenster eintragen und mit dem OK Button bestätigen.
Abb. 1.00 TButton
Die Komponente TButton findest du im Hauptfenster von der Lazarus IDE unter der Rubrik Standard. Sie ist von Links die dritte Komponente. Um diese in dein Form1 zu bekommen klickst du Sie an und klickst dann in dein Form1. Die Komponente fügt sich damit zum Form1 hinzu. Dies siehst du an einem zusätzlichen Eintrag im Objektinspektor.
Die Größe des Buttons kann per Drag and Drop vorgenommen werden. Eine weitere Möglichkeit ist die Einstellung über den Objektinspektor die Eigenschaften festzulegen. Die dritte Möglichkeit ist die Komponente im Quellcode zur Erstellung mit den Eigenschaften anzulegen. Hierzu könnte man zur Laufzeit und bei der Erstellung des Form1 auch die Eigenschaften der Komponente TButton festlegen. Die in Zeile 03 und 04 angegebenen Zahlen für die Höhe und Weite sind die Anzahl der Pixel auf dem jeweiligen Wiedergabegerät.
(mehr …)