TTreeView/es: what changed

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

Old	New		Line
1	1		## Añadir un nuevo elemento mediante código
2	2
3	3		Se puede añadir un nuevo elemento mediante TTreeView.Items.AddChild o bien AddChildObject.
4	4
5	5		## Crear un TreeView que carga elementos solamente cuando se expande
6	6
7	7		Para añadir el símbolo de expansión a un nodo que no contiene subelementos escribimos la siguiente sentencia:
8	8
9	9		``` pascal
10	10		MiNodo.HasChildren := True;
11	11		```
12	12
13	13		Y establecemos un manejador de eventos para el evento OnExpanding. En este evento se debería retornar si se puede o no realizar la expansión y caso de que sea afirmativo se añadirían subelementos al nodo. Si la expansión no puede realizarse entonces desaparece automáticamente el símbolo de expansión incluso si previamente se ha establecido el valor de HasChildren a true.
14	14
15	15		## Un pequeño ejemplo de uso de TTreeview
16	16
17	17		Aquí tenéis un ejemplo rápido e informal - testeado en Lazarus 0.9.26 bajo Windows:
18	18
19	19		Crear una nueva aplicación. En Form1 añadir un treeview vacío, un button1 con caption "Añadir hijo" y un button2 con caption "Borrar"
20	20
21	21		Para los buttons' con su evento OnClick, asignar el siguiente código, compilar y ejecutar.
22	22
23	23		Código:
24	24
25	25		``` pascal
26	26
27	27		procedure TForm1.Button1Click(Sender: TObject);
28	28		var
29	29		i: integer;
30	30		s: string;
31	31		begin
32	32		// si no hay nodos, crear un nodo raíz con un padre establecido al valor Nil
33	33		if TreeView1.Items.Count = 0 then
34	34		begin
35	35		Treeview1.Items.Add (nil,'Nodo Raíz');
36	36		exit;
37	37		end;
38	38
39	39		// Establer un texto simple para cada nuevo nodo: Nodo1 , Nodo2, etc
40	40		i := treeview1.Items.Count; // Nos retorna la cuenta total de elementos.
41	41		s := 'Nodo ' + inttostr(i); // Crea la cadena de texto 'Node ' más el número resultante de conversión de entero su
42	42		// equivalente en texto.
43	43		// Añade un nuevo nodo al nodo actualmente seleccionado.
44	44		if TreeView1.Selected <> nil then // Si tenemos seleccionado un nodo entonces hacer lo siguiente.
45	45		Treeview1.Items.AddChild(Treeview1.Selected ,s); // Añadir un elemento como hijo al actualmente seleccionado.
46	46		end;
47	47
48	48		procedure TForm1.Button2Click(Sender: TObject);
49	49
50	50		// Un procedimiento para borrar nodos recursivamente.
51	51		Procedure DeleteNode(Nodo:TTreeNode);
52	52		begin
53	53		while Nodo.HasChildren do DeleteNode(Nodo.GetLastChild); { mientras el nodo tenga hijos realizar borrado último nodo hijo }
54	54		TreeView1.Items.Delete(Nodo) ; { borra nodo que ya no contiene nodos hijo }
55	55		end;
56	56
57	57		begin
58	58		if TreeView1.Selected = nil then exit; // salir del borrado caso de que no tengamos seleccionado un nodo }
59	59		// Si el nodo seleccionado tiene nodos hijo, primero preguntar por confirmación
60	60		If treeview1.Selected.HasChildren then
61	61		if messagedlg('¿Borrar nodo seleccionado y todos sus nodos hijo?',mtConfirmation,
62	62		[mbYes,mbNo],0) <> mrYes then exit; // Muestra mensaje de confirmación de borrado (pulsadores Si/No), caso de que
63	63		// la contestación sea diferente de Si, entonces sale del if sin borrar nodo.
64	64		DeleteNode(TreeView1.Selected); // Borra el nodo actualmente seleccionado.
65	65		end;
66	66		```
67	67
68	68		Cuando se ejecuta, el treeview está vacío,. Si se hace click en "Añadir hijo", se crea un nodo raíz. Después de esto se crea un nodo hijo en el nodo que tengamos seleccionado haciendo click en el pulsador "Añadir hijo".
69	69
70	70		El pulsador Borrar lo que hace es borrar el nodo actualmente seleccionado. Si no tiene nodos hijo lo borrara inmediatamente, pero si los tiene preguntará primero para confirmar su borrado.
71	71
72	72		## Liberando los datos del TreeNode
73	73
74	74		Utilizar el evento OnDeletion de Treeview para liberar el objeto creado:
75	75
76	76		``` pascal
77	77
78	78		procedure TForm1.TreeView1Deletion(Sender: TObject; Node: TTreeNode);
79	79		begin
80	80		TMyObject(Node.Data).Free; // Libera los recursos asignados al objeto (así dejamos memoria libre para otros objetos).
81	81		end;
82	82		```
83	83
84	84		## Utilizando Drag y Drop (arrastrar y soltar) en un TreeView
85	85
86	86		Si se quiere permitir la función de arrastrar y soltar en un treeview se necesita lo siguiente:
87	87
88	88		1. Establecer la propiedad "Drag Mode" de treeview al valor DmAutomatic.
89	89		2. Crear un evento del tipo "OndragOver" (solapa de eventos en el inspector de objetos):
90	90
91	91		``` pascal
92	92		procedure TForm1.TreeView1DragOver(Sender, Source: TObject; X, Y: Integer; State: TDragState; var Accept: Boolean);
93	93		begin
94	94		Accept := true;
95	95		end;
96	96		```
97	97
98	98		Espero que esta información sea de ayuda. Adicionalmente podéis cargar el proyecto de ejemplo que acompaña a Lazarus (tv_add_remove.lpi) o bien ver el tutorial que se encuentra en <http://users.iafrica.com/d/da/dart/Delphi/TTreeView/TreeView.html>
99	99
100	100		## Personalizando un TreeView
101	101
102	102		Añado esta sección debido a una consulta en el foro sobre como cambiar el color del texto en un TreeView [1](http://forum.lazarus.freepascal.org/index.php/topic,30095.msg191058/topicseen.html#new).
103	103
104	104		La respuesta del usuario GetMem es que se debe establecer el valor tvoThemedDraw a False, ya que por defecto vale True.
105	105
106	106		En el Inspector de Objetos para TreeView dentro de las opciones disponibles lo encontramos en:
107	107
108		-	~~<img src="treeviewoptions.png" title="treeviewoptions.png" width="450" />~~
	108	+	![](/wiki-images/7/7e/Treeviewoptions.png)
109	109
110	110		Aquí el resto de valores para las opciones que aparecen son los establecidos por defecto para un TreeView.
111	111
112	112		De esta forma nos permite personalizar más el color de la fuente que de otra manera estando tvoThemedDraw establecido al valor true utiliza por defecto el color (y la fuente) que tenga el tema visual de escritorio en uso (la otra posibilidad es deshabilitar el tema).
113	113
114	114		Esto se aplica a todos los nodos del TreeView, pero en caso de necesitar aplicar diferentes colores a los nodos el ejemplo que nos pone el usuario molly es:
115	115
116	116		``` pascal
117	117
118	118		// En tiempo de creación del formulario establecemos tvoThemedDraw a false
119	119		// y llenamos el TreeView con 10 elementos: item 1,item 2,....,item 10 (el índice comienza por 0 para item 1).
120	120
121	121		procedure TForm1.FormCreate(Sender: TObject);
122	122
123	123		var i:integer;
124	124
125	125		begin
126	126
127	127		TreeView1.Options := TreeView1.Options - [tvoThemedDraw];
128	128
129	129		For i := 1 to 10 do TreeView1.Items.Add(nil, 'item ' + IntToStr(i));
130	130
131	131		end;
132	132		```
133	133
134	134		Y asignamos al evento OnDrawItemEvent:
135	135
136	136		``` pascal
137	137
138	138		// En nuestro TreeView personalizado, chequeamos si su índice de nodo es par o impar.
139	139		// y cambia el color de texto a rojo si es impar (odd) o a verde en caso contrario.
140	140
141	141		procedure TForm1.TreeView1CustomDrawItem(Sender: TCustomTreeView;
142	142
143	143		Node: TTreeNode; State: TCustomDrawState; var DefaultDraw: Boolean);
144	144
145	145		begin
146	146
147	147		with Sender as TCustomTreeView do
148	148
149	149		if odd(Node.Index)
150	150
151	151		then Canvas.Font.Color:= clRed
152	152
153	153		else Canvas.Font.Color:= clGreen;
154	154
155	155		end;
156	156		```
157	157
158	158		Siendo el resultado:
159	159
160		-	~~<img src="customtreeview.png" title="customtreeview.png" width="350" />~~
	160	+	![](/wiki-images/c/c5/Customtreeview.png)
161	161
162	162		---
163	163		From the Free Pascal wiki, page "TTreeView/es", as it stood on 2020-03-02 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).
164	164		Category: Components/es
165	165		Category: Tutorials/es

Back to history