Mostrando entradas con la etiqueta Telerik. Mostrar todas las entradas
Mostrando entradas con la etiqueta Telerik. Mostrar todas las entradas

domingo, 10 de julio de 2016

Receta C# No. 7-3: Procesamiento de los Controles de un Formulario

Índice

1. Introducción
2. Palabras Clave
3. Problema
4. Solución
5. Discusión de la Solución
5.1 Jerarquía de herencia
5.2 WinForms nativo
5.3 WinForms de Telerik
5.4 WinForms de DevExpress
6. Práctica: Procesamiento Genérico de Controles
7. Conclusiones
8. Literatura & Enlaces

1. Introducción

En una aplicación con interfaz gráfica de usuario puede resultar necesario llevar a cabo el procesamiento genérico de todos los controles que la integran. Esta receta C# presenta una implementación algorítmica recursiva para cambiar el contenido textual de ciertos controles que conforman un formulario de tres clases homólogas: Form, RadForm y XtraForm.

2. Palabras Clave

  • Control
  • DevExpress
  • GUI
  • Interfaz gráfica de usuario
  • Procesamiento genérico
  • Recursividad
  • Telerik
  • WinForms

3. Problema

Cambiar la propiedad Text de controles de entrada de texto y presentación de texto.

4. Solución

El programador puede escribir una implementación recursiva para tratar las propiedades comunes en objetos en una jerarquía de herencia.

5. Discusión de la Solución

5.1 Jerarquía de herencia

Una jerarquía de herencia modelada siguiendo los principios de programación orientada a objetos facilita el procesamiento genérico de funciones -método, propiedades-. Esto ocurre con el modelamiento de los controles de interfaz gráfica de usuario.

En esta receta C# se describe cómo procesar de forma genérica-recursiva controles contenidos en un formulario. La implementación recursiva empieza con el control padre (formulario) y efectúa un recorrido por los controles hijo (anidados) hasta alcanzar el nivel de profundidad final.

5.2 WinForms nativo

Los controles usados de la suite nativa de Microsoft .NET Framework comprende los siguientes:
  • System.Windows.Forms.Button
  • System.Windows.Forms.Label y 
  • System.Windows.Forms.TextBox.
Todos estos controles cuentan con la propiedad Text ("Control.Text Property", 2016) debido a que heredan de la clase padre de controles visuales de interfaz gráfica de usuario.

En la sección práctica se demuestra cómo cambiar esta propiedad para controles de tipo TextBox.

5.3 WinForms de Telerik

De esta suite controles visuales para componer formularios (clase RadForm) con tipos se recurrido a los siguientes:  
  • RadButton
  • RadTextBox, y 
  • RadLabel.
Estos controles también siguen una jerarquía de herencia que facilita hacer un tratamiento genérico de propiedades.

5.4 WinForms de DevExpress

En lo que respecta a DevExpress algunos de los controles para componer una interfaz gráfica de usuario comprende: 
  • SimpleButton
  • TextEdit, y 
  • LabelControl.

6. Práctica: Procesamiento Genérico de Controles

Estas son las implementaciones de esta receta C# en WinForms nativo, Telerik y DevExpress.

6.2 WinForms nativo

El evento personalizado btnProcesarControles_Click(object, EventArgs) (líneas 24-27) invoca al método ProcesarControles() para efectuar el procesamiento genérico y recursivo de los controles que integran la interfaz gráfica de usuario.

Continuando, con el método ProcesarControles(Control) (líneas 33-47) realiza estas operaciones: 
  • Líneas 36-39: Se valida que el control actual de la invocación recursiva se trate de un TextBox. De ser así se cambia el valor de la propiedad común Text a la cadena vacía (línea 38).
  • Líneas 43-46: Por cada control contenido en el objeto Control actual se invoca de forma recursiva al método ProcesarControles().
Este es el resultado de ejecución de esta receta en WinForms nativo: 
Ejecución receta R0703 [WinForms]
Animación 1. Ejecución receta R0703 [WinForms].

6.2 Telerik

El formulario que conforma esta interfaz gráfica hereda de la clase RadForm. Por otra parte, en el método ProcesarControles(Control) se valida que el control actual sea de tipo RadTextBox (líneas 37-40).


Prueba de ejecución receta sobre esta suite: 
Ejecución receta R0703 [Telerik]
Animación 2. Ejecución receta R0703 [Telerik].

6.3 DevExpress

En el método ProcesarControles() (líneas 33-47) se evalúa que el control de tipo de dato Control sea DevExpress.XtraEditors.TextEdit. Cuando el predicado es verdadero se asigna a la propiedad Text el valor de cadena vacía.

