Form Tutorial/de

From Lazarus wiki
Jump to: navigation, search

Deutsch (de) English (en)

Zurück zu den Zusätzlichen Informationen.

Eine kleine Einführung, wie man Formulare in Lazarus nutzt.

Was ist ein Formular

Das Formular (engl. Form, Klasse TForm) wird auch im Deutschen öfters (fälschlicherweise) als Form bezeichnet. Es stellt ein Fenster oder ein Dialogfeld dar, welches die Benutzeroberfläche einer Anwendung bildet. Es ist der Container, auf dem alle weiteren Komponenten (z.B. Buttons, Labels, Edit-Felder, Images etc.) eingefügt werden.

Einstieg, die erste GUI-Anwendung

Schon nachdem Sie Lazarus erfolgreich installiert haben, wird nach dem Start von Lazarus ein neues Projekt mit einem leeren Formular Form1 erstellt. Ansonsten können Sie, unter dem Hauptmenueintrag Projekt -> Neues Projekt -> Anwendung, eine neue GUI Anwendung erstellen.

NeuesProjekt.png


NeuesProjekt1.png


Jetzt haben Sie schon ein neues, funktionstüchtiges Projekt mit einem Formular erstellt:

Form1 Designmodus.png


Um das neu erstellte Projekt zu starten, können Sie einfach die Taste [F9] drücken oder mit der Maus auf das Hauptmenu-Symbol Start.png klicken (oder Hauptmenü: Start -> Start). Das Projekt wird nun im Normalfall kompiliert und gestartet.

Es passiert nichts wirklich aufregendes, das Formular Form1 verändert jedoch geringfügig sein Aussehen und wird die Punkte vom Raster-Gitter (Hilfe für Positionierung einzelner Komponenten) verlieren (solange die Gitterpunkte sichtbar sind, wissen Sie auch, dass Sie sich noch im Entwurfsmodus befinden):

Form1 Designmodus.png -> Form1 Runmodus.png


Kehren Sie wieder in den Entwurfsmodus zurück und legen als nächstes ein TButton (Schaltknopf) auf dem Formular ab. Dieser soll später das Öffnen eines zweiten Formulars ermöglichen:

  • Unter der Standard-Komponentenpalette den TButton auswählen

TButtonStandardpalette.png

  • auf das Formular klicken: Es wird ein Button auf Form1 abgelegt mit dem Namen und Bezeichnung (Caption) Button1.


Damit dieser Button auch einen Sinn bekommt, müssen Sie diesem mitteilen, dass er etwas tun soll, wenn auf ihn geklickt wird. Dieses Klicken kann man vereinfacht als ein Ereignis (engl. Event) betrachten. Dafür benötigt man Ereignisbehandlungsroutinen (engl. listener, observer, event handler), die nach dem Klick aufgerufen werden. Der Eventhandler für ein Mausklick kann recht einfach erreicht werden, indem Sie auf den einfügten Button1 doppelklicken (oder im Objektinspektor -> Button1 -> Reiter Ereignisse -> OnClick auf den Button [...] klicken). Es wird nun im Quelltexteditor eine Procedure TForm1.Button1Click erstellt, die immer aufgerufen wird (zur Laufzeit, nicht im Desingnmodus), wenn Button1 geklickt wird:

NeuesProjekt2.png


Damit die Anwendung nach dem Klick von Button1 etwas zu tun bekommt, fügen Sie einfach zwischen begin und end der Procedure TForm1.Button1Click etwas Code, wie

procedure TForm1.Button1Click(Sender: TObject);
begin
  Caption:='Mein erstes Formular';  //Caption von Form1 wird geändert (Text im Formularkopf)
  //oder
  Button1.Caption:='Hallo';         //Caption vom Button1 wird geändert (angezeigter Text des Buttons)
end;

ein. Jetzt können Sie Ihre Anwendung starten (mit Taste [F9]) und sich freuen...


Nachdem Sie nun Ihre erste GUI-Anwendung erstellt haben, können Sie nun ein wenig experimentieren und die Standardkomponenten kennen lernen. Für den Einstieg würde ich Ihnen empfehlen, Beispiele folgender Komponenten auszuprobieren:

