Delphi Grafikprogrammierung Ein Vortrag von Thomas Gtze und

  • Slides: 35
Download presentation
Delphi Grafikprogrammierung Ein Vortrag von Thomas Götze und Karsten Wolf

Delphi Grafikprogrammierung Ein Vortrag von Thomas Götze und Karsten Wolf

Problem: Wie kann ein Bild oder eine reale Situation in den Speicher eines Computers

Problem: Wie kann ein Bild oder eine reale Situation in den Speicher eines Computers abgebildet (digitalisiert) werden? Möglichkeit 1 - Pixelgrafik: Möglichkeit 2 - Vektorgrafik: Aufbau des Bildes (Rasterung) aus Punktobjekten gleicher Größe, sog. Pixel. Aufbau des Bildes aus Grafikobjekten variabler Größe und Form (Vektorisierung). Jedes Pixel hat bestimmte Eigenschaften (Attribute), z. B. x. Position, y-Position oder Farbe, die mit Werten belegt werden. Jedes Objekt kann durch Anweisungen (Prozeduren), z. B. Zeichne Linie im Winkel 45°, 200 Einheiten lang, und Eigenschaften (Attribute), z. B. Linienbreite oder Farbe, beschrieben werden.

Theoretische Grundlagen Das Canvas-Objekt Das Koordinatensystem Linien und Stifte Farben, Muster und Pinsel Grundlegende

Theoretische Grundlagen Das Canvas-Objekt Das Koordinatensystem Linien und Stifte Farben, Muster und Pinsel Grundlegende Zeichenfunktionen Koordinatentransformation

Das Canvas- Objekt Ein zentrales Objekt der Grafikausgabe mit Delphi ist immer eine Zeichenfläche

Das Canvas- Objekt Ein zentrales Objekt der Grafikausgabe mit Delphi ist immer eine Zeichenfläche (Leinwand) der Klasse TCanvas.

Um Grafiken auf dem Bildschirm auszugeben, wird eine Komponente benötigt, welche die Eigenschaft Canvas

Um Grafiken auf dem Bildschirm auszugeben, wird eine Komponente benötigt, welche die Eigenschaft Canvas besitzt, also eine Zeichenfläche. Zu diesen Komponenten gehören die Forms (die späteren Windows-Fenster), die Paintbox, die Image-Komponente und der Drucker. Am einfachsten zu benutzen ist davon die Image. Komponente, weil man sich bei dieser nicht um das Wiederherstellen der Zeichnung kümmern muss, wenn z. B. die Größe des Fensters verändert oder dieses von einem anderen Fenster überlagert wurde. Wir werden sie deshalb fast immer benutzen.

TCanvas stellt Eigenschaften, Ereignisse und Methoden zur Verfügung, die beim Erzeugen von Bildern hilfreich

TCanvas stellt Eigenschaften, Ereignisse und Methoden zur Verfügung, die beim Erzeugen von Bildern hilfreich sind, indem sie: • die Art des verwendeten Pinsels und Stiftes sowie die Schriftart festlegen. • eine Vielzahl von Formen und Linien zeichnen und füllen. • Text ausgeben. • Grafiken zeichnen. • eine Reaktion auf Änderungen am aktuellen Bild ermöglichen.

Einige Delphikomponenten enthalten diese „Leinwand“, auf der gezeichnet werden kann. Am einfachsten zu benutzen

Einige Delphikomponenten enthalten diese „Leinwand“, auf der gezeichnet werden kann. Am einfachsten zu benutzen ist die Image-Komponente (unter zusätzlich).

Im TCanvas-Objekt sind noch folgende Objekte enthalten: Canvas. Pen n Pen. Width Pen. Color

Im TCanvas-Objekt sind noch folgende Objekte enthalten: Canvas. Pen n Pen. Width Pen. Color Pen. Style

Canvas. Brush n n Brush. Color Brush. Style

Canvas. Brush n n Brush. Color Brush. Style

Canvas. Font n n Font. Name Font. Color Font. Style Font. Size Beispiel: Der

Canvas. Font n n Font. Name Font. Color Font. Style Font. Size Beispiel: Der Schrift einer Image-Komponente wird rot zugewiesen. Form 1. Image 1. Canvas. Font. Color: = cl. Red;