Prueba de ejecución: 
Ejecución receta R0703 [DevExpress]
Animación 3. Ejecución receta R0703 [DevExpress].

7. Conclusiones

Se ha comprendido que el procesamiento genérico facilita manipular propiedades de controles visuales. Esta receta demostró que a través de una implementación genérica se puede escribir un algoritmo recursivo para recorrer los controles integrales de la GUI.

La próxima receta C# será una gran oportunidad para rastrear los formularios visibles de una aplicación.

8. Literatura & Enlaces

Jones, A., Freeman (2010). Visual C# 2010 Recipes: A Problem-Solution Approach. United States: Apress.
Control.Text Property (System.Windows.Forms) (2016, julio 10). Recuperado desde: https://msdn.microsoft.com/en-us/library/system.windows.forms.control.text(v=vs.110).aspx


V

sábado, 9 de julio de 2016

Receta C# No. 7-2: Almacenar Datos dentro de un Control

Índice

1. Introducción
2. Palabras Clave
3. Problema
4. Solución
5. Discusión de la Solución
5.1 Propiedad Control.Tag
5.2 WinForms
5.2.1 Clase ListView
5.2.2 Clase ListViewItem
5.3 Telerik
5.3.1 Clase RadListView
5.3.2 Clase RadListDataView
5.4 DevExpress
6. Práctica: Almacenamiento de Datos en un Control
7. Conclusiones
8. Literatura & Enlaces

1. Introducción

Asociar datos a un control es una tarea común en la construcción de una interfaz gráfica de usuario. Con esta receta C# el programador explora los conceptos básicos de la función Tag. Esta propiedad, como se explica en más detalle en la sección práctica, consiste en un mecanismo simple y directo para asociar datos a un control. La sección práctica comprende tres implementaciones distintas: WinForms estándar (.NET), elementos de Telerik y DevExpress.

2. Palabras Clave

  • .NET
  • Control
  • Dato
  • DevExpress
  • Información
  • Telerik

3. Problema

Implementar un mecanismo de almacenamiento de datos en un control.

4. Solución

En la jerarquía de herencia de controles visuales se cuenta con la propiedad Tag para asociar datos a un elemento de este tipo.

5. Solución

5.1 Propiedad Control.Tag

Esta propiedad establece o recupera datos de un control. El tipo de dato de esta propiedad es Object; esto quiere decir que instancia de cualquier tipo de dato puede ser asignada.

En el diseñador de Visual Studio esta propiedad se encuentra en la ventana Properties (Propiedades): 
Propiedad Tag en la ventana Properties
Figura 1. Propiedad Tag en la ventana Properties.

5.2 WinForms

5.3.1 Clase ListView

Un objeto de esta clase representa un control de tipo lista para presentar información de objetos en diferentes vistas ("ListView Class", 2016)
  • LargeIcon
  • SmallIcon
  • List
  • Tile

5.3.2 Clase ListViewItem

Este tipo de control representa un elemento integral de ListView ("ListViewItem", 2016). Cuenta, al igual que ListView, con la propiedad Tag.

5.3 Telerik

Estos son los controles sobresalientes usados de esta suite en esta receta.

5.3.1 Clase RadListView

Control que sirve de contenedor de elementos visuales. Es una implementación análoga a System.Windows.Forms.ListView en Telerik.

5.3.2 Clase ListViewDataItem

Esta clase representa un control para la representación de datos en un contenedor del tipo RadListView ("ListViewDataItem Class", 2016).

5.4 DevExpress

[Nota: La implementación en DevExpress utiliza los mismos elementos de programa que se usaron en WinForms.]

6. Práctica: Almacenamiento de Datos en un Control

Estas son las implementaciones de ejemplo bajo WinForms, Telerik y DevExpress.

WinForms

Archivo C# R0702.cs [Enlace alternativo][Enlace alternativo]: 
En las líneas 21-42 se declara el evento OnLoad(EventArgs) en el cual ocurren las siguientes operaciones: 
  • Línea 25: Asegura que la invocación del evento sea correcta.
  • Línea 28: Objeto DirectoryInfo con la información del directorio raíz C:\.
  • Líneas 33-40:
    • Línea 40: Asignación del objeto FileInfo a la propiedad Tag del objeto ListViewItem.
El método lvwContenedorArchivos(object, EventArgs) (líneas 50-57) responde a los eventos de activación de un elemento de la lista ListView.


Esta es una captura de pantalla de la aplicación WinForms en funcionamiento: 
Ejecución receta R0702 [WinForms]
Figura 2. Ejecución receta R0702 [WinForms].

Telerik: 

