Winkelmann Software Blog

TToolBar

Einleitung

Um in einem Projekt eine Menüleiste wie bei z.B. LibreOffice Writer einfügen zu können kann man eine Toolbar einsetzen. Diese ist vom Typ TToolBar. In LibreOffice Writer sind die einzelnen Programm Funktionen in kleinen Bildern dargestellt die eine TToolBar nutzen um diese anzuzeigen. Als Beispiel siehst du hier die TToolBar des LibreOffice Writer.

Abb. 1.01Beispiel ToolBar LibreOffice Writer

Abb. 1.01Beispiel ToolBar LibreOffice Writer

Das Tutorial als Video

Teil 01: Verhalten der TToolBar

Die TToolBar befindet sich bei Lazarus unter Common Controls und ist das 6te Icon von links. Klickt man das Icon an und dann in ein TForm wird die TToolBar immer ganz oben und über die komplette Breite platziert.

Abb. 1.02 TToolBar im oberen Bereich des Form1

Abb. 1.02 TToolBar im oberen Bereich des Form1

Die kann gewünscht sein um, die Toolbar zu palzieren können wir diese auch in einem TPanel laden. Auch im TPanel wird die TToolBar über die gesamte Breite dargestellt. Der TPanel kann danach nur noch sehr schwer per Mausklick bewegt werden. Über den Objektinspektor lässt er sich allerdings noch spazieren. Nachfolgend siehst du ein Bild indem die Beispiel Software mit einer TToolBar umgesetzt wurde.

Abb. 1.03 TToolBar Software

Abb. 1.03 TToolBar Software

Teil 02: Buttons anlegen

Im Objektinspektor können wir durch einen Rechtsklick auf die Komponente TToolBar Buttons anlegen.

Abb. 1.04 Neuen Button anlegen

Abb. 1.04 Neuen Button anlegen

Zusätzlich können hier CheckButton und neue Trennlinien, sowie neue Teile angelegt werden. Beim anlegen kann man die Buttons leider kaum erkennen da diese keine Icons haben.

Teil 03: Button mit Icon anlegen

Um bei einem Button ein Icon zu hinterlegen benötigen wir eine TImageList. In dieser Können wir in einer Liste verschiedene Icon Laden und der Komponente TToolBar im Objektinspektor unter Images die neu erstellte ImageList1 vom Typ TImageList hinzufügen. Bei den einzelnen Buttons im Objektinspektor können wir nun unter ImageIndex den Index des Bildes auswählen und hinterlegen. Die Image Liste fängt immer bei 0 an. Um in den Bildlisteneditor zu kommen klick ihr auf die Komponente TImageList mit einem Rechtsklick und wählt dann ImageList Editor… aus.

Abb. 1.05 Bildlisteneditor / ImageList Editor…

Abb. 1.05 Bildlisteneditor / ImageList Editor…

Die Bedienung des Editors ist selbstbeschreibend. Schöne Icons bekommt ihr z.B. unter Remixicon. Diese verwende ich hier in einer Größe von 16 Pixel * 16 Pixel. Dafür müsst Ihr diese in einem Bildbearbeitungsprogramm anpassen.

Teil 04: Button Funktion

Der einzelne Button hat im Objektinspektor dieselben Eigenschaften wie ein normaler TButton und können z.B. mit einem OnClick Ereignis ausgestattet werden. In unserem Beispiel habe ich den ersten Button mit einem OnClick Ereignis ausgestattet und ein TLabel in unserer Beispiel Software hinzugefügt. Durch den Klick auf den Button ändere Ich die Caption des TLabels von Label1 nach Hallo Welt. Nachfolgend der Quellcode.

procedure TForm1.ToolButton1Click(Sender: TObject);
begin
Label1.caption := 'Hallo Welt';
end;

Teil 05: Software Download