hilfreiche Informationen finden Sie auch im Lazarus Tutorial

Verwendung eines zweiten Formulars

Das Tutorial zeigt, wie Sie mehrere Formulare in einem Projekt nutzen können. Im Beispiel werden nur zwei Formulare (Hauptformular Form1 und Form2) erstellt, für weitere Formulare können Sie analog verfahren.

Kongret erstellen Sie eine Hauptformular mit einem Button (Knopf), durch dessen Klicken sich die neues Formular öffnet. Das neue Formular erhält ebenfalls einen Button, durch dessen Klicken sich das neue Formular wieder schließt und Sie zum Hauptformular zurück gelangen.

Wenn Sie das Tutorial Einstieg, die erste GUI-Anwendung durchgearbeitet haben, müssten Sie den Code zwischen begin und end der Procedure TForm1.Button1Click löschen. Ansonsten müssten Sie ein neues Projekt (Anwendung) erstellen, einen Button auf dem Formular ablegen und den OnClick-Eventhandler von diesem Button1 erstellen.
Diesem Button geben Sie noch eine andere Caption (sichtbarer Text auf dem Button). Dazu den Button anwählen (einfach einmal anklicken) und im Objektinspektor unter Eigenschaften -> Caption den Text "Form2 öffnen" eingeben.

Objektinspektor.png


Unter dem Hauptmenupunkt Datei -> neues Formular können Sie nun ein zweites Formular (Form2) dem Projekt hinzufügen. Auf diesem legen Sie ebenfalls einen Button (Button1) ab und erstellen den OnClick-Eventhandler von diesem. Die Caption von diesem Button ändern Sie analog oben zu Schließen.

Jetzt hat das Projekt zwei Formulare, welche jeweils mit dem Hauptmenueintrag Projekt -> Formulare (oder Tastenkombination [Shift]+[F12]) ausgewählt und angezeigt werden können. Hilfsweise können Sie auch im Quelltexteditor den Reiter der jeweiligen zum Formular zugehörigen Unit auswählen und mit [F12] das entsprechende Formular anzeigen (mit [F12] wechselt man zwischen Quelltexteditor und Formular).


Im Quelltexteditor gehen Sie jetzt auf die zu Form1 gehörende Unit (Unit1) und fügen der Uses-Klausel Unit2 hinzu:

uses
  Classes, SysUtils, ... , Unit2;  //wichtig ist dass die einzelnen Units mit einem Komma voneinander getrennt sind 
                                   //und die Uses-Klausel mit einem Semikolon beendet wird

Nun ist Unit2 und damit Form2 von der Unit1 aus aufrufbar.


Als nächstes bearbeiten Sie noch die OnClick-Events der Buttons der jeweiligen Formulare:

unit Unit1;
...
procedure TForm1.Button1Click(Sender: TObject);
begin
  Form2.ShowModal;  //Zeigt Form2 an, der Focus wird auf Form2 gesetzt
end;
unit Unit2;
...
procedure TForm2.Button1Click(Sender: TObject);
begin
  Close;  //Schließt Form2
end;

Jetzt können Sie das Projekt starten und von Form1 mittels Buttonklick Form2 öffnen.

Unterschied zwischen Show und ShowModal

Beide Methoden Show und ShowModal machen ein Formular sichtbar. An einem kleinen Beispiel können Sie erfahren, was der Unterschied dieser ist:

  • Fügen Sie zu dem vorherigen Beispiel Verwendung eines zweiten Formulars der Form1 noch einen zweiten TButton hinzu.
  • Ändern Sie von Button1 die Eigenschaften Name zu btnShow und Caption zu Show.
  • Ändern Sie von Button2 die Eigenschaften Name zu btnShowModal und Caption zu ShowModal.
  • Erstellen Sie (bzw. ändern Sie) die OnClick-Eventhandler der beiden Buttons wie folgt:
procedure TForm1.btnShowClick(Sender: TObject);
begin
  Form2.Show;
  ShowMessage('Form2 wurde geöffnet!');
end;
 
procedure TForm1.btnShowModalClick(Sender: TObject);
begin
  Form2.ShowModal;
  ShowMessage('Form2 wurde geöffnet und schon wieder geschlossen!');