Archivo C# R0702.cs [Enlace alternativo][Enlace alternativo]: 
En el método OnLoad() se resalta la línea 39: aquí en lugar de crearse un objeto de tipo ListViewItem, como en WinForms nativo, se instancia un objeto de tipo ListViewDataItem. Después, en la línea 45, se asigna a la propiedad Tag un objeto de tipo FileInfo.

Esta es una prueba de ejecución: 
Ejecución receta R0702 [Telerik]
Figura 3. Ejecución receta R0702 [Telerik].


DevExpress

Archivo C# R0702.cs [Enlace alternativo][Enlace alternativo]: 

Esta implementación que cuenta con el uso de controles de DevExpress es análoga a la implementada con los controles de WinForms nativo de Microsoft .NET Framework.


Versión en ejecución: 
Ejecución receta R0702 [DevExpress]
Figura 4. Ejecución receta R0702 [DevExpress].

7. Conclusiones

Quedó demostrado que la propiedad Tag resulta apropiada para la asignación de datos. Esta propiedad es idónea como portador de información en una interfaz gráfica de usuario.


La próxima receta C# también resultará muy interesante: el programador aprenderá a procesar todos los controles en un formulario.

8. Literatura & Enlaces

Jones, A., Freeman (2010). Visual C# 2010 Recipes: A Problem-Solution Approach. United States: Apress.
Control.Tag Property (System.Windows.Forms) (2016, julio 9). Recuperado desde: https://msdn.microsoft.com/en-us/library/system.windows.forms.control.tag%28v=vs.110%29.aspx?f=255&MSPPError=-2147217396
ListView Class (System.Windows.Forms) (2016, julio 9). Recuperado desde: https://msdn.microsoft.com/en-us/library/system.windows.forms.listview(v=vs.110).aspx
ListViewItem Class (System.Windows.Forms) (2016, julio 9). Recuperado desde: https://msdn.microsoft.com/en-us/library/system.windows.forms.listviewitem(v=vs.110).aspx
ListViewDataItem Class (2016, julio 9). Recuperado desde: http://docs.telerik.com/devtools/winforms/api/html/T_Telerik_WinControls_UI_ListViewDataItem.htm
RadListView Class (2016, julio 9). Recuperado desde: http://docs.telerik.com/devtools/winforms/api/html/T_Telerik_WinControls_UI_RadListView.htm


V

viernes, 8 de julio de 2016

Receta C# No. 7-1: Agregar un Control Sin Usar el Diseñador de Visual Studio

Índice

1. Introducción
2. Palabras Clave
3. Problema
4. Solución
5. Discusión de la Solución
5.1 Control System.Windows.WinForms.CheckBox
5.2 Control Telerik.WinControls.UI.RadCheckBox
5.3 Control DevExpress.XtraEditors.CheckEdit
6. Práctica: Agregación Control en Forma Dinámica
7. Conclusiones
8. Literatura & Enlaces

1. Introducción

A partir de esta receta C# se da inicio a la serie número 7 -Formularios de Windows-. Microsoft .NET Framework cuenta con una aplicación específica para la creación de aplicaciones con interfaz gráfica de usuario (Graphical User Interface o GUI) conocida comúnmente como WinForms. El propósito de esta nueva serie es conocer los conceptos fundamentales para empezar a construir GUIs que faciliten el tratamiento de datos a sus usuarios. No sólo se hará hincapié en WinForms de .NET Framework, sino que además se aprovechará la existencia de otras implementaciones como Telerik y DevExpress con el objetivo de dar a conocer al programador las opciones que existen en este contexto.


Los temas generales a tratar en estas recetas comprende: 
  • Agregación de controles sin el uso del diseñador de Visual Studio.
  • Vínculo de fuente de datos a controles.
  • Procesamiento genérico de controles.
  • Seguimiento de formularios MDI.
  • Almacenamiento de configuración de usuario y de aplicación.
  • Obtención del elemento usado más reciente en una lista.
  • Validación de la entrada de usuario.
  • Implementación de autocompletado.
  • Ordenamiento de una lista.
  • Manejo de controles en un layout.
  • Creación y manejo de menús contextuales.
  • Soporte multi-lenguaje.
  • Configuración del aspecto y comportamiento de formularios.
  • Animación de icono en la bandeja de entrada de la barra de tareas de Windows.
  • Soporte de arrastrar y soltar.
  • Multithreading en aplicaciones con interfaz gráfica de usuario.
  • Agregación de contenido Web a través de controles.
  • Relación entre WPF y WinForms.
En esta primera receta el programador de C# se concentra en la creación de controles de interfaz gráfica de usuario sin recurrir al uso del diseñador visual de Visual Studio. El desarrollo práctico de esta receta se focaliza en tres alternativas: estándar WinForms, controles de soporte de Telerik y DevExpress.

