BGRABitmap tutorial 7/es: what changed

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

Old	New		Line
1	1		Esta tutoría muestra como usar splines.
2	2
3	3		### Crear un nuevo proyecto
4	4
5	5		Crea un nuevo proyecto y añade referencia a [[BGRABitmap]], de la misma forma que en [[BGRABitmap tutorial/es\|la primer tutoría]].
6	6
7	7		### Dibuja una spline abierta
8	8
9	9		Con el inspector de objetos, añade un manejador OnPaint y escribe :
10	10
11	11		``` pascal
12	12		procedure TForm1.FormPaint(Sender: TObject);
13	13		var
14	14		image: TBGRABitmap;
15	15		pts: array of TPointF;
16	16		storedSpline: array of TPointF;
17	17		c: TBGRAPixel;
18	18
19	19		begin
20	20		image := TBGRABitmap.Create(ClientWidth,ClientHeight,ColorToBGRA(ColorToRGB(clBtnFace)));
21	21		c := ColorToBGRA(ColorToRGB(clWindowText));
22	22
23	23		//rectangular polyline
24	24		setlength(pts,4);
25	25		pts[0] := PointF(50,50);
26	26		pts[1] := PointF(150,50);
27	27		pts[2] := PointF(150,150);
28	28		pts[3] := PointF(50,150);
29	29		image.DrawPolylineAntialias(pts,BGRA(255,0,0,150),1);
30	30
31	31		//compute spline points and draw as a polyline
32	32		storedSpline := image.ComputeOpenedSpline(pts);
33	33		image.DrawPolylineAntialias(storedSpline,c,1);
34	34
35	35		image.Draw(Canvas,0,0,True);
36	36		image.free;
37	37		end;
38	38		```
39	39
40	40		Hay dos líneas que dibuja spline. La primer línea computa los puntos spline, y la segunda los dibuja. Ten en cuenta que es una función específica para splines abiertas.
41	41
42	42		### Dibuja una spline cerrada
43	43
44	44		Antes de image.Draw, agrega estas líneas :
45	45
46	46		``` pascal
47	47		for i := 0 to 3 do
48	48		pts[i].x += 200;
49	49		image.DrawPolylineAntialias(pts,BGRA(255,0,0,150),1);
50	50
51	51		storedSpline := image.ComputeClosedSpline(pts);
52	52		image.DrawPolygonAntialias(storedSpline,c,1);
53	53		```
54	54
55	55		Ve con el cursor en el identificador 'i' y presiona Ctrl-Shift-C para agregar la declaración de la variable. El loop desplaza los puntos hacia la derecha.
56	56
57	57		Dos nuevas lineas dibujan una spline cerrada. Ten en cuenta la función específica que computa splines cerradas y la llamada a DrawPolygonAntialias.
58	58
59	59		Puedes evitar usar una variable para guardar los puntos de la spline como esta :
60	60
61	61		``` pascal
62	62		image.DrawPolygonAntialias(image.ComputeClosedSpline(pts),c,1);
63	63		```
64	64
65	65		De todas formas, si haces eso, no puedes usar los puntos computados mas de una vez, estos deben ser calculados cada vez que los usas.
66	66
67	67		### Ejecuta el programa
68	68
69	69		Esto debería dibujar dos splines, uno abierto a la izquierda y uno cerrado a la derecha.
70	70
71		-	~~<figure>~~
72		-	~~<img src="BGRATutorial7.png" title="BGRATutorial7.png" />~~
73		-	~~<figcaption>BGRATutorial7.png</figcaption>~~
74		-	~~</figure>~~
	71	+	![](/wiki-images/8/84/BGRATutorial7.png)
75	72
76	73		Ten en cuenta que la spline va a través de cada punto. Si quieres que la curva permanezca dentro o definir tangentes, necesitas usar puntos de control, que están displonibles en curvas Bézier.
77	74
78	75		### Usando curvas Bézier
79	76
80	77		Antes de image.Draw, agrega estas líneas :
81	78
82	79		``` pascal
83	80		storedSpline := image.ComputeBezierSpline([BezierCurve(PointF(50,50),PointF(150,50),PointF(150,100)),
84	81		BezierCurve(PointF(150,100),PointF(150,150),PointF(50,150))]);
85	82		image.DrawPolylineAntialias(storedSpline,c,2);
86	83		```
87	84
88	85		La función BezierCurve define una curva con un orígen y un destino, y uno o dos puntos de control. Aquí solo hay un punto de control. Aquí los puntos de control están definidos, entonces la curva es tangente al rectángulo definido antes.
89	86
90	87		Una spline Bézier es simplemente una serie de curvas Bézier. Por lo tanto, la función ComputeBezierSpline concatena un array de curvas Bézier. Aquí construimos una bonita U-girada con dos curvas.
91	88
92	89		### Ejecuta el programa
93	90
94	91		Deberías ver una curva Bézier en negrita dentro del rectángulo izquierdo.
95	92
96		-	~~<figure>~~
97		-	~~<img src="BGRATutorial7b.png" title="BGRATutorial7b.png" />~~
98		-	~~<figcaption>BGRATutorial7b.png</figcaption>~~
99		-	~~</figure>~~
	93	+	![](/wiki-images/a/aa/BGRATutorial7b.png)
100	94
101	95		[[BGRABitmap tutorial 6/es\|Tutoría anterior (estilos de línea)]] \\| [[BGRABitmap tutorial 8/es\|Siguiente tutoría (texturas)]]
102	96
103	97		---
104	98		From the Free Pascal wiki, page "BGRABitmap tutorial 7/es", as it stood on 2020-02-10 after a change by Trev, 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).
105	99		Category: Castellano
106	100		Category: Español

Back to history