Zeichnen in Bitmaps mit der Graphics-Klasse

1/2022, 2022, VB-Grundlagen

Lies in den Artikel rein und unten bekommst Du ein unschlagbares Angebot!

Im Artikel “Bitmaps programmieren mit VB.NET” haben wir gezeigt, wie Sie mit VB.NET Bitmaps erzeugen und die einzelnen Pixel mit Farben füllen beziehungsweise die enthaltenen Farben auslesen. Im vorliegenden Artikel gehen wir einen Schritt weiter: Wir nutzen eine Klasse namens Graphics, um in einem Bitmap zu zeichnen. Dabei zeigen wir die Techniken zum Erstellen der grundlegenden Formen und liefern Know-how, wie Sie Füllungen und Schraffuren hinzufügen. Schließlich speichern wir die erzeugten Bitmaps im Dateisystem und zeigen diese in der jeweiligen Standardapp für die entsprechende Dateiendung an.

Vorbereitung: LINQPad

Genau wie im oben genannten Artikel Bitmaps programmieren mit VB.NET (www.datenbankentwickler.net/297) verwenden wir auch in diesem Artikel LINQPad als Spielwiese zum Ausprobieren der Beispiele. Hier brauchen wir zum Testen einiger Zeilen Code nicht extra ein VB-Projekt anzulegen und dieses jedes Mal neu zu starten, um die Funktionsweise zu prüfen. Wir geben die gewünschten Zeilen einfach in eine Methode ein und starten diese mit F5 – ganz wie es beispielsweise im VBA-Editor möglich ist. Wie Sie LINQPad nutzen, lesen Sie im Artikel LINQPad: LINQ, C# und VB einfach ausprobieren (www.datenbankentwickler.net/100).

Für unser aktuelles Beispiel benötigen wir lediglich eine neue LINQPad-Query mit dem Wert VB Program im Auswahlfeld Language. Damit wir die Elemente des Namespaces System.Drawing verwenden können, fügen wir diesen zu der Query hinzu. Dazu klicken Sie mit der rechten Maustaste auf den Registerreiter der Query und wählen den Eintrag Query Properties… aus. Hier wechseln Sie zur Registerseite Additional Namespace Imports und geben den Namespace System.Drawing einfach ein – ohne Imports-Anweisung, wie es direkt in Modulen nötig wäre (siehe Bild 1). Anschließend schließen Sie den Dialog mit der OK-Schaltfläche wieder.

Hinzufügen eines Verweises auf den Namespace System.Drawing

Bild 1: Hinzufügen eines Verweises auf den Namespace System.Drawing

Auch in diesem Artikel wollen wir die erzeugten Bilder in einem Verzeichnis speichern, wo wir diese schnell wiederfinden. Den Namen dieses Verzeichnisses hinterlegen wir in einer Konstanten, die wir oben im Code wie folgt definieren:

Const strPath As String = "C:\...\BitmapTest\"

Zeichnen mit Graphics

Während Sie in Objekten der Bitmap-Klasse mit der Methode SetPixel nur die Farbe für einzelne Pixel festlegen können, bietet die Graphics-Klasse einige weitere Möglichkeiten. Die Graphics-Klasse stellt Methoden wie DrawLine zum Zeichnen von Linien oder DrawString zum Einfügen von Texten zur Verfügung.

Dabei referenziert das Objekt auf Basis der Graphics-Klasse zunächst das Element, dem beispielsweise Linien oder Texte hinzugefügt werden sollen. Um die im oben genannten Artikel vorgestellte Bitmap-Klasse direkt einzubinden, nutzen wir die dort erzeugten Bitmaps quasi als Zeichenblatt. Das Graphics-Objekt füllen wir dabei mit der From-Image-Methode mit dem Bitmap-Element.

Dim bmp As New Bitmap(480, 320)
Dim objGraphics As Graphics
objGraphics = Graphics.FromImage(bmp)

Danach können wir die nachfolgenden Methoden nutzen, um dem Bitmap-Objekt über die Graphics-Klasse Elemente hinzuzufügen:

  • DrawArc: Zeichnet einen Bogen.
  • DrawBezier: Zeichnet eine Bézier-Kurve.
  • DrawBeziers: Zeichnet mehrere Bézier-Kurven.
  • DrawClosedCurve: Zeichnet eine geschlossene Cardinal-Splinekurve.
  • DrawEllipse: Zeichnet eine Ellipse.
  • DrawIcon: Zeichnet das durch das angegebene Icon dargestellte Bild.
  • DrawIconUnstretched: Zeichnet das durch das angegebene Icon dargestellte Bild, ohne das Bild zu skalieren.
  • DrawImage: Zeichnet das angegebene Bild in seiner ursprünglichen physischen Größe.
  • DrawImageUnscaled: Zeichnet das angegebene Bild in seiner ursprünglichen physischen Größe.
  • DrawImageUnscaledAndClipped: Zeichnet das angegebene Bild ohne Skalierung und beschneidet es ggf. auf die Größe des angegebenen Rechtecks.
  • DrawLine: Zeichnet eine Linie.
  • DrawLines: Zeichnet eine Reihe von Linien.
  • DrawPath: Zeichnet einen grafischen Pfad:
  • DrawPie: Zeichnet eine durch eine Ellipse definierte Kreisform.
  • DrawPolygon: Zeichnet ein Vieleck.
  • DrawRectangle: Zeichnet ein Rechteck.
  • DrawString: Zeichnet die angegebene Textzeichenfolge.

Diese Methoden sehen wir uns in den folgenden Abschnitten im Detail an und stellen dabei weitere benötigte Klassen vor wie beispielsweise solche zur Angabe des zu verwendenden Stiftes.

Eine einfache Linie hinzufügen

Den Start machen wir mit einer einfachen Methode, die eine Linie zu einem Bitmap von 480 x 320 Pixeln hinzufügen soll. Im ersten Beispiel nutzen wir die Überladung der DrawLine-Methode, welche mit dem ersten Parameter ein Pen-Objekt entgegennimmt und mit den übrigen vieren die Koordinaten des Startpunkts und des Endpunkts der zu zeichnenden Linie. Da die Koordinaten 0-basiert sind, soll unsere diagonale Linie vom Punkt 0,0 zum Punkt 479, 319 verlaufen:

Sub EinfacheLinie
     Dim strFilename As String = "EinfacheLinie.bmp"
     Dim bmp As New Bitmap(480, 320)
     Dim objGraphics As Graphics
     Dim objPen As New Pen(color.Black)
     objGraphics = Graphics.FromImage(bmp)
     objGraphics.DrawLine(objPen, 0,0,479,319)
     bmp.Save(strPath & strFilename)
     Process.Start(strPath & strFilename)
End Sub

Hier definieren wir außerdem ein Pen-Element, bei dessen Initialisierung wir eine Überladung verwenden, welche nur die Farbe des zu verwendenden Stiftes entgegennimmt – hier Color.Black. Das mit objPen referenzierte Pen-Element übergeben wir als ersten Parameter der DrawLine-Methode. Anschließend speichern wir das Bitmap-Objekt und zeigen es in der entsprechenden Anwendung an – hier in Paint. Das Ergebnis sehen sie in Bild 2.

Eine mit der DrawLine-Methode erstellte Linie.

Bild 2: Eine mit der DrawLine-Methode erstellte Linie.

Einfache Linie mit Point-Elementen als Parameter

Gegebenenfalls liegen Ihnen der Start- und der Endpunkt der Linie als Koordinaten bereits vor und Sie möchten diese in Form von Point-Objekten erfassen. Dazu erstellen Sie wie folgt zwei neue Point-Objekte, und zwar vor dem Aufruf der DrawLine-Methode:

Dim objStartPoint As New Point(0,0)
Dim objEndpoint As New Point(479,319)

In der DrawLine-Methode geben Sie die Punkte aus objStartpoint und objEndpoint dann als zweiten und dritten Parameter an:

objGraphics.DrawLine(objPen, objStartPoint, objEndpoint)

Den Stift mit der Pen-Klasse anpassen

Die oben gezeichnete Linie ist eine schwarze, durchgezogene Linie mit einer Breite von einem Pixel. Die Farbe Schwarz haben wir beim Erstellen des Pen-Elements als Parameter angegeben, die übrigen Eigenschaften werden standardmäßig eingestellt:

Dim objPen As New Pen(Color.Black)

Die Breite können Sie mit dem zweiten Parameter einer weiteren Überladung des Konstruktors der Pen-Klasse angeben, hier zum Beispiel für eine Linie mit einer Breite von drei Pixeln:

Dim objPen As New Pen(Color.Black, 3)

Später schauen wir uns weitere Möglichkeiten der Pen-Klasse an.

Einen Linienzug zeichnen

Die Methode DrawLines erlaubt das Zeichnen mehrerer zusammenhängender Linien gleichzeitig, wobei Sie die Koordinaten der Start- und Endpunkte als Point-Elemente jeweils mit einem Array übergeben. Im folgenden Beispiel erstellen wir wieder ein Bitmap mit 480 x 320 Pixeln und referenzieren dieses mit dem Graphics-Element. Dann erstellen wir das Array der Punkte, wobei die Punkte jeweils als neue Point-Elemente angeben. Danach rufen wir die DrawLines-Methode auf und übergeben dieser als zweiten Parameter das Array aus obj-Points (siehe Methode EinfacherLinienzug in der Beispieldatei):

 

Schreibe einen Kommentar