end;
  • Starten und beobachten Sie den Unterschied!


Show:
Diese Procedure macht ein Formular sichtbar und arbeitet den Code des aufrufenden Controls (bei uns Form1) weiter ab. In unserem Beispiel wird die Mitteilung (ShowMessage) fast gleichzeitig zur Form2 angezeigt. Sie können auch weiterhin das aufrufende Formular Form1 nutzen, dieses zum Beispiel verschieben oder den Button Show nochmals klicken (jedoch nicht bei ShowModal).
Sie könnten statt <myForm>.Show; auch <myForm>.Visible:=True; schreiben. Die Procedure Show macht nichts anderes:

procedure TCustomForm.Show;
begin
  Visible := True;
  BringToFront;
end;

Der einzigste Unterschied wäre, falls das Formular von einem anderen überdeckt würde, dieses weiter davor bleiben würde.

ShowModal:
Durch diese Methode wird die Codeverarbeitung des aufrufende Controls (bei uns Form1) unterbrochen und erst weiter abgearbeitet, wenn das neu geöffnete Formular wieder geschlossen wurde. In unserem Beispiel wird die Mitteilung (ShowMessage) erst ausgegeben, wenn das Formular Form2 wieder geschlossen wurde. Das aufrufende Formular Form1 ist wie eingefroren. Sie können es weder verschieben noch Buttons klicken.
ShowModal ist eine Funktion und gibt als Ergebnis einen Integer zurück, siehe TModalResult. Damit können Sie, je nachdem, wie das Formular geschlossen wurde, unterschiedlichen weiteren Code ausführen lassen.

Zwei Formulare, die sich gegenseitig aufrufen können

Generell ist es günstig (gutes Programmdesign), wenn von einem Formular nicht dessen Hauptformular aufgerufen wird. Besser ist es, entsprechend vorherigem Beispiel, von einem Hauptformular aus, immer nachfolgende Formulare aufzurufen und durch das Schließen dieser, wieder zum Hauptformular zurückzukehren. Somit entgeht man dem Problem einer zirkulären Unit - Referenz. Dass es theoretisch trotzdem geht, sehen Sie hier.

Entweder Sie modifizieren die Formulare vom Beispiel Verwendung eines zweiten Formulars oder Sie müssen ein neues Projekt erstellen, mit zwei Formulare und jeweils einem Button (Knopf). Caption von Form1.Button1 sollte Form2 öffnen lauten, die von Form2.Button1 müssten Sie nach Form1 öffnen umändern.

Diesmal können Sie nicht einfach in die vorhandene Uses-Clause von Unit2 (wie im vorherigen Beispiel - im Interfaceteil der Unit) "Unit1" einfügen, da sonst eine zirkuläre Unit-Referenz entstehen würde. "Unit2" müssten Sie somit auch wieder aus der Interface-Uses-Klausel von Unit1 entfernen.

Statt dessen fügen Sie eine Uses-Klausel in den Implementation-Teilen der Units ein:

unit Unit1;
...
implementation
 
uses
  Unit2;  
...
unit Unit2;
...
implementation
 
uses
  Unit1;  
...

Jetzt ändern Sie noch die hinter den OnClick-Events der Buttons befindlichen Eventhandler zu:

unit Unit1;
...
procedure TForm1.Button1Click(Sender: TObject);
begin
  Form2.Show;  //Zeigt Form2
end;
unit Unit2;
...
procedure TForm2.Button1Click(Sender: TObject);
begin
  Form1.Show;  //Zeigt Form1
end;

Übergabe von Variablen in andere Formulare

Entsprechend Beispiel Verwendung eines zweiten Formulars könnte man im Interface-Teil der Unit Unit2 eine globale Variable deklarieren. Damit hätte man Zugriff in der Unit1 und Unit2 auf ein und die selbe Variable (da in der Unit1 unter uses die Unit2 mit einbunden wurde, werden alle im Interface-Teil der Unit2 deklarierten Variablen auch in Unit1 nutzbar). Dieses Vorgehen sollten Sie aber auf ein Minimum beschränken, da man bei größeren Projekten schnell nicht mehr weiss, was die einzelnen Variablen für eine Bedeutung haben bzw. wo man überall darauf zugreift (Fehlerquote erhöht sich).