Nachfolgend könnt ihr die Software ohne ausführende EXE-Datei herunterladen. Die Software wurde mit Lazarus v 2.0.12 erstellt und sollte unter Windows und Linux ausführbar sein.

Der Software Download ist 190kb groß und ist mit der Software 7Zip komprimiert.

Download Link (190kb): TToolBar Beispiel Software


Winkelmann Software Blog

TRadioButton

Einleitung

Mit einem TRadioButton trifft man bei einem Programm als Anwender eine Auswahl. Im Internet bei Webseiten kennt man einen TRadioButton bei einer Umfrage für eine Auswahl. Bei Lazarus und Freepascal lassen sich die Buttons vom Typ TRadioButton durch eine Oberflächen Komponente oder einem Gruppen Komponente automatisch gruppieren.

Video Anleitung (Alle 3 Teile)

Teil 01: Die Beispiel Software TRadioButton

In der Beispiel Software sind im oberen Teil die TRadioButton RadioButton1 und RadioButton2 auf einem TPanel gruppiert.

Im Button1 ist die Funktion zur Auswertung welcher Button aktiv ist. Im Editfeld wird das Ergebnis angezeigt.

Im unteren Teil habe ich ein Gruppenelement vom Typ TGroupBox verwendet um die TRadioButton – RadioButton3, RadioButton4, RadioButton5, RadioButton6 zu gruppieren.

Im Button2 ist die Funktion zur Auswertung welcher der Buttons aktiv ist und im Editfeld wird dies nach Klick auf den Button angezeigt.

Teil 02: Button1Click Quellcode

 

procedure TForm1.Button1Click(Sender: TObject);
begin
If RadioButton1.Checked = true then
Begin
RB1Aktiv.Text := 'RB1';
end;
If RadioButton2.Checked = true then
Begin
RB1Aktiv.Text := 'RB2';
end;
end;

Mit dem Wort Procedure wird die Procedure eingeleitet. Die Procedure befindet sich auf dem Form1 das vom Typ TForm1 ist. Die Procedure trägt den Namen Button1Click und es muss ein TObjekt übergeben werden. Das ist der Klick des Anwenders auf dem Button. Mit dem Word begin wird die Procedure Rumpf begonnen in dem die Anweisungen geschrieben werden. Mit der If Abfrage frage ich ab ob der RadioButton1 Ausgewählt wurde. Gelesen wird das folgendermaßen: „Wenn der RadioButton1 ausgewählt wurde dann mache folgendes. Das Editfeld RB1Aktiv soll als Text anzeigen das der RadioButton1 abgekürzt RB1 ausgewählt wurde. In der zweiten If Anweisung wird dies mit dem RadioButton2 wiederholt.

Teil 03: Button2Click Quellcode

 

procedure TForm1.Button2Click(Sender: TObject);
begin
If RadioButton3.Checked = true then
Begin
RB2Aktiv.Text := 'RB3';
end;
If RadioButton4.Checked = true then
Begin
RB2Aktiv.Text := 'RB4';
end;
If RadioButton5.Checked = true then
Begin
RB2Aktiv.Text := 'RB5';
end;
If RadioButton6.Checked = true then
Begin
RB2Aktiv.Text := 'RB6';
end;
end;

Die folgende Procedure ist der unter Punkt zwei ähnlich. Diese wertet die Radiobutton 3 – 6 aus und zeigt diese in dem Editfeld RB2Aktiv in der Eigenschaft Text an.

Teil 04: Beispiel Software herunterladen

Du kannst dir die Software wie immer herunterladen und ansehen. Durch Datenkompression habe ich die Software mit der Software 7Zip gepackt und die kompilierte EXE-Datei entfernt.
LINK zum Herunterladen (ca. 139kb groß):  Herunterladen

Teil 05: Weiterführende Links in das deutsche Freepascal Wiki

Link zum deutschsprachigen Freepascal Wiki: https://wiki.freepascal.org/


Winkelmann Software Blog

TToggleBox

Einleitung