Das Koordinatensystem =Form 1. clientwidth 0, 0

Das Koordinatensystem =Form 1. clientwidth 0, 0

0, 0 !!!Positive y-Werte werden nach unten abgetragen!!!!

0, 0 !!!Positive y-Werte werden nach unten abgetragen!!!!

Beispiel: Zentrierung der Image-Komponente innerhalb eines Formulars. Image 1. left: =(Form 1. clientwidth –

Beispiel: Zentrierung der Image-Komponente innerhalb eines Formulars. Image 1. left: =(Form 1. clientwidth – Image 1. width) div 2; Image 1. top: =(Form 1. clientheight – Image 1. Height) div 2

Farben, Muster und Pinsel Windows verwaltet die Farben über das RGB (Rot – Grün

Farben, Muster und Pinsel Windows verwaltet die Farben über das RGB (Rot – Grün – Blau )-Modell. Die Farbe kann u. a. über die Color. Dialog – Komponente auswählen. Delphi besitzt aber auch zahlreiche vordefinierte Farben, welche mit dem Kürzel cl beginnen. cl. Red Rot cl. Black Schwarz cl. Silver Silbergr cl. Green Grün au

Color. Dialog - Colordialog – Komponente aus Register Dialoge wählen. - Aufruf des Dialoges

Color. Dialog - Colordialog – Komponente aus Register Dialoge wählen. - Aufruf des Dialoges zur Laufzeit mit der Execute – Methode. - Color. Dialog 1. Execute; -Den Rückgabewert verwenden: -Image 1. Canvas. Brush. Color: =Colordialog 1. Color;

Füllungen Brush. Style Brush. Color bs. Solid bs. Clear bs. BDiagonal bs. FDiagonal bs.

Füllungen Brush. Style Brush. Color bs. Solid bs. Clear bs. BDiagonal bs. FDiagonal bs. Cross bs. Diag. Cross bs. Horizontal bs. Vertical

Linien und Stifte Eigenschaft Objekt Beschreibung Linienbreite Pen. Width. . . in Pixeln Linientyp

Linien und Stifte Eigenschaft Objekt Beschreibung Linienbreite Pen. Width. . . in Pixeln Linientyp Pen. Style . . . nur wenn Pen. Width =1

Pen. Style ps. Solid ps. Dash ps. Dot ps. Dash. Dot ps. Clear

Pen. Style ps. Solid ps. Dash ps. Dot ps. Dash. Dot ps. Clear

Grundlegende Zeichenfunktionen

Grundlegende Zeichenfunktionen

Punkte werden mit Hilfe der Pixel – Eigenschaft gesetzt. x-> 0, 0 y Canvas.

Punkte werden mit Hilfe der Pixel – Eigenschaft gesetzt. x-> 0, 0 y Canvas. Pixels[x, y]: =farbe; Canvas. Pixels[7, 9]: =cl. Black; Bem. : Farbe kann somit auch gelesen werden: var farbe: TColor; farbe: = Canvas. Pixels[7, 9];

Linie Zuerst wird der Startpunkt mit Move. To festgelegt. Gezeichnet wird von dieser Position

Linie Zuerst wird der Startpunkt mit Move. To festgelegt. Gezeichnet wird von dieser Position mit Line. To, die den Endpunkt bestimmt. Canvas. Move. To(x 1, y 1); Canvas. Line. To(x 2, y 2); x 2, y 2 x 1, y 1 Image 1. Canvas. Move. To(10, 10); Canvas. Line. To(100, 100)

Kreis, Ellipse Es werden die linke obere und die rechte untere Ecke des umrahmenden

Kreis, Ellipse Es werden die linke obere und die rechte untere Ecke des umrahmenden Rechtecks festgelegt. Der Kreis wird als Spezialfall der Ellipse angesehen. Canvas. Ellipse(x 1, y 1, x 2, y 2) x 1, y 1 x 2, y 2 Oder Kreis mit Mittelpunkt x 1, y 1 und Radius r: canvas. ellipse(x 1 -r, y 1 -r, x 1+r, y 1+r)

Rechteck Canvas. Rectangle(x 1, y 1, x 2, y 2) x 1, y 1

Rechteck Canvas. Rectangle(x 1, y 1, x 2, y 2) x 1, y 1 x 2, y 2

abgerundetes Rechteck Die Ecken werden als Ellipsenviertel der Breite x 3 und der Höhe

abgerundetes Rechteck Die Ecken werden als Ellipsenviertel der Breite x 3 und der Höhe y 3 dargestellt. Ist Brush. Stile <>bs. Clear, wird das Rechteck mit dem aktuellen Pinsel gefüllt. Canvas. Round. Rect(x 1, y 1, x 2, y 2, x 3, y 3: Integer; x 1, y 1 y 3 x 2, y 2 canvas. Roundrect(10, 100, 10, 5);

Segment x 3, y 3 x 1, y 1 x 2, y 2 x

Segment x 3, y 3 x 1, y 1 x 2, y 2 x 4, y 4 Die Methode Pie zeichnet ein Segment, das durch eine Ellipse und zwei Linien begrenzt wird. Für Brush. Style<> bs. Clear wird das Segment gefüllt. Canvas. Pie(x 1, y 1, x 2, y 2, x 3, y 3, x 4, y 4); Canvas. Pie(0, 0, 500, 400, 0, 250, 400);

Bogenstück x 1, y 1 x 3, y 3 x 2, y 2 x

Bogenstück x 1, y 1 x 3, y 3 x 2, y 2 x 4, y 4 Die Methode Arc zeichnet nur den Bogen, nicht die Verbindungen zum Ellipsenmittelpunkt. Keine Füllung. Canvas. Arc(x 1, y 1, x 2, y 2, x 3, y 3, x 4, y 4)

Kreisstück x 3, y 3 x 1, y 1 x 2, y 2 x

Kreisstück x 3, y 3 x 1, y 1 x 2, y 2 x 4, y 4 Mit der Chord-Methode wird der Teil des Kreises gezeichnet, der durch eine Sehne abgeteilt ist. Canvas. Chord(x 1, y 1, x 2, y 2, x 3, y 3, x 4, y 4)

Mehrfachlinie x 2, y 2 x 5, y 5 x 1, y 1 x

Mehrfachlinie x 2, y 2 x 5, y 5 x 1, y 1 x 4, y 4 x 3, y 3 Ähnlich zur Linie, werden jedoch mehrere Punkte auf einmal übergeben. Canvas. Polyline([Point(x 1, y 1), Point(x 2, y 2). . . . ]);

N-Eck (Polygon) x 3, y 3 x 2, y 2 x 1, y 1

N-Eck (Polygon) x 3, y 3 x 2, y 2 x 1, y 1 . . . x 4, y 4 Mit der Polygon-Methode kann ein gefülltes n-Eck gezeichnet werden. Canvas. Polygon([Point(x 1, y 1), Point(x 2, y 2). . . ]);

Texte Die Methode Text. Out ist die einfachste Methode, einen Text auf den Bildschirm

Texte Die Methode Text. Out ist die einfachste Methode, einen Text auf den Bildschirm zu bringen. Canvas. Text. Out(x, y, Text); Canvas. Text. Out(100, ‘Wort‘);

Konvertieren der Koordinaten Probleme: ØDer Ursprung des math. Koordinatensystems liegt meist in der Mitte

Konvertieren der Koordinaten Probleme: ØDer Ursprung des math. Koordinatensystems liegt meist in der Mitte des beschriebenen Blattes, auf dem Bildschirm liegt er in der linken oberen Ecke des Canvas. ØDie y-Achse ist beim math. Koord. s. nach oben gerichtet, auf dem Bildschirm aber nach unten. ØDie Längeneinheit ist in m. Ks. durch das Intervall von Null bis Eins gegeben, auf dem Bildschirm beträgt sie ein Pixel.

1 y Canvas x 1 y 1 1 yp y 0 1 x 0:

1 y Canvas x 1 y 1 1 yp y 0 1 x 0: =image 1. width Div 2; y 0: = image 1. Hight Div 2; x 1: = x 0+x 0 div 3; y 1: = y 0 -y 0 div 3; x 0 xp x 1

1 y x 1

1 y x 1

Anwendungsbeispiele Standardfunktionen Funktion

Anwendungsbeispiele Standardfunktionen Funktion

Quellen Programmieren lernen in Borland Delphi 6 Hanser Verlag

Quellen Programmieren lernen in Borland Delphi 6 Hanser Verlag