Besser ist es lokale Variablen zu nutzen, diese als Property in einer Klasse oder hilfsweise als Variable in einer Klasse zu definieren und auf diese zuzugreifen.

Im nachfolgenden Projekt wird per Buttonklick ein zweites Formular geöffnet. Dabei wird in der Unit des Hauptformulars gezählt, wie oft dieses angezeigt wurde. In diesem zweiten Formular können Sie sich per Buttonklick zeigen lassen, wie oft es geöffnet wurde:

  • erstellen Sie ein neues Projekt mit zwei Formularen, jeweils ein Button darauf und die Eventhandler zu deren OnClick-Events
  • nun erstellen Sie im Public-Teil der Klasse TForm2 (Unit2) eine Variable (in diesem Fall eine Konstante, die Sie als definierte Variable missbrauchen) vom Typ Integer mit dem Namen Zaehler:
unit Unit2;
...
  TForm2 = class(TForm)
    Button1: TButton;
    procedure Button1Click(Sender: TObject);
  private
    { private declarations }
  public
    { public declarations }
    const Zaehler: Integer = 0;   //hier Zaehler definieren
  end;
  • jetzt müssen noch die Button-Eventhandler entsprechend anpassen:
unit Unit1;
...
procedure TForm1.Button1Click(Sender: TObject);
begin
  inc(Form2.Zaehler);  //Bei jedem Aufruf von Form2 den Zähler um 1 erhöhen
  Form2.ShowModal;     //Form2 anzeigen
end;
unit Unit2;
...
procedure TForm2.Button1Click(Sender: TObject);
begin
  ShowMessage('Form2 wurde insgesamt '+IntToStr(Zaehler)+' mal aufgerufen');
end;

Auf diese Weise können Sie in Unit1 auf alle in Unit2 öffentlichen (public) Variablen/Properties/Funktionen/Proceduren (allgemein Methoden) zugreifen.

Sonstiges im Umgang mit Formularen

Anderes Formular als HauptFormular verwenden

Stellen Sie nach einer Weile fest, dass Sie lieber ein anderes oder ein neues Formular zur Ansicht beim Programmstart angezeigt haben wollen, können Sie, unter dem Mainmenu Projekt -> Projekteinstellungen -> Formulare, die Reihenfolge der Formulare ändern:

Projekteinstellungen Formulare.png

Alternativ können Sie sich, unter Hauptmenu Projekt -> .lpr-Datei anzeigen, die Projekt.lpr (Pascal-Quelltext des Hauptprogramms) anzeigen lassen und dort das zuerst anzuzeigende Formular als erstes erstellen lassen:

program Project1;
...
  Application.CreateForm(TForm2, Form2);  //Form2 wird als erstes erstellt und damit beim Start der Anwendung gezeigt
  Application.CreateForm(TForm1, Form1);

Eigenschaft eines Formulars bei Programmende speichern

Bei manchen Anwendungen ist es schön, wenn die vom User geänderte Einstellungen bezüglich Position und Größe des Formulars bei Programmende gespeichert werden und bei Programmstart wieder so hergestellt werden. Dafür stellt Ihnen Lazarus von Haus aus eine recht einfache Möglichkeit mittels TXMLPropStorage oder TIniPropStorage zur Verfügung.

Ein einfaches Beispiel soll die Funktionsweise verdeutlichen:

  • neue Anwendung erstellen (Hauptmenu Projekt -> Neues Projekt -> Anwendung)
  • eine TXMLPropStorage Komponente auf das Formular ablegen (Zu finden ist sie auf dem Tab Misc in der Komponentenpalette)

KomponentenpaletteTXMLPropStorage.png

  • im Objektinspektor: XMLPropStorage1 -> FileName auf z.B. "session.xml" setzen
  • im Objektinspektor: Form1 -> SessionProperties bearbeiten (einfach den Button [...] anklicken)
  • nun jeweils die Properties Left;Top;Width;Height von der Komponente Form1 auswählen und den Selected Properties hinzufügen
  • mit OK bestätigen und Projekt starten, das Formular in der Größe verändern und verschieben, beim nächsten Start hat es wieder diese Einstellung

Weitere Informationen unter TXMLPropStorage

