Eingabe und Ausgabe in Lazarus mit GUI

TLabel: Label -> Text

Abb. 1.01 Fertige Anwendung im Form1

Nun zeige ich dir, wie du ein einfaches Programm mit Benutzeroberfläche in Lazarus und Free Pascal entwickeln kannst. Bitte speichere dein aktuelles Projekt indem du die Diskette anklickst. Danach gehst du auf Projekt-> neues Projekt -> Anwendung. Es öffnet sich ein Entwicklungsfenster mit dem Namen Form1 und ein Quelltext mit dem Namen Unit1. Das Fenster ist in Lazarus eine Komponente. Die Eigenschaften wie Farbe, Caption (Title in der Kopfzeile), Abstand von Links und von Oben usw. kannst du im Objektinspektor festlegen.

Zusätzlich können hier auch Ereignisse erstellt werden. Ein Ereignis kann das Schließen des Fensters, das Erstellen, Darstellen oder auch Anklicken eines Fensters sein. Dazu gibt es später noch mehr. Im Quelltext öffnet sich nach dem Erstellen eines Ereignisses der Quelltext Editor. Hier werden die Funktionen wie z.B. eine OnClick Funktion programmiert. Bitte speichere das Programm unter Ordner Kapitel 4. Du musst zwei Dateien speichern, einmal die .lpi und die .pas. Datei. Die .lpi Datei ist das Formular und der Quelltext befindet sich in der .pas Datei. Die erste .lpi Datei speicherst du einem neuen Ordner im Kapitel 4 Ordner und gibst der Datei den Namen eva.lpi. Das eva steht bei beiden Dateinamen für Eingabe, Verarbeitung und Ausgabe. Die zweite Datei nennst du evau1.pas.Das u1 steht hier für Unit1.

Eingabe und Ausgabe mit GUI als Video

TLabel: Label -> Tex (Fortsetzung)t

Wir möchten nun unser Form1 mit einer weiteren Komponente ausstatten und zwar mit einem Label. Die Komponente findet sich unter Standard -> ABC. Du musst die Komponente nur anklicken und danach in das Form1 klicken. Das Form1 ist als Komponente vom Typ ein TForm unser neues Label heißt nun Label1 und ist vom Typ ein TLabel. Die Bezeichnung und Darstellung des Labels ist ebenfalls Label1. Wir ändern den Namen der Komponente Label1 im Objektinspektor unter Name in LBLName dies steht für LBL = Label und Name für die Bezeichnung. Es ist hierbei wichtig den Typ immer vorne im Namen anzugeben, da du später auch Editfelder und Button haben wirst. Bei einem großen Programm mit mehreren Forms, schreibt man auch noch den Form Name dazu.

Als nächstes ändern wir die Caption in „Bitte geben Sie Ihren Namen ein!“. Die Caption ist die Beschriftung. Der Textinhalt, der Caption, wird dem Nutzer später im Programm angezeigt.

TEdit: Editfeld

Jetzt müsst du noch irgendwo deinen Namen eingeben können. Die Dazu passende Komponente lautet TEdit und ist ein Editfeld. Die TEdit Komponente findest du unter Standart-> TEdit rechts neben dem bereits ausgewählten TLabel. Ziege die Komponente unter unser TLabel und ändere den Namen der Komponente in EdtName. Das Edt steht hier für Editfeld. Die Schreibweise des Namens sieht etwas komisch aus oder? Zusammengeschrieben und jeder Name großgeschrieben? Ein Komponentenname muss durch die Vorgabe, von Lazarus immer zusammengeschrieben werden und dar nur Buchstaben beinhalten. Die Schreibweise jedes neue Wort mit Großbuchstaben zu beginnen heißt Camel Case Notation. Bei einem Editfeld gibt es keine Caption (Bezeichnung), sondern einen voreingestellten Text als Eigenschaft. Diesen ändern wir indem wir den Inhalt löschen und leer lassen.

Abb. 1.02 Anwendung Komponenten Positionierung

4.5 TButton: Button

Wir können nun durch das Label den Nutzer auffordern seinen Namen in das Editfeld einzutragen. Mit einem Button können wir jetzt etwas über ein OnClick Ereignis ausführen. Die Komponente für einen Button heißt TButton oder für einen Bildbutton TBitButton. Nimm als erstes Mal die Komponente TButton unter Standard -> TButton links neben der TLabel Komponente und ziehe den Button unter das Editfeld. Den Name des Button änderst du im Objektinspektor bitte auf BtnName. Das Btn steht als Abkürzung für Button und der Zusatz Name beschreibt, dass die drei Komponenten LBLName, EdtName und BtnButton zusammengehören. Der Button hat nun wieder wie das TLabel eine Caption in der du die Beschriftung festlegen kannst. Trage bei der Caption „Begrüßung ausführen“ ein.