2. Palabras Clave

  • Control
  • DevExpress
  • Diseñador Visual
  • GUI
  • Telerik
  • Visual Studio
  • WinForms

3. Problema

Agregar una control a un formulario sin usar el diseñador visual integrado de Visual Studio.

4. Solución

El namespace System.Windows.Forms cuenta con clases para controles de interfaz gráfica de usuario.

5. Discusión de la Solución

5.1 Control System.Windows.Controls.CheckBox

Este control representa una casilla de comprobación que puede estar en activado, desactivado e indeterminado ("CheckBox Class", 2016).

En esta receta C# se utiliza un proyecto de tipo Windows Forms donde se crean de manera dinámica hasta 12 objetos CheckBox.

5.2 Control Telerik.WinControls.UI.RadCheckBox

La suite de controles WinForms de Telerik también cuenta con una implementación para este control de comprobación: RadCheckBox ("RadCheckBox Class", 2016).

[Nota: Desde la página oficial de Telerik se puede descargar una versión totalmente funcional de esta suite: Telerik UI for WinForms.]

5.3 Control DevExpress.XtraEditors.CheckEdit

Al igual que los dos juegos de controles visuales anteriores, la suite DevExpress cuenta con el control CheckEdit ("CheckEdit Class", 2016).

[Nota: En el tutorial Instalación de Componentes Visuales DevExpress para Visual Studio 2013 se explica el paso a paso de la instalación de esta suite.]

6. Práctica: Agregación Control de Forma Dinámica

La siguiente receta está desarrollada en tres diferentes formas: 
  1. CheckBox
  2. RadCheckBox, y 
  3. CheckEdit
El método Onload(EventArgs) para los tres variaciones de los controles realiza estas operaciones: 
  • Línea 19: Invoca el método OnLoad() para que se dispare correctamente este evento sobrescrito.
  • Líneas 22-27: Definición de arreglo de cadenas de caracteres con nombres de tecnologías relacionadas con Microsoft.
  • Línea 31: Asegura que la lógica de agregación de controles de forma dinámica sea correcta.
  • Línea 35: Variable auxiliar para controlar el posicionamiento horizontal de cada objeto CheckBox (RadCheckBox o CheckEdit).
  • Líneas 38-53: Agrega cada uno de los objetos al control contenedor:
    • Estándar WinForms: System.Windows.Forms.Panel
    • Telerik: Telerik.WinControls.UI.RadScrollablePanel, y 
    • DevExpress: DevExpress.XtraEditors.XtraScrollableControl.
  • Línea 57: Restablece el control contenedor para continuar con la lógica del control.
Aplicación en ejecución: 
WinForms
Figura 1. WinForms.
Estos dos archivos en C# son las versiones con controles de Telerik y DevExpress

Versión Telerik:

Archivo C# R0701.cs [Enlace alternativo][Enlace alternativo]: 

Aplicación en ejecución: 
WinForms en Telerik
Figura 2. WinForms en Telerik.

Versión DevExpress

Archivo C# R0701.cs [Enlace alternativo][Enlace alternativo]: 

Aplicación en ejecución: 
WinForms en DevExpress
Figura 3. WinForms en DevExpress.

7. Conclusiones

Se ha demostrado que es posible prescindir del diseñador de Visual Studio para la creación de controles. Esto ocurre de forma dinámica. Es importante siempre recordar que es necesario invocar SuspendLayout() y ResumeLayout() para optimizar la agregación dinámica de controles.

En la próxima receta se ilustra cómo almacenar datos con un control.

8. Literatura & Enlaces

Jones, A., Freeman (2010). Visual C# 2010 Recipes: A Problem-Solution Approach. United States: Apress.
CheckBox Class (System.Windows.Controls) (2016, julio 8). Recuperado desde: https://msdn.microsoft.com/en-us/library/system.windows.controls.checkbox%28v=vs.110%29.aspx?f=255&MSPPError=-2147217396
RadCheckBox Class (2016, julio 8). Recuperado desde: http://docs.telerik.com/devtools/winforms/api/html/T_Telerik_WinControls_UI_RadCheckBox.htm
WinForms Controls | Telerik UI for WinForms (2016, julio 8). Recuperado desde: http://www.telerik.com/products/winforms.aspx
CheckEdit Class | WinForms Controls | DevExpress Help (2016, julio 8). Recuperado desde: https://documentation.devexpress.com/#WindowsForms/clsDevExpressXtraEditorsCheckEdittopic
Instalación de Componentes Visuales DevExpress para Visual Studio 2013 (2016, julio 8). Recuperado desde: https://ortizol.blogspot.com.co/2014/05/instalacion-de-componentes-visuales.html


V