Sign in Join
Wiki copytemporary

BGRABitmap tutorial 12/de: what changed

Revision 0 to 1. Removed lines have a minus sign; added lines have a plus sign.

Title: BGRABitmap tutorial 12/de

OldNewLine
1+Dieses Tutorial zeigt, wie Sie Textfunktionen einsetzen können.
2+
3+### Erzeugen Sie ein neues Projekt
4+
5+Erzeugen Sie ein neues Projekt und fügen Sie eine Referenz auf [[BGRABitmap/de|BGRABitmap]] hinzu, genau so wie im [[BGRABitmap tutorial/de|ersten Tutorial]].
6+
7+### Einfacher Text
8+
9+So zeichnen Sie einen einfachen Text:
10+
11+``` pascal
12+procedure TForm1.FormPaint(Sender: TObject);
13+var
14+ image: TBGRABitmap;
15+ c: TBGRAPixel;
16+begin
17+ image := TBGRABitmap.Create(ClientWidth,ClientHeight, ColorToBGRA(ColorToRGB(clBtnFace)) );
18+ c := ColorToBGRA(ColorToRGB(clBtnText)); //retrieve default text color
19+
20+ image.FontHeight := 30;
21+ image.FontAntialias := true;
22+ image.FontStyle := [fsBold];
23+ image.TextOut(5,5,'Hello world',c);
24+ image.SetPixel(5,5,c);
25+
26+ image.Draw(Canvas,0,0,True);
27+ image.free;
28+end;
29+```
30+
31+Hier ist die Schriftgröße auf 30 Pixels eingestellt, mit Antialiasing. Die Verwendung des Font-Antialiasing ist langsamer, aber schöner.
32+
33+Die obere, linke Ecke des Textes liegt bei (5,5). Dieser Ursprung wird mittels 'SetPixel' angezeigt.
34+
35+<figure>
36+<img src="BGRATutorial12a.png" title="BGRATutorial12a.png" />
37+<figcaption>BGRATutorial12a.png</figcaption>
38+</figure>
39+
40+#### Verwenden von Textausrichtungen
41+
42+Ersetzen Sie einfach die Zeilen mit 'TextOut' und 'SetPixel' durch:
43+
44+``` pascal
45+ image.TextOut(ClientWidth-5,5,'Hello world',c,taRightJustify);
46+ image.SetPixel(ClientWidth-5,5,c);
47+```
48+
49+Jetzt ist der Ursprung an der rechten Seite des Formulars und der Text ist rechtbündig ausgerichtet.
50+
51+<figure>
52+<img src="BGRATutorial12b.png" title="BGRATutorial12b.png" />
53+<figcaption>BGRATutorial12b.png</figcaption>
54+</figure>
55+
56+### Rotated text
57+
58+Ebenso einfach ist es, gedrehten Text zu zeichnen. Dazu nehmen Sie 'TextOutAngle' oder legen Sie die Eigenschaft 'FontOrientation' fest:
59+
60+``` pascal
61+ image.TextOutAngle(30,5,-450,'Hello world',c, taLeftJustify);
62+ image.SetPixel(30,5,c);
63+```
64+
65+Der Winkel wird in Zehntelgraden angegeben; ein positiver Wert bedeutet 'im Gegenzeigersinn'.
66+
67+<figure>
68+<img src="BGRATutorial12c.png" title="BGRATutorial12c.png" />
69+<figcaption>BGRATutorial12c.png</figcaption>
70+</figure>
71+
72+Beachten Sie wo der Textursprung liegt (das hinzugefügte Pixel).
73+
74+### Zeilenumbruch eines Textes
75+
76+Dazu gibt es eine einfach verwendbare Version von 'TextRect':
77+
78+``` pascal
79+ image.TextRect(rect(5,5,ClientWidth-5,ClientHeight-5),'This is a text that should be word wrapped',taCenter,tlCenter,c);
80+ image.Rectangle(rect(5,5,ClientWidth-5,ClientHeight-5),c,dmSet);
81+```
82+
83+Die Parameter sind:
84+
85+- das umgebende Rechteck
86+- der Text
87+- die horizontale Ausrichtung
88+- die vertikale Ausrichtung
89+- die Farbe
90+
91+<figure>
92+<img src="BGRATutorial12d.png" title="BGRATutorial12d.png" />
93+<figcaption>BGRATutorial12d.png</figcaption>
94+</figure>
95+
96+### Text mit Schatten
97+
98+Sie erzielen einen Textschatten mit dem Blur-Effekt (=Weichzeichner):
99+
100+``` pascal
101+var
102+ image,txt: TBGRABitmap;
103+ grad: TBGRAGradientScanner;
104+ c: TBGRAPixel;
105+begin
106+ image := TBGRABitmap.Create(ClientWidth,ClientHeight, ColorToBGRA(ColorToRGB(clBtnFace)) );
107+ c := ColorToBGRA(ColorToRGB(clBtnText));
108+
109+ txt := TextShadow(ClientWidth,ClientHeight,'Hello world',30,c,BGRABlack,5,5,5);
110+ image.PutImage(0,0,txt,dmDrawWithTransparency);
111+ txt.Free;
112+
113+ image.Draw(Canvas,0,0,True);
114+ image.free;
115+end;
116+```
117+
118+Die Prozedur TextShadow erzeugt eine Bitmap, die den Text mit dem Schatten enthält. Die Parameter sind:
119+
120+- die Größe der Bitmap
121+- der Text
122+- die Schrifthöhe
123+- die Schriftfarbe
124+- die Schattenfarbe
125+- der Versatz des Schattens und die Größe des Blur
126+
127+Vergessen Sie nicht, die Bitmap nach der Verwendung wieder freizugeben.
128+
129+<figure>
130+<img src="BGRATutorial12e.png" title="BGRATutorial12e.png" />
131+<figcaption>BGRATutorial12e.png</figcaption>
132+</figure>
133+
134+### Text mit Gradienten
135+
136+Wie bei den übrigen Zeichenfunktionen, können Sie einen Gradienten oder eine Textur zum Füllen des Textes angeben. Hier ist ein Beispiel:
137+
138+``` pascal
139+uses BGRAGradientScanner;
140+
141+var
142+ image: TBGRABitmap;
143+ grad: TBGRAGradientScanner;
144+begin
145+ image := TBGRABitmap.Create(ClientWidth,ClientHeight, ColorToBGRA(ColorToRGB(clBtnFace)) );
146+
147+ grad := TBGRAGradientScanner.Create(BGRA(255,255,0),BGRA(255,0,0),gtLinear,PointF(0,0),PointF(0,35),True,True);
148+ image.FontHeight := 30;
149+ image.FontAntialias := true;
150+ image.FontStyle := [fsBold];
151+ image.TextOut(6,6,'Hello world',BGRABlack); //zeichne einen schwarzen Rahmen
152+ image.TextOut(5,5,'Hello world',grad); //zeichne den Text mit Farbverlauf
153+ grad.free;
154+
155+ image.Draw(Canvas,0,0,True);
156+ image.free;
157+end;
158+```
159+
160+Zuerst wird ein horizontaler Sinusgradient erzeugt (in den Farben gelb und rot). Diesen verwenden wir dann als Textur.
161+
162+<figure>
163+<img src="BGRATutorial12f.png" title="BGRATutorial12f.png" />
164+<figcaption>BGRATutorial12f.png</figcaption>
165+</figure>
166+
167+[[BGRABitmap tutorial 11/de|Voriges Tutorial (Kombinieren von Transformationen)]] \| [[BGRABitmap tutorial 13/de|Nächstes Tutorial (Koordinatensystem)]]
168+
169+---
170+*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](/wiki-contact).*

Back to history