Die Beispiel Software zum Thema TToogleBox könnt ihr euch hier herunterladen. Eine TToggleBox ist ein Einschalter und Ausschalter der beim einmaligen Klick auf dem Stand stehen bleibt. Ähnlich wie bei einem Stromschalter für das Wohnzimmer, dass beim einmaligen einschalten an bleibt, bleibt auch unsere TToggleBox beim Schalten auf den Einschaltzustand oder Ausschaltzustand stehen.

Video Tutorial TToggleBox

Teil 01: TToggleBox – Beispiel 01 Teil 01

In Beispiel 01 beschreibe ich wie man ein TEditfeld mit zwei TToggleBox Button beeinflussen kann. Ich gehe hier auch zwei unterschiedliche Eigenschaften ein. Für jeden der beiden TToggleBox Button gibt es eine Funktion.

Quellcode:

Abb. 1.02 Quellcode TToggleBox Beispiel 1 Teil 01

Abb. 1.02 Quellcode TToggleBox Beispiel 1 Teil 01

Mit der IF Abfrage fragen wir den Zustand der TToggleBox TTBSichtbar.checked ab.
Ist dieser wahr (true), dann setze die Beschriftung (Caption) der TToggleBox auf >>unsichtbar<< und die Eigenschaft visible des Editfeldes TEdtEdit1 auf false.
Ist das unwahr dann setze die Beschriftung (Caption) der TToggleBox auf >>sichtbar<< und die Eigenschaft visible des Editfeldes TEdtEdit1 auf true.

Quellcode Prozedur 2:

Abb. 1.03 Quellcode TToggleBox Beispiel 1 Teil 02

Abb. 1.03 Quellcode TToggleBox Beispiel 1 Teil 02

Im zweiten Teil unseres ersten Beispiels läuft es genau gleich ab wie im ersten Teil. Wir fragen wieder den Zustand checked ab und aktivieren oder deaktivieren das Editfeld.

Teil 02: TToogleBox – Beispiel 01 Teil 02

In Beispiel zwei gibt es ein Anwendungsbeispiel. Hier könnt ihr z.B. die IP Adresse oder den Hostnamen von einem IT System anzeigen lassen. In diesem Beispiel ist es die IP Adresse und der Hostname meines mobilen Computers.

Abb. 1.04 Quellcode TToggleBox Beispiel 2

Abb. 1.04 Quellcode TToggleBox Beispiel 2

Die eigentliche Abfrage ist wieder wie in unserem ersten Beispiel. Nur das wir die Eigenschaft Text des Editfeldes beeinflussen.

Teil 03: Quellcode Im Überblick:

procedure TForm1.TTBSichtbarClick(Sender: TObject);
begin
// Beispiel 01 Teil 01
if TTBSichtbar.Checked = true then
begin
TTBSichtbar.Caption := 'unsichtbar';
TEdtEdit1.visible := false;
end
else
begin
TTBSichtbar.Caption := 'sichtbar';
TEdtEdit1.visible := true;
end;
end;

procedure TForm1.TTBAktivClick(Sender: TObject);
begin
// Beispiel 01 Teil 02
if TTBAktiv.Checked = true then
begin
TTBAktiv.Caption := 'Aktiv';
TEdtEdit1.enabled := false;
end
else
begin
TTBAktiv.Caption := 'inAktiv';
TEdtEdit1.enabled := true;
end;
end;

procedure TForm1.TTBHostOrIPClick(Sender: TObject);
begin
// Beispiel 02 Teil 01
if TTBHostOrIP.Checked = false then
begin
TTBHostOrIP.Caption := 'Hostname';
TEdtHostOrIP.text := 'AndreMobil';
end
else
begin
TTBHostOrIP.caption := 'IP Adresse';
TEdtHostOrIP.text := '192.168.178.55';
end;
end;


Winkelmann Software Blog

TPopupMenu

Einleitung

Abb. 1.01

Abb. 1.01 PopupMenu Windows 10

Teil 01: TPopupMenu in Lazarus

Das PopupMenu ist das Menü das aufpoppt, wenn man in einem Betriebssystem oder einer Software einen Rechtsklick ausführt.

TPopupMenu

Abb. 1.02 TPopupMenu Lazarus IDE

Das TPopupMenu in Lazarus ist das zweite Symbol im Reiter Standard Abb. 1.02.

TPopupMenu Einstellungen

Abb. 1.03 TPopupMenu Einstellungen

Mit einem Klick auf dem Symbol und dann auf das Form1 kann man sich ein TPopupMenu in sein Programm holen.
Durch einen Doppelklick auf das Symbol kann man die Einstellungen Abb. 1.03 für das Menü händisch per Mausklick einstellen.

Abb. 1.04 TPopup Objektinspektor

Abb. 1.04 TPopup Objektinspektor

Im Objektinspektor muss man nun im Form1 das PopupMenu unter der gleichnamigen Eigenschaft eintragen siehe Abb. 1.04

Abb. 1.05 Form1 wird ausgeführt mit TPopupManu

Abb. 1.05 Form1 wird ausgeführt mit TPopupManu

In Abb. 1.05 sieht man das fertige Programm in der Simulation.

 


Winkelmann Software Blog

TFrame

Einleitung:

In Lazarus kann man Frames vom Typ TFrame verwenden und diese als Komponente laden. In einem Frame kann man Programmteile auslagern. Wie man einen Frame in ein Form laden kann beschreibe ich in dem folgenden Artikel.

Den Beitrag als Video ansehen:

TFrame Beispiel Software

Teil 01: Die Software GUI

Ich das Form1 genommen und ein TMainMenu auf ihm platziert. Das Menu hat verschiedene Einträge. Wir benötigen hier zwei. In meinem Beispiel sind des die Buttons Ticket und Asset die ich verwendet habe.

Teil 02: Anlegen der Frames

Frame erstellen

In Lazarus unter Neu-> Frame können wir einen neuen Frame vom Typ TFrame anlegen. Speichern Sie den Frame dann ab. Ich habe die Frames ticket und asset genannt. In diesen Frames können wir nun zur Unterscheidung unterschiedliche Inhalte und Komponenten anlegen

Teil 03: Prozedur giveFrameFree erstellen

Als nächstes legen wir in unserer Software eine neue Prozedur diese trägt den Namen giveFrameFree und macht genau das die Frames die wir laden freigeben. Nachfolgend der Quelltext mit Erläuterungen.

procedure TForm1.giveFrameFree;
begin
TFrame1(FindComponent('FrmAsset')).Free;
TFrame2(FindComponent('FrmTicket')).Free;
end;

Der Kopf der Prozedur lautet: procedure TForm1.giveFrameFree; Das Wort procedure zeigt das es sich um eine Prozedur handelt. TForm1 ist das Formular indem sich die Prozedur befindet und giveFrameFree; ist der beschreibende und ausdruckstarke Name der Prozedure. Das Word begin leitet den Rumpf der Prozedur ein und das Wort end; schließt diesen wieder.

In Schritt 04 legen wir zwei OnClick Ereignisse an die wir laden möchten. In den Anweisungen die in der oben stehenden Prozedur stehen geben wir diese wieder frei. Der erste Frame vom Typ TFrame1 trägt den Namen ‚FrmAsset‘ . mit der Funktion FindComponent suchen wir die Komponenten und geben diese mit .Free wieder frei.

Teil 04: OnClick Ereignisse erstellen
Wir können einen Frame nutzen wie eine Komponente die zur Laufzeit eingebunden wird. Erstellen Sie unter dem Menüpunkt Asset und Ticket folgende OnClick Ereignisse. Gehen Sie dafür in das TMainmenu und Rufen Sie den richtigen Button mit einem Doppelklick auf. Die Prozeduren werden im Quelltext automatisch angelegt. Quellcode nachfolgend:

procedure TForm1.MenuItem1Click(Sender: TObject);
var
frmAsset : TFrame1;
begin
// Alle Frames freigeben
giveFrameFree;

frmAsset := TFrame1.Create(Self);
frmAsset.parent := Form1;
frmAsset.top := 0;
frmAsset.left := 0;
frmAsset.name := 'FrmAsset';
end;

procedure TForm1.MenuItem2Click(Sender: TObject);
var
frmTicket : TFrame2;
begin
// Alle Frames freigeben
giveFrameFree;
// Erstelle den Frame
frmTicket  := TFrame2.Create(Self);
frmTicket.parent := Form1;
frmTicket.top := 0;
frmTicket.left := 0;
frmTicket.name := 'FrmTicket';
end;

Beide Prozeduren sind gleich aufgebaut und können daher auch durch eine dynamische Prozedur ersetzt werden. Ich beschreibe nun nachfolgend den Quelltext der Prozedur MenuItem2Click. Wird auf den Button mit dem Namen Ticket geklickt erstellen wir eine Variable var vom Typ TFrame2 mit dem Namen frmTicket. In der Prozedur selber rufen wir als erstes unsere selbst erstellte Prozedur auf um alle Frames freizugeben. Danach erstellen wir unseren benötigten Frame mit frmTicket  := TFrame2.Create(Self);. Im zweiten Schritt sagen wir das das Eltern Element das Form1 sein soll. Wir könnten auf unserem Form1 auch ein neues Panel erstellen und hier die Daten laden. Das bleibt euch überlassen. In den nächsten beiden Zeilen legen wir den Abstand von Oben (Top) fest und den Abstand von links (Left) fest. In der letzten Anweisung legen wir den Namen des Frames fest. Wichtig den Namen kann es nur einmal geben. Wollt ihr dynamisch mehrere Frames desselben Typs laden könnt ihr z.B. über eine for Schleife den Namen mit einer fortlaufenden Nummer versehen. Dies könnte z.B. bei einem Ticketsystem das Dashboard sein. Hier könnte ich mir ein Frame WorkerTicket vorstellen. Dieser zeigt an welche Tickets welcher Mitarbeiter gerade bearbeitet. Das es mehrere Mitarbeiter in einem Team gibt die Frames alle gleich sein können, bleiben könntet ihr diese dynamisch über eine for Schleife laden und die Zustände in einer Datenbank speichern, damit diese bei jedem neuen Start geladen werden können.

Beispielsoftware herunterladen. Die Datei ist als Zip mit 7Zip gepackt. Die Software wurde unter Windows 10 64Bit Version 1909 erstellt und unter Linux Mint 20.1 Ulyssa getestet. Beide Versionen sind lauffähig.

Update: Ereignisse OnShow OnCreate bei einem Frame.

Um Bei einem Frame ein In Create oder OnShow Ereigniss nutzen zu können, kann man den Constructor Create überschreiben.

Bei den Funktionen ergänzt man unter public

constructor Create(AOwner: TComponent); override;
Der Code sorgt dafür das ihr mit der unten stehenden Funktion den Constructor überschreiben könnt.

Unter implementation fügt ihr folgende hinzu.

uses
startu1;
In meinem Programm (Update siehe unten) lesen wir Daten aus dem Form1 aus und setzen dann die Caption des PageSheet auf Geräte oder Assts.

Der Constructor selbst sieht dann z.B so aus.

constructor TFrame2.Create(AOwner: TComponent);
begin
inherited Create(AOwner);

if (Form1.CBMMLanguage.ItemIndex = 1) then
begin
TabSheet1.Caption := 'Geräte';
end;
if (Form1.CBMMLanguage.ItemIndex = 0) then
begin
TabSheet1.Caption := 'Assets';
end;
end;

Update: Beispiel Software Update: