Einführung in die objektbasierte Programmierung mit Delphi Klaus Becker iMedia 2007

Orientierung Der Einstieg in die Programmierung mit Delphi bereitet so mancherlei Schwierigkeiten. Auch einfachste Programme sind zunächst schwer zu durchschauen. Kompliziert ist insbesondere das Zusammenspiel zwischen GUI-Objekten und algorithmischen Elementen. Ziel der folgenden Ausführungen ist es, ein didaktisches Konzept vorzustellen, bei dem von Anfang an objektbasierte Erklärungsmodelle benutzt werden, um das Verständnis der recht komplexen Delphi-Programme zu erleichtern. Diese Vorgehensweise hat zweierlei Vorzüge: Zum wird mit Hilfe der Erklärungsmodelle die "Logik der Programme" vereinfachend dargestellt und somit der Quelltext strukturell geordnet. Zum anderen werden hierdurch bereits wichtige Konzepte der objektorientierten Modellierung und Programmierung für eine später zu erfolgende Vertiefung eingeführt. Letzteres erfordert, dass die Grundideen und die Terminologie der Objektorientierung von Beginn an korrekt und konsistent verwendet werden.

objektbasierte Benutzungsoberflächen Teil 1 "Hallo Welt" - objektbasierte Benutzungsoberflächen

"Hallo Welt"

GUI-Objekte Eine Benutzungsoberfläche wird mit Hilfe von sog. GUI-Objekten aufgebaut. (GUI: Graphical User Interface) GUI-Objekt GUI-Objekt GUI-Objekt GUI-Objekt GUI-Objekt Die Eigenschaften eines Objekts kann man sich mit dem Objektinspektor anzeigen lassen.

Objekt Ein Objekt hat (in der Regel) einen Namen und wird einer Klasse zugeordnet. Die Klasse legt dabei den Typ des Objekts fest. iBaer2: TImage iBaer1: TImage iBaer1: TImage GUI: TGUI bTag: TButton pAnzeige: TPanel bNacht: TButton Im Objektinspektor werden der Name und die zugehörige Klasse des markierten Objekts angezeigt.

Aufbau und Zustand eines Objekts Der Aufbau eines Objekts wird mit Hilfe von Attributen (Eigenschaften) festgelegt. Die Attributwerte legen den aktuellen Objektzustand fest. Klasse Name iBaer1: TImage Name Klasse iBaer1: TImage Visible = False ... Attribut Attributwert Attributwert Attribut

Objektdiagramme Um die Struktur von Objekten zu beschreiben, benutzt man sog. Objektdiagramme. GUI: TGUI Caption = 'Knut ...' Color = clWhite ... iBaer2: TImage iBaer1: TImage Visible = True ... Visible = False ... bTag: TButton bNacht: TButton pHinweis: TPanel Caption = 'Tag' ... Caption = 'Nacht' ... Caption = 'Wer ...' Color = clGreen ... Objektdiagramm

Ein Blick in die Datei „uTagNacht.dfm“ object GUI: TGUI Left = 307 Top = 360 BorderIcons = [biSystemMenu] BorderStyle = bsSingle Caption = 'Knut tut gut' ClientHeight = 410 ClientWidth = 760 Color = clWhite ... PixelsPerInch = 96 TextHeight = 16 object iBaer1: TImage Left = 392 Top = 48 Width = 334 Height = 255 AutoSize = True Picture.Data = { 0A544A504547... ...} Visible = False end object iBaer2: TImage Left = 32 Top = 48 ... Visible = False end object bTag: TButton Caption = 'Tag' TabOrder = 0 OnClick = bTagClick object bNacht: TButton .. object pHinweis: TPanel Left = 280 Top = 320 Width = 201 Height = 41 TabOrder = 2

Objekthierarchie ... object GUI: TGUI Left = 307 Top = 360 BorderIcons = [biSystemMenu] BorderStyle = bsSingle Caption = 'Knut tut gut' ClientHeight = 410 ClientWidth = 760 Color = clWhite ... PixelsPerInch = 96 TextHeight = 16 object iBaer1: TImage Left = 392 Top = 48 Width = 334 Height = 255 AutoSize = True Picture.Data = { 0A544A504547... ...} Visible = False end FGUI: TFGUI iBaer1: TImage iBaer2: TImage bTag: TButton bNacht: TButton pHinweis: TPanel ... „verwaltet“ ... ...

Veränderung von Objektzuständen Attributwerte eines Objekts kann man mit Hilfe von Wertzuweisungen verändern. pHinweis: TPanel Objektzustand vorher Caption = 'Wer ...' Color = clGreen ... pHinweis.Caption := 'Pst, ich schlafe!'; pHinweis.Color := clRed; Wertzuweisungen pHinweis: TPanel Caption = 'Pst ...' Color = clRed ... Objektzustand nachher

Ereignisbasierte Veränderung Ein Ereignis ist eine Zustandsänderung in einem Objekt, die von Interesse ist und daher mit einer Prozedur zur Ereignisverarbeitung verknüpft werden kann. (K. Merkert) Ereignis Mausklick auf den Button mit der Aufschrift "Tag" löst das Ereignis "bTag.onClick" aus Mausklick auf den Button mit der Aufschrift "Nacht" löst das Ereignis "bNacht.onClick" aus Ereignisverarbeitung procedure TGUI.bTagClick(Sender: TObject); begin GUI.Color := clWhite; iBaer1.Visible := false; iBaer2.Visible := true; pHinweis.Caption := 'Wer spielt mit mir?'; pHinweis.Color := clGreen; end; procedure TGUI.bNachtClick(Sender: TObject); begin GUI.Color := clBlack; iBaer1.Visible := true; iBaer2.Visible := false; pHinweis.Caption := 'Pst, ich schlafe!'; pHinweis.Color := clRed; end;

Delphi-Quelltext (uTagNacht.pas) unit uTagNacht; interface uses ... type TGUI = class(TForm) bTag: TButton; bNacht: TButton; iBaer1: TImage; iBaer2: TImage; pHinweis: TPanel; procedure bTagClick(Sender: TObject); procedure bNachtClick(Sender: TObject); private { Private-Deklarationen } public { Public-Deklarationen } end; var GUI: TGUI; Deklaration eines Formulars mit GUI-Objekten

Delphi-Quelltext (uTagNacht.pas) implementation {$R *.DFM} procedure TGUI.bTagClick(Sender: TObject); begin GUI.Color := clWhite; iBaer1.Visible := false; iBaer2.Visible := true; pHinweis.Caption := 'Wer spielt mit mir?'; pHinweis.Color := clGreen; end; procedure TGUI.bNachtClick(Sender: TObject); GUI.Color := clBlack; iBaer1.Visible := true; iBaer2.Visible := false; pHinweis.Caption := 'Pst, ich schlafe!'; pHinweis.Color := clRed; end. Implementierung der Ereignisverarbeitung

- Datenhaltung mit lokalen Variablen Teil 2 Bär auf Wanderschaft - Datenhaltung mit lokalen Variablen

Bär auf Wanderschaft

Bär, komm her! procedure TGUI.bRechtsClick(Sender: TObject); var procedure TGUI.bAktualisierenClick(Sender: TObject); var xposPfleger, yposPfleger: integer; begin // Eingabe: Übernahme der Anzeige xPosPfleger := StrToInt(eXpos.Text); yPosPfleger := StrToInt(eYpos.Text); // Ausgabe: Aktualisierung der Anzeige iPfleger.Left := xPosPfleger; iPfleger.Top := yPosPfleger; end; lokale Variable procedure TGUI.bRechtsClick(Sender: TObject); var xPosBaer, yPosBaer: integer; begin // Eingabe: Übernahme der Anzeige xPosBaer := iBaer.Left; yPosBaer := iBaer.Top; // Verarbeitung: Veränderung der Daten xPosBaer := xPosBaer + 10; // Ausgabe: Aktualisierung der Anzeige iBaer.Left := xPosBaer; pXposWertBaer.Caption := IntToStr(xPosBaer); pYposWertBaer.Caption := IntToStr(yPosBaer); end; lokale Variable

Doppelte Buchführung procedure TGUI.bRechtsClick(Sender: TObject); var xPosBaer, yPosBaer: integer; begin // Eingabe: Übernahme der Anzeige xPosBaer := iBaer.Left; yPosBaer := iBaer.Top; // Verarbeitung: Veränderung der Daten xPosBaer := xPosBaer + 10; // Ausgabe: Aktualisierung der Anzeige iBaer.Left := xPosBaer; pXposWertBaer.Caption := IntToStr(xPosBaer); pYposWertBaer.Caption := IntToStr(yPosBaer); end; yXposwertBaer: TPanel iBaer: TImage pXposwertBaer: TPanel Caption = '218' ... Visible = True Left = 208 Top = 176 ... Caption = '208' ... xPosBaer: 208 yPosBaer: 176 xPosBaer: 218 yPosBaer: 176 iBaer: TImage yXposwertBaer: TPanel Visible = True Left = 218 Top = 176 ... pXposwertBaer: TPanel Caption = '218' ... Caption = '218' ...

EVA-Prinzip Viele Eingabe-Verarbeitung-Ausgabe-Systeme lassen sich mit Hilfe von lokalen Variablen realisieren. yXposwertBaer: TPanel iBaer: TImage pXposwertBaer: TPanel Caption = '218' ... Visible = True Left = 208 Top = 176 ... procedure TGUI.bRechtsClick(Sender: TObject); var xPosBaer, yPosBaer: integer; begin // Eingabe: Übernahme der Anzeige xPosBaer := iBaer.Left; yPosBaer := iBaer.Top; // Verarbeitung: Veränderung der Daten xPosBaer := xPosBaer + 10; // Ausgabe: Aktualisierung der Anzeige iBaer.Left := xPosBaer; pXposWertBaer.Caption := IntToStr(xPosBaer); pYposWertBaer.Caption := IntToStr(yPosBaer); end; Caption = '208' ... xPosBaer: 208 yPosBaer: 176 xPosBaer: 218 yPosBaer: 176 iBaer: TImage yXposwertBaer: TPanel Visible = True Left = 218 Top = 176 ... pXposwertBaer: TPanel Caption = '218' ... Caption = '218' ...

- Datenhaltung mit globalen Variablen Teil 3 Bär auf Wanderschaft - Datenhaltung mit globalen Variablen

Bär, komm her! Schwierigkeit: Die Ereignisverarbeitung zum Ereignis "bVorwaerts.Click" hängt von der momentanen Bewegungsrichtung des Bären ab. Diese Information könnte man aus den GUI-Objekten gewinnen, indem man nachschaut, welches Bild gerade sichtbar ist. Besser und übersichtlicher wird das Programm, wenn man ein internes Datenmodell mit "globalen Variablen" erstellt, auf die jede Ereignisverarbeitungsprozedur zugreifen und die sie verändern kann.

Bär, komm her! ... type TGUI = class(TForm) bRechts: TButton; procedure bRechtsClick(Sender: TObject); procedure FormCreate(Sender: TObject); private { Private-Deklarationen } xpos, ypos: integer; oben, unten, links, rechts: boolean; procedure ausgangslage; procedure vorwaerts; procedure rueckwaerts; procedure rechtsdrehen; procedure linksdrehen; procedure baerZeigen; public { Public-Deklarationen } end; Formular-Attribut als "globale Variable" Formular-Methode als Hilfsprozedur

Trennung: GUI – Datenmodell type TGUI = class(TForm) bRechts: TButton; ... procedure bVorwaertsClick(Sender: TObject); procedure FormCreate(Sender: TObject); private { Private-Deklarationen } xpos, ypos: integer; oben, unten, links, rechts: boolean; procedure ausgangslage; procedure vorwaerts; procedure rueckwaerts; procedure rechtsdrehen; procedure linksdrehen; procedure baerZeigen; public { Public-Deklarationen } end; procedure TGUI.bVorwaertsClick(...); begin // Datenmodell aktualisieren vorwaerts; // Anzeige aktualisieren baerZeigen; end; Datenmodell procedure TGUI.vorwaerts; begin if oben = true then ypos := ypos - 10 else if unten = true then ypos := ypos + 10 else if links = true then xpos := xpos - 10 else if rechts = true then xpos := xpos + 10; end;

Trennung: GUI – Datenmodell Bei komplexeren Systemen ist es günstig, ein von der GUI getrenntes Datenmodell zu entwickeln. type TGUI = class(TForm) bRechts: TButton; ... procedure bVorwaertsClick(Sender: TObject); private { Private-Deklarationen } xpos, ypos: integer; oben, unten, links, rechts: boolean; procedure ausgangslage; procedure vorwaerts; procedure rueckwaerts; procedure rechtsdrehen; procedure linksdrehen; procedure baerZeigen; public { Public-Deklarationen } end; Datenmodell procedure TGUI.vorwaerts; begin if oben = true then ypos := ypos - 10 else if unten = true then ypos := ypos + 10 else if links = true then xpos := xpos - 10 else if rechts = true then xpos := xpos + 10; end;

Zusammenfassung: Programmmuster Teil 4 Zusammenfassung: Programmmuster

Muster 1 GUI-Objekte regeln Anzeige und Kontrolle. GUI: TGUI Caption = 'Knut ...' Color = clWhite ... iBaer2: TImage iBaer1: TImage Visible = True ... Visible = False ... bTag: TButton bNacht: TButton Caption = 'Tag' ... Caption = 'Nacht' ... pHinweis: TPanel Caption = 'Wer ...' Color = clGreen ... procedure TGUI.bTagClick(Sender: TObject); begin GUI.Color := clWhite; iBaer1.Visible := false; iBaer2.Visible := true; pHinweis.Caption := 'Wer spielt mit mir?'; pHinweis.Color := clGreen; end;

Muster 2 EVA - Verarbeitung mit einem temporären Datenmodell yXposwertBaer: TPanel iBaer: TImage pXposwertBaer: TPanel procedure TGUI.bRechtsClick(Sender: TObject); var xPosBaer, yPosBaer: integer; begin // Eingabe: Übernahme der Anzeige xPosBaer := iBaer.Left; yPosBaer := iBaer.Top; // Verarbeitung: Veränderung der Daten xPosBaer := xPosBaer + 10; // Ausgabe: Aktualisierung der Anzeige iBaer.Left := xPosBaer; pXposWertBaer.Caption := IntToStr(xPosBaer); pYposWertBaer.Caption := IntToStr(yPosBaer); end; Caption = '218' ... Visible = True Left = 208 Top = 176 ... Caption = '208' ... xPosBaer: 208 yPosBaer: 176 xPosBaer: 218 yPosBaer: 176 iBaer: TImage yXposwertBaer: TPanel Visible = True Left = 218 Top = 176 ... pXposwertBaer: TPanel Caption = '218' ... Caption = '218' ...

Muster 3 Internes Datenmodell mit "globalen Variablen" Datenmodell type TGUI = class(TForm) bRechts: TButton; ... procedure bVorwaertsClick(Sender: TObject); private { Private-Deklarationen } xpos, ypos: integer; oben, unten, links, rechts: boolean; procedure ausgangslage; procedure vorwaerts; procedure rueckwaerts; procedure rechtsdrehen; procedure linksdrehen; procedure baerZeigen; public { Public-Deklarationen } end; Datenmodell procedure TGUI.vorwaerts; begin if oben = true then ypos := ypos - 10 else if unten = true then ypos := ypos + 10 else if links = true then xpos := xpos - 10 else if rechts = true then xpos := xpos + 10; end;

Muster 4 Eigenständiges Datenmodell mit neuen Objekten Norden Westen TRoboter Norden xPos yPos richtung ... (4,3) erzeugen initialisieren schritt linksDrehen rechtsDrehen markeSetzen markeLoeschen ... Westen Osten Süden