Formular dynamisch erzeugen

Von Lazarus designtes Formular dynamisch erstellen

Sie müssen nicht alle Formulare, die während der Laufzeit einer Anwendung möglicherweise aufgerufen werden, immer bei Programmstart erstellen lassen. Manche Entwickler halten generell nichts davon und löschen den, bei Einfügen eines neuen Formulars in ein Projekt automatisch erstellten, Code aus der Projekt.lpr sofort heraus. Sobald Sie z.B. eine Library schreiben wollen, die ein paar GUIs enthält, kommen Sie um die dynamische Erstellung von Formularen nicht herum.

Ein Beispiel:

  • erstellen Sie ein neue Anwendung mit zwei Formularen, fügen Form1 einen TButton hinzu und nehmen in die Uses-Klausel von Unit1, "Unit2" mit auf
  • öffnen Sie die Projekt.lpr (Projekt -> .lpr-Datei anzeigen)
  • löschen Sie die Zeile " Application.CreateForm(TForm2, Form2);"
  • im OnClick-Ereignis von Form1 Button1 müssten Sie folgenden Code einfügen:
procedure TForm1.Button1Click(Sender: TObject);
begin
  Form2:=TForm2.Create(Nil);  //Form2 wird erstellt
  Form2.ShowModal;            //Form2 wird angezeigt
  FreeAndNil(Form2);          //Form2 wieder freigeben  
end;
  • nun können Sie die Anwendung starten

Neues Formular dynamisch erstellen

Folgendes Beispiel soll demonstrieren, wie neue Formulare per Hand, ohne den Formulardesigner, erzeugt werden können.

Mit einem Buttonklick soll sich ein weiteres Formular öffnen, das einen Button enthält, bei dessen Klick eine Warnmeldung erscheint, dass sich das Formular schließen wird und daraufhin das Formular geschlossen wird.

  • erstellen Sie eine neue Anwendung mit einem Formular und einem Button
  • im OnClick-Ereignis von Form1 Button1 müssen Sie folgenden Code einfügen:
procedure TForm1.Button1Click(Sender: TObject);
var
  MyForm: TForm;
  MyButton: TButton;
begin
  MyForm:=TForm.Create(nil);             // Formular erzeugen
  MyForm.SetBounds(100, 100, 220, 150);  // Größe des Formulars
  MyForm.Caption:='Mein dynamisch erstelltes Formular';
 
  MyButton:=TButton.create(MyForm);      // Den Button erstellen, der Owner wird MyForm
  MyButton.Caption:='Schließe meines Formulars';
  MyButton.SetBounds(10, 10, 200, 30);
  MyButton.Parent:=MyForm;               // Festlegen, auf welchem Formular der Button platziert wird
 
  MyButton.OnClick:=@MyButtonClick;      // Wird gleich noch erstellt...
 
  MyForm.ShowModal;                      // MyForm anzeigen
 
  FreeAndNil(MyForm);                    // MyForm (und MyButton) wieder freigeben
end;
Note-icon.png

Hinweis: Wenn eine Komponente mit einem Owner erzeugt wurde (TButton.Create(Owner: TComponent)), gehört sie dem Owner, der dann dafür zuständig ist,
die Komponente freizugeben. Somit wird MyButton bei der Freigabe von MyForm automatisch mit freigegeben.

  • jetzt müssen Sie noch der Eventhandler von MyButtonClick erstellen
  • dazu im private-Abschnitt der Klasse TForm1 folgende Procedure hineinschreiben und [Strg]+[Shift]+[C] (Codevervollständigung) drücken:
  TForm1 = class(TForm)
...
  private
    { private declarations }
    procedure MyButtonClick(Sender: TObject);
  • und folgenden Code dort einfügen:
procedure TForm1.MyButtonClick(Sender: TObject);
begin
  Showmessage('Achtung, mein dynamisch erstelltes Formular wird geschlossen!');
  if Sender is TButton then
    TForm(TButton(Sender).Parent).Close;
end;
  • nun können Sie das Projekt kompilieren und starten

Ein paar Tipps für die manuelle Erzeugung von Bedienelementen

Weitere Informationen



--Michl 15:22, 8 May 2014 (CEST)