BGRABitmap tutorial 12/de

Dieses Tutorial zeigt, wie Sie Textfunktionen einsetzen können.

Erzeugen Sie ein neues Projekt

Erzeugen Sie ein neues Projekt und fügen Sie eine Referenz auf BGRABitmap hinzu, genau so wie im ersten Tutorial.

Einfacher Text

So zeichnen Sie einen einfachen Text:

procedure TForm1.FormPaint(Sender: TObject);
var
  image: TBGRABitmap;
  c: TBGRAPixel;
begin
  image := TBGRABitmap.Create(ClientWidth,ClientHeight, ColorToBGRA(ColorToRGB(clBtnFace)) );
  c := ColorToBGRA(ColorToRGB(clBtnText)); //retrieve default text color

  image.FontHeight := 30;
  image.FontAntialias := true;
  image.FontStyle := [fsBold];
  image.TextOut(5,5,'Hello world',c);
  image.SetPixel(5,5,c);

  image.Draw(Canvas,0,0,True);
  image.free;
end;

Hier ist die Schriftgröße auf 30 Pixels eingestellt, mit Antialiasing. Die Verwendung des Font-Antialiasing ist langsamer, aber schöner.

Die obere, linke Ecke des Textes liegt bei (5,5). Dieser Ursprung wird mittels 'SetPixel' angezeigt.

<figure> <img src="BGRATutorial12a.png" title="BGRATutorial12a.png" /> <figcaption>BGRATutorial12a.png</figcaption> </figure>

Verwenden von Textausrichtungen

Ersetzen Sie einfach die Zeilen mit 'TextOut' und 'SetPixel' durch:

  image.TextOut(ClientWidth-5,5,'Hello world',c,taRightJustify);   
  image.SetPixel(ClientWidth-5,5,c);

Jetzt ist der Ursprung an der rechten Seite des Formulars und der Text ist rechtbündig ausgerichtet.

<figure> <img src="BGRATutorial12b.png" title="BGRATutorial12b.png" /> <figcaption>BGRATutorial12b.png</figcaption> </figure>

Rotated text

Ebenso einfach ist es, gedrehten Text zu zeichnen. Dazu nehmen Sie 'TextOutAngle' oder legen Sie die Eigenschaft 'FontOrientation' fest:

  image.TextOutAngle(30,5,-450,'Hello world',c, taLeftJustify);
  image.SetPixel(30,5,c);

Der Winkel wird in Zehntelgraden angegeben; ein positiver Wert bedeutet 'im Gegenzeigersinn'.

<figure> <img src="BGRATutorial12c.png" title="BGRATutorial12c.png" /> <figcaption>BGRATutorial12c.png</figcaption> </figure>

Beachten Sie wo der Textursprung liegt (das hinzugefügte Pixel).

Zeilenumbruch eines Textes

Dazu gibt es eine einfach verwendbare Version von 'TextRect':

  image.TextRect(rect(5,5,ClientWidth-5,ClientHeight-5),'This is a text that should be word wrapped',taCenter,tlCenter,c);
  image.Rectangle(rect(5,5,ClientWidth-5,ClientHeight-5),c,dmSet);

Die Parameter sind:

• das umgebende Rechteck
• der Text
• die horizontale Ausrichtung
• die vertikale Ausrichtung
• die Farbe

<figure> <img src="BGRATutorial12d.png" title="BGRATutorial12d.png" /> <figcaption>BGRATutorial12d.png</figcaption> </figure>

Text mit Schatten

Sie erzielen einen Textschatten mit dem Blur-Effekt (=Weichzeichner):

var
  image,txt: TBGRABitmap;
  grad: TBGRAGradientScanner;
  c: TBGRAPixel;
begin
  image := TBGRABitmap.Create(ClientWidth,ClientHeight, ColorToBGRA(ColorToRGB(clBtnFace)) );
  c := ColorToBGRA(ColorToRGB(clBtnText));

  txt := TextShadow(ClientWidth,ClientHeight,'Hello world',30,c,BGRABlack,5,5,5);
  image.PutImage(0,0,txt,dmDrawWithTransparency);
  txt.Free;

  image.Draw(Canvas,0,0,True);
  image.free;
end;

Die Prozedur TextShadow erzeugt eine Bitmap, die den Text mit dem Schatten enthält. Die Parameter sind:

• die Größe der Bitmap
• der Text
• die Schrifthöhe
• die Schriftfarbe
• die Schattenfarbe
• der Versatz des Schattens und die Größe des Blur

Vergessen Sie nicht, die Bitmap nach der Verwendung wieder freizugeben.

<figure> <img src="BGRATutorial12e.png" title="BGRATutorial12e.png" /> <figcaption>BGRATutorial12e.png</figcaption> </figure>

Text mit Gradienten

Wie bei den übrigen Zeichenfunktionen, können Sie einen Gradienten oder eine Textur zum Füllen des Textes angeben. Hier ist ein Beispiel:

uses BGRAGradientScanner;

var
  image: TBGRABitmap;
  grad: TBGRAGradientScanner;
begin
  image := TBGRABitmap.Create(ClientWidth,ClientHeight, ColorToBGRA(ColorToRGB(clBtnFace)) );

  grad := TBGRAGradientScanner.Create(BGRA(255,255,0),BGRA(255,0,0),gtLinear,PointF(0,0),PointF(0,35),True,True);
  image.FontHeight := 30;
  image.FontAntialias := true;
  image.FontStyle := [fsBold];
  image.TextOut(6,6,'Hello world',BGRABlack);  //zeichne einen schwarzen Rahmen
  image.TextOut(5,5,'Hello world',grad);       //zeichne den Text mit Farbverlauf 
  grad.free;

  image.Draw(Canvas,0,0,True);
  image.free;
end;

Zuerst wird ein horizontaler Sinusgradient erzeugt (in den Farben gelb und rot). Diesen verwenden wir dann als Textur.

<figure> <img src="BGRATutorial12f.png" title="BGRATutorial12f.png" /> <figcaption>BGRATutorial12f.png</figcaption> </figure>

Voriges Tutorial (Kombinieren von Transformationen) | Nächstes Tutorial (Koordinatensystem)

From the Free Pascal wiki, page "BGRABitmap tutorial 12/de", as it stood on 2022-10-23 after a change by VamLykTan, out of the wiki's dump of 2024-05-26. Copyright stays with the author who wrote it, according to the old wiki's Licensing page. If you have concerns about this material, message the admin.