Proporcionar un explorador propio: trabajar con controles TreeView

Actualización: noviembre 2007

Puede diseñar una interfaz de aplicación de modo que funcione como el Explorador de Windows utilizando un control TreeView. En el lado izquierdo de la interfaz puede mostrarse una jerarquía de nodos (similar a un directorio de Windows con bifurcaciones de las carpetas primarias a las carpetas secundarias) y, en el lado derecho, los elementos asociados a dichos nodos. Por ejemplo, puede agregar un control TreeView que muestre un nodo para cada página web del foro de Visual Basic. Cuando el usuario selecciona un nodo, puede hacer que se muestre la página web correspondiente en un control WebBrowser.

Existen tres tipos de nodos: nodos primarios, nodos secundarios y el nodo raíz. El nodo situado en la parte superior de la jerarquía recibe el nombre de nodo raíz. Cualquier nodo que tenga uno o varios nodos directamente debajo de él en la jerarquía se considera un nodo primario. Los nodos que parecen directamente debajo de otro nodo en la jerarquía se consideran nodos secundarios. Al agregar un nodo secundario, el nodo primario se vuelve automáticamente contraíble y expansible.

Inténtelo.

Para crear un explorador

1. En el menú Archivo, haga clic en Nuevo proyecto.

   Aparecerá el cuadro de diálogo Nuevo proyecto.

2. Haga clic en Aplicación de Windows Forms y, a continuación, en Aceptar.

3. Haga clic en el formulario y cambie las propiedades siguientes en la ventana Propiedades.

   Propiedad	Valor
   Text	Explorador del foro
   Size	764, 564

4. Agregue un control TreeView al formulario y, a continuación, cambie las propiedades siguientes en la ventana Propiedades.

   Propiedad	Valor
   Dock	Left
   Size	190, 530

5. Haga clic en la propiedad Nodes y, a continuación, haga clic en el botón de puntos suspensivos (...) situado junto a ella para abrir el Editor TreeNode.

6. Haga clic en Agregar raíz en el Editor TreeNodey, a continuación, cambie la propiedad Text del nodo raíz a Foros de Visual Basic.

7. Haga clic tres veces seguidas en Agregar elemento secundario para agregar tres nodos secundarios al nodo raíz y, a continuación, cambie la propiedad Text de cada nodo, tal y como se muestra en la tabla siguiente.

   Nodo	Valor
   Node1	Visual Basic Express Edition
   Node2	Visual Basic IDE
   Node3	Lenguaje Visual Basic

8. Haga clic en Aceptar.

9. Agregue un control WebBrowser al formulario.

   De forma predeterminada, el control WebBrowser rellena el espacio restante del formulario.

10. Haga doble clic en el control TreeView para escribir el controlador de eventos predeterminado en el Editor de código.

11. Agregue el código siguiente al controlador de eventos TreeView1_AfterSelect. Este código determina el texto del nodo seleccionado y, a continuación, muestra la página web correspondiente en el control WebBrowser.

    Nota:
    En este ejemplo se usa un vínculo de avance, es decir, un vínculo que utiliza un sistema de redirección de direcciones URL y que Microsoft usa para impedir que los vínculos queden obsoletos, pero también puede utilizar la dirección URL de la página web que desee mostrar.

    Select Case e.Node.Text
        Case "Visual Basic Forums"
            WebBrowser1.Navigate("https://go.microsoft.com/" _
                & "fwlink/?LinkID=82999")
        Case "Visual Basic Express Edition"
            WebBrowser1.Navigate("https://go.microsoft.com/" _
                & "fwlink/?LinkID=82994")
        Case "Visual Basic IDE"
            WebBrowser1.Navigate("https://go.microsoft.com/" _
                & "fwlink/?LinkID=82996")
        Case "Visual Basic Language"
            WebBrowser1.Navigate("https://go.microsoft.com/" _
                & "fwlink/?LinkID=82997")
    End Select
    

12. Presione F5 para ejecutar el programa.

    Cuando aparece el formulario, se muestra la página web del foro principal de Visual Basic.

13. Haga clic en el signo más (+) situado junto al nodo raíz y, a continuación, haga clic en los nodos secundarios para ver las páginas web correspondientes.

Pasos siguientes

En esta lección, ha aprendido a utilizar un control TreeView para crear una aplicación que funcione como el Explorador de Windows.

En la sección siguiente, puede conocer otra manera de crear la apariencia visual de una aplicación basada en Windows utilizando Windows Presentation Foundation (WPF). Si desea omitir esta sección, puede ir a la lección ¿Qué salió mal? Encontrar y corregir errores mediante depuración y aprender a utilizar las herramientas de Visual Basic para localizar y corregir los errores de un programa.

Siguiente lección: Crear la apariencia visual de un programa: introducción a Windows Presentation Foundation

Vea también

Referencia

Información general del control TreeView (Formularios Windows Forms)

Otros recursos

Crear la apariencia visual de un programa: introducción a los formularios Windows Forms