miércoles, 8 de julio de 2015

Receta C# No. 5-6: Visualización Estructura de Directorio en un Control TreeView

Índice

0. Introducción
1. Problema
2. Solución
3. Discusión de la Solución
3.1 Clase TreeView
3.2 Rendimiento
4. Práctica: Código C#
5. Descarga de Materiales
6. Conclusiones
7. Glosario
8. Literatura & Enlaces

0. Introducción

A diario usamos aplicaciones que nos permiten reliazar operaciones básicas como guardar o abrir un archivo. Normalmente estas operaciones requieren que exploremos y seleccionemos una ruta de directorio para la apertura o almacenamiento de un archivo, es por ello que nos motivamos a crear una receta C# que nos demuestra cómo podemos hacer esto programáticamente a través de un control visual diseñado para esta tarea. Aquí veremos, entonces, cómo usar la clase TreeView para representar la estructura jerárquica basada en árbol de un directorio. ¡Manos a la obra!

1. Problema

Crear una aplicación con interfaz gráfica de usuario (GUI) para la representación visual eficiente de la estructura arbórea de un directorio.

2. Solución

La solución a este problema es recurrir a la clase TreeView, que no sólo representa un control visual para la exploración de un árbol de directorios sino que además permite el uso de eventos para la carga eficiente de subdirectorios.

3. Discusión de la Solución

3.1 Clase TreeView

La clase TreeView [2] permite la representación de datos que sigan una estructura jerárquica, como es el caso de los directorios en una unidad de almacenamiento. Los elementos de la estructura pueden ser colapsados o expandidos para facilitar su navegación, comparación, visualización, etc.

En Visual Studio 2013 encontramos este control en la caja de herramientas sobre la subcategoría de controles comunes:
Figura 1. Control TreeView en Visual Studio 2013 Ultimate.

3.2 Rendimiento

En las recetas Copiar, Mover, o Eliminar un Directorio o ArchivoCálculo del Tamaño de un Directorio ganamos intuición para reconocer las posibles causas de bajo de desempeño cuando recorremos una jerarquía de directorios; esta práctica, en general, no es aconsejable debido a que nuestras aplicaciones se pueden ver afectadas por un pobre desempeño al cargar los elementos de una estructura como esta en un solo tiempo.

Continuando, el enfoque que utilizan aplicaciones especializadas en la gestión de archivos, como por ejemplo:
  • File Explorer [3] (anteriormente conocido como Windows Explorer), 
  • Directory Opus [4], o 
  • Total Commander [5].
consiste en realizar la carga de directorios a medida que el usuario lo requiere. ¿Cómo alcanzamos este enfoque con la clase TreeView? Esta clase provee el evento BeforeExpand [6] que posibilita la ejecución de un proceso antes de expandir un elemento en la jerarquía de directorios. Además, en [1] nos recomiendan:
"...You can use a placeholder (such as an asterisk or empty TreeNode) in all the directory branches that are not filled in. This allows you to fill in parts of the directory tree as they are displayed."
E inclusive, podemos seguir esta práctica, también sugerida en [1], para implementar este enfoque:
  1. Implementar un método que se encargue de cargar los nodos de un elemento una vez se dispare la acción de expansión sobre ese nodo.
  2. Desde el formulario Windows contenedor del control TreeView implementar el evento Load para cargar el primer nivel de la jerarquía por medio del método desarrollado en el primer paso.
  3. Desde el evento TreeView.BeforeExpand invocar el método desarrollado en el paso 1, pasando como argumento la referencia del nodo a expandir.
En la sección práctica veremos cómo logramos implementar estos tres simples pasos para el diseño eficiente de la carga de la estructura de directorios según el usuario lo demande.

4. Práctica Código C#

En esta receta utilizaremos Visual Studio para la creación de un proyecto de formularios de Windows. En el único formulario integral de la aplicación arrastraremos un control TreeView desde la caja de herramientas.


Cuando hayamos realizado lo anterior, además de establecer la propiedad Dock como Fill, obtendremos en vista diseño la siguiente vista:
Vista diseño del control TreeView
Figura 2. Vista diseño del control TreeView.
[Sugerencia] Deberíamos nombrar los controles que tenemos hasta ahora, así:
  • Formulario (Form): Main (o Principal)
  • TreeView: tvwTreeDirectorio (o tvwArbolDirectorio)