Bevor wir nun weiter machen ziehe bitte ein weiteres Label unter den Button und lege den Namen auf LBLBegruessung fest. Sonderzeichen wie das ß oder das ü können in einer Caption dargestellt werden im Quelltext und in Kommentare um Fehler zu vermeiden nutze bitte keine Sonderzeichen. Als Caption legst du LBLBegruessung fest.

Wir haben nun alle Komponenten erstellt die wir für unser kleines Programm benötigen. Jetzt kommen wir zu der Programmierung. Wähle dafür im Objektinspektor den TButton mit dem Namen BtnName aus und wähle anstelle Eigenschaften die Ereignisse aus. Jetzt kannst auf das OnClick Ereignis auswählen und mit dem Button (…) die Funktion erstellen. Im Quelltext wird nun eine neue Prozedure mit dem Namen prozedure TForm1.BtnNameClick(Sender: TObjekt) dargestellt. Die Prozedure sollte wie folgt aussehen:

...
35: procedure TForm1.BtnNameClick(Sender: TObject);
36: begin
37: LBLBegruessung.caption := 'Hallo ' + EdtName.Text;
38: end;
…

Abb. 1.02 Quellcode Auszug der Prozedure BtnNameClick.

Eine kurze Erklärung zum Quelltext von Zeile 35 bis 38. Zeile 35: Prozedure TForm1.BtnNameCLick(Sender: TObjekt); Eine Prozedure ist ein Textbaustein dessen Quelltext nur beim Aufrufen des Prozedurenamens ausgeführt wird und ein Teil der Objektorientierten Programmierung, mehr musst du im Moment noch nicht dazu wissen. Das TForm1 ist der Ort an dem das Objekt und der Quellcode ausgeführt werden. Das TForm1 ist im Quellcodekopf nochmal aufgeführt und verweist dadurch auf die auszuführende Prozedure. BtnNameClick ist der Name der Prozedure. (Sender: TObjekt) ist der Typ der hier übergeben wird. Was genau Objekte sind müssen hier an dieser Stelle noch nicht wissen. Das begin in der 36 Zeile öffnet den Beginn des auszuführenden Quellcodes, das end; in Zeile 38 schließt diesen wieder. In Zeile 37 weisen wir nun der Bezeichnung des TLabels -> LBLBegruessung den Text des Edit Feldes zu und setzten mit den in Anführungszeichen gesetzten Textes noch ein ‚Hallo ‚ mit Leerzeichen davor.
Um das Programm zu testen nutze den grünen Playbutton im Hauptfenster von Lazarus. Mit dem Stop Button kannst du das Programm stoppen um eventuell nach Fehlern zu suchen. Mit dem Halt Button kannst du das Programm abbrechen. Probiere es jetzt mal aus.
Dir wird auffallen das das Programm während der Ausführung, das Label LBLBegruessung den Namen auch als Caption anzeigt. Für unsere Zwecke und zum Entwicklungszeitpunkt ist das wichtig einen Text zu haben um es zu positionieren und sehen zu können. Zur Laufzeit ist es nicht schön anzusehen. Klicke nun auf das Form1 und gehe auf Ereignisse, scrolle hier solange herunter bis du das Ereignis OnCreate gefunden hast. Klicke es an und erstelle mit dem Button (…) eine neue Prozedure mit dem Namen procedure TForm1.FormCreate(Sender: TObject); Zwischen dem begin und end; gibt du nun folgendes ein LBLBegruessung.caption := ”; dies sagt dem Programm das nach der Erstellung des Programms das die Beschreibung (Caption) LBLBeruessung des Labels leer sein soll. Anbei nochmal der Quelltext der Prozedure.

...
41: procedure TForm1.FormCreate(Sender: TObject);
42: begin
43: LBLBegruessung.caption := '';
44: end;
...

Zum Abschluss nocheinmal ein Bild des Programm bei der Ausführung.

Abb 1.03 Anwendung wird ausgeführt

Software herunterladen: AWEVAAnwendung.7z

Hinweis: Die Software ist mit der kostenlosen Version von 7zip gezippt worden, daher auch die Endung .7z. Unter 7-zip.de kann die Software 7Zip kostenlos heruntergeladen werden und das Programm zu entpacken.