Al objeto tvwTreeDirectorio debemos programar el evento BeforeExpand:
Evento BeforeExpand de TreeView
Figura 3. Evento BeforeExpand de TreeView.
Una vez tengamos todo lo anterior listo pasamos a escribir la siguiente implementación:

Archivo C# Main.cs [Enlace alternativo]:

El método CargarNodo(TreeNode) (líneas 31-42) sigue estos pasos:
  • El método recibe como argumento un objeto TreeNode [8] para representar el nodo con los directorios a cargar en el árbol.
  • Línea 34: Creación de objeto DirectoryInfo [9] con la ruta del directorio.
  • Líneas 36-41: Iteración por cada uno de los directorios del objeto directorio.
    • Línea 38: Nuevo objeto TreeNode con referencia a un directorio de la lista de iteración.
    • Línea 39: Agrega el nodo recién creado al nodo pasado como argumento.
    • Línea 40: Agregación de nodo temporal. Aquí reside la ganancia en rendimiento, pues no estamos cargando toda la información del directorio actual.
Este método es invocado desde Main_Load (línea 60) para crear la vista principal una vez se carga el formulario de la aplicación. Cuando se dispara el evento tvwTreeDirectory_BeforeExpand también se invoca (línea 76) el método CargarNodo para realizar la carga de directorios a media que el usuario expanda directorios.

Para poner a prueba esta aplicación, desde Visual Studio presionamos la tecla F5:
Exploración directorios
Figura 4. Exploración directorios.

5. Descarga de Materiales

Desde el siguiente enlace es posible descargar la solución del proyecto:

6. Conclusiones

Hemos comprendido cómo representar visualmente la estructura de directorios a través del uso del control visual (o componente) TreeView en una aplicación con interfaz gráfica de usuario. Este control facilita la representación de datos con estructura arbórea, como lo son los directorios en un sistema de archivos. Entendimos un enfoque de carga eficiente que nos demuestra la carga por demanda de elementos (directorios) del árbol según el usuario expanda cada nodo. Este enfoque lo utilizan los modernos gestores o administradores de archivos: File Explorer, Directory Opus, Total Commander.


En la próxima receta pasaremos a escribir y leer en archivos usando la clase System.IO.FileStream.

7. Glosario

  • Archivo
  • Directorio
  • Explorardor de archivos
  • Estructura jerárquica
  • GUI
  • Jerarquía
  • Nodo
  • Rendimiento
  • Visual Studio

8. Literatura & Enlaces

[1]: Visual C# 2010 Recipes by Allen Jones and Adam Freeman. Copyright 2010 Allen Jones and Adam Freeman, 978-1-4302-2525-6.
[2]: TreeView Class (System.Windows.Controls) - https://msdn.microsoft.com/en-us/library/system.windows.controls.treeview(v=vs.110).aspx
[3]: File Explorer - Wikipedia, the free encyclopedia - https://en.wikipedia.org/wiki/File_Explorer
[4]: Directory Opus - Wikipedia, the free encyclopedia - https://en.wikipedia.org/wiki/Directory_Opus
[5]: Total Commander - Wikipedia, the free encyclopedia - https://en.wikipedia.org/wiki/Total_Commander
[6]: TreeView.BeforeExpand Event (System.Windows.Forms) - https://msdn.microsoft.com/en-us/library/system.windows.forms.treeview.beforeexpand(v=vs.110).aspx
[7]: Form.Load Event (System.Windows.Forms) -
https://msdn.microsoft.com/en-us/library/system.windows.forms.form.load(v=vs.110).aspx
[8]: TreeNode Class (System.Windows.Forms) - https://msdn.microsoft.com/en-us/library/system.windows.forms.treenode(v=vs.110).aspx
[9]: DirectoryInfo Class (System.IO) - https://msdn.microsoft.com/en-us/library/system.io.directoryinfo.aspx
[10]: Copiar, Mover, o Eliminar un Directorio o Archivo - http://ortizol.blogspot.com/2015/07/receta-csharp-no-5-3-copiar-mover-o-eliminar-un-directorio-o-archivo.html
[11]: Cálculo del Tamaño de un Directorio - http://ortizol.blogspot.com/2015/07/receta-csharp-no-5-4-calculo-del-tamano-de-un-directorio.html


J

No hay comentarios:

Publicar un comentario

Envíe sus comentarios, dudas, sugerencias, críticas. Gracias.