18
Capítulo 6 ELEMENTOS DE INTERFAZ GRAFICA WindowsForms Los programas de computador modernos, al menos en un alto porcentaje, a los que se enfrenta el usuario se caracterizan por un aspecto en común: ponen a su disposición una o varias ventanas que le permiten recibir o mostrar los datos que se procesan en el computador. Está característica es la que ha permitido que más personas vean al computador como una herramienta de trabajo casi indispensable en más y más tareas que deben realizar en su vida cotidiana, sacándolo del uso exclusivo de unos pocos y llevándolo a formar parte de la vida misma de los habitantes del siglo XXI. Pero, lo que realmente ha facilitado el uso del computador no han sido las ventanas como tal, sino el diseño de las mismas incluyendo unos elementos básicos que hoy en día se han convertido en prácticamente un estándar del desarrollo de las interfaces gráficas de usuario. Los botones de comando, las cajas de texto, las listas desplegables, las barras de herramientas, las barras de desplazamiento, los menús, y muchos otros elementos son parte indispensable en cualquier programa de computador que el usuario busca le sea útil para sus objetivos. Hoy en día al usuario de aplicaciones de software no le interesa en que sistema operativo funcionen estas, y menos en que lenguaje de programación hayan sido desarrolladas, siempre y cuando pongan a su disposición los elementos básicos que él reconoce, de tal manera que le permitan acceder a las funciones en la misma forma como lo hacen desde las aplicaciones más elementales hasta las más sofisticadas. Aunque el objetivo esencial de un programa de computador es la funcionalidad que debe prestar al usuario, y no la forma como se haya desarrollado, para los programadores si es de especial cuidado el manejo de los componentes gráficos que se van a utilizar, por que un mal uso de estos puede echar por la borda todo el trabajo de ingeniería de software aplicado en el momento de su desarrollo. Sin embargo, dado que la mayoría de aplicaciones requieren del uso de un gran número de elementos gráficos, su manejo en lo que respecta a la programación puede resultar demasiado complejo y dispendioso al tener que manipular muchos detalles en forma repetitiva y precisa, lo cual consume una gran cantidad de energía y tiempo en esta fase del desarrollo. Por ejemplo, uno de los aspectos que puede resultar más complejo para un programador es la ubicación de los componentes en varias ventanas, que le obligan a memorizar diferentes coordenadas o realizar cálculos que en la mayoría de los casos, aunque importantes en el campo de la presentación, resultan intrascendentes para la funcionalidad misma del programa que se está desarrollando. Los entornos de desarrollo integrado La solución dada por la informática moderna, al problema de la programación con componentes de interfaz gráfica, han sido los IDE ( integrated development environment, entornos de desarrollo integrado), que le permiten al programador centrarse en la funcionalidad misma del programa más que en como hacer funcionar cada pieza que se va a utilizar en su construcción. Estos IDE son programas de computador que ponen a disposición del programador un conjunto de herramientas de tipo visual que hacen más rápida la tarea de programación en cualquier lenguaje. Entre

ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

  • Upload
    others

  • View
    9

  • Download
    0

Embed Size (px)

Citation preview

Page 1: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

Capítulo 6ELEMENTOS DE INTERFAZ GRAFICA

WindowsForms

Los programas de computador modernos, al menos en un alto porcentaje, a los que se enfrenta el usuario se caracterizan por un aspecto en común: ponen a su disposición una o varias ventanas que le permiten recibir o mostrar los datos que se procesan en el computador. Está característica es la que ha permitido que más personas vean al computador como una herramienta de trabajo casi indispensable en más y más tareas que deben realizar en su vida cotidiana, sacándolo del uso exclusivo de unos pocos y llevándolo a formar parte de la vida misma de los habitantes del siglo XXI.

Pero, lo que realmente ha facilitado el uso del computador no han sido las ventanas como tal, sino el diseño de las mismas incluyendo unos elementos básicos que hoy en día se han convertido en prácticamente un estándar del desarrollo de las interfaces gráficas de usuario. Los botones de comando, las cajas de texto, las listas desplegables, las barras de herramientas, las barras de desplazamiento, los menús, y muchos otros elementos son parte indispensable en cualquier programa de computador que el usuario busca le sea útil para sus objetivos. Hoy en día al usuario de aplicaciones de software no le interesa en que sistema operativo funcionen estas, y menos en que lenguaje de programación hayan sido desarrolladas, siempre y cuando pongan a su disposición los elementos básicos que él reconoce, de tal manera que le permitan acceder a las funciones en la misma forma como lo hacen desde las aplicaciones más elementales hasta las más sofisticadas.

Aunque el objetivo esencial de un programa de computador es la funcionalidad que debe prestar al usuario, y no la forma como se haya desarrollado, para los programadores si es de especial cuidado el manejo de los componentes gráficos que se van a utilizar, por que un mal uso de estos puede echar por la borda todo el trabajo de ingeniería de software aplicado en el momento de su desarrollo. Sin embargo, dado que la mayoría de aplicaciones requieren del uso de un gran número de elementos gráficos, su manejo en lo que respecta a la programación puede resultar demasiado complejo y dispendioso al tener que manipular muchos detalles en forma repetitiva y precisa, lo cual consume una gran cantidad de energía y tiempo en esta fase del desarrollo. Por ejemplo, uno de los aspectos que puede resultar más complejo para un programador es la ubicación de los componentes en varias ventanas, que le obligan a memorizar diferentes coordenadas o realizar cálculos que en la mayoría de los casos, aunque importantes en el campo de la presentación, resultan intrascendentes para la funcionalidad misma del programa que se está desarrollando.

Los entornos de desarrollo integrado La solución dada por la informática moderna, al problema de la programación con componentes de interfaz gráfica, han sido los IDE (integrated development environment, entornos de desarrollo integrado), que le permiten al programador centrarse en la funcionalidad misma del programa más que en como hacer funcionar cada pieza que se va a utilizar en su construcción. Estos IDE son programas de computador que ponen a disposición del programador un conjunto de herramientas de tipo visual que hacen más rápida la tarea de programación en cualquier lenguaje. Entre

Page 2: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

estas herramientas se destacan los diseñadores de interfaces gráficas de usuario, que son algo así como plantillas que permiten dibujar y establecer las características de los componentes gráficos utilizando el puntero del ratón, mientras el IDE genera internamente el respectivo código de programación, y el sistema denominado IntelliSense, que es un ayudante de escritura de código que le evita al programador tener que memorizar una gran cantidad de nombres y palabras clave propias del lenguaje de programación y del marco de trabajo donde se este desarrollando, haciendo más rápida la codificación de los algoritmos.

Figura 6.1: Sistema IntelliSense mostrado por SharpDevelop

Entre los entornos de desarrollo integrado más populares y exitosos que existen actualmente para la programación con C# en .NET y Mono, están Visual Studio .NET, SharpDevelop y MonoDevelop. Visual Studio .NET es un software comercial cuyos costos dependen de la versión que desee adquirir el desarrollador, mientras que SharpDevelop y Monodevelop son OpenSource, y se pueden descargar libremente desde las páginas de sus respectivos desarrolladores.

Aunque los IDE son de gran ayuda en el proceso de desarrollo de aplicaciones en cualquier nivel, y le permiten al programador centrarse en el objetivo mismo del programa que está desarrollando, presentan un grave inconveniente, y es que ocultan muchos aspectos importantes de la arquitectura de una aplicación. En consecuencia el proceso de programación puede volverse mecánico y muchas veces carente de sentido lógico si no se tiene un fundamento claro de la estructura del lenguaje de programación y como funciona el framework de desarrollo, para nuestro caso C# y .NET. Esta dificultad es la que hace que muchos programadores se sientan cómodos trabajando con un IDE y un framework determinado, pero les cueste trabajo hacer lo mismo, y con el mismo lenguaje de programación, en un framework diferente. Además, el hecho de no tener bien claros los fundamentos, va a complicar mucho la posibilidad de abordar técnicas avanzadas de programación y sacar el máximo provecho al trabajo como desarrollador.

En este curso de programación con C#, se utilizará SharpDevelop como entorno de desarrollo, pero no es el objetivo enseñar su manejo ni mucho menos su funcionamiento, sino más bien aprovechar su funcionalidad para hacer más rápido el trabajo de programación, liberando al lector de algunas tareas repetitivas. Igual se sugiere que el lector dedique un poco de tiempo a analizar y entender el código generado por el IDE para cada uno de los ejemplos antes de continuar con la lectura.

En la tarea de comprender algunos conceptos de programación y el funcionamiento de los elementos del marco de desarrollo, a veces es mejor desarrollar los ejemplos sin la ayuda de algunos asistentes del IDE. Por ejemplo, en las primeras etapas de la programación con componentes de interfaz gráfica, conexión con bases de datos o procesos relacionados con la impresión o salida de datos, el lector primeramente

www.pedrov.info

160

Page 3: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

debería identificar a plenitud los detalles de bajo nivel relacionados con el código que sustenta tales funciones y luego determinar la validez del uso de los respectivos asistentes. Además, cuando se ha entendido plenamente la lógica y estructura del lenguaje de programación, algunos asistentes del IDE pasan a segundo plano y sus funciones se comprenden fácilmente sin necesidad de haberlos estudiado en forma exclusiva.

SharpDevelop SharpDevelop es un IDE libre desarrollado inicialmente para programar con C#, pero en las últimas versiones también incluye la posibilidad de hacerlo con VB.NET, Boo, F# y Phyton, entre otros, en proyectos que utilizan el marco de trabajo Microsoft. NET o Mono. Y un aspecto que lo hace verdaderamente interesante y útil es que se trata de un proyecto de código abierto, y se puede descargar tanto el código fuente como los ejecutables desde la página de sus desarrolladores, http://www.icsharpcode.net.

Como cualquier otro programa de Windows, se descarga el instalador de SharpDevelop y se instala sin mayores problemas. Las últimas versiones se ejecutan sobre el Framework 3.0 o superior de .NET, así que se deberá tener instalado primero este componente para que las cosas funcionen bien. Adicional, se sugiere descargar el kit de desarrollo de software (SDK) de Microsoft .NET Framework 2.0 (x86) o superior, desde la página de Microsoft, para de esta manera poder contar con la documentación necesaria de los componentes de .NET, a través de los comandos de su menú Ayuda.

Ventanas del IDE

Figura 6.2: Ventana principal de SharpDevelop, la cual muestra la páginade inicio con un listado de las soluciones que se han desarrollado.

La primera vez que se ejecuta SharpDevelop el entorno mostrará un listado de las últimas soluciones desarrolladas y le pedirá que se abra una solución existente o inicie una nueva. Una solución es un grupo formado por uno o varios proyectos de desarrollo, los cuales pueden ser independientes unos de otros, pero que el programador puede manipularlos para establecer relaciones directas entre ellos

[email protected]

161

Page 4: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

aprovechando las herramientas que le ofrece el entorno de desarrollo. Cada proyecto, a su vez, es el conjunto de elementos que permiten desarrollar un ensamblado y generalmente esta constituido por varios archivos que se guardan en un directorio con el nombre del proyecto. De esta manera, dentro del directorio que define la solución se ubican uno o varios subdirectorios que corresponden a cada uno de los proyectos que la constituyen.

Cuando se inicia una nueva solución, el entorno muestra el cuadro de dialogo Proyecto nuevo, que le permite al programador establecer el tipo de aplicación que va a desarrollar, el lenguaje que va a utilizar en su programación y el framework sobre el cual se va a trabajar. El nombre que se asigne al primer proyecto será el nombre que asuma la solución, aunque este valor puede cambiarse en la caja de texto Nombre de la solución.

Figura 6.3: Cuadro de dialogo Proyecto nuevo que permite definir el proyecto que se va a desarrollar, sus características y el lenguaje de programación que se va a utilizar

En el caso del framework .NET, cualquier versión que se encuentre instalada se configura automáticamente para ofrecerse como una posibilidad del marco de trabajo que desee seleccionar el programador. Pero no sucede lo mismo, al menos hasta la versión 3.0 de SharpDevelop, con el framework Mono, que debe configurarse manualmente.Una vez definido el proyecto que se va a desarrollar, se ingresa al entorno de desarrollo que está constituido por un grupo de ventanas y barras de herramientas que buscan ser el ayudante perfecto que el programador va a necesitar en su trabajo. Enseguida revisaremos brevemente el propósito de cada uno de estos elementos, teniendo en cuenta que para mostrar cualquiera de ellos se debe utilizar el menú Ver. También se podrá abrir muchos de ellos utilizando un acceso directo de teclado o pulsando sobre alguno de los iconos contenidos en la barra de herramientas principal, como se indicar a continuación.

www.pedrov.info

162

Page 5: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

• La ventana de proyectos proporciona información de los componentes que conforman la solución en desarrollo, mostrando los proyectos que la componen y sus respectivos componentes. Cada proyecto está constituido por los ensamblados de referencia que se enlazan para acceder a los componentes de software tanto del framework .NET como de los componentes desarrollados por el mismo programador o por terceros, y por los archivos que guardan el código de programación, las propiedades y los recursos. Para acceder a esta ventana podrá utilizarse el comando Proyectos del menú Ver o la combinación de teclas CTRL+ALT+L.

Diseñador de formulariosVentana de propiedades

Ventana de proyectos

Barra de herramientas principal

Figura 6.3: Entorno de desarrollo de SharpDevelop mostrando algunas de sus ventanas más importantes

• El programador podrá utilizar la ventana del diseñador de formularios para diseñar la interfaz de usuario de aquellos proyectos que se basen en estos componentes, utilizando WindowsForms o WebForms, principalmente. Cada proyecto puede estar conformado por uno o más formularios y para cada uno de ellos existirá un diseñador de formularios independiente. Basándose en este diseño, el generador de código escribirá en un archivo el código necesario para mostrar la ventana tal como la dibujó el programador. Como ya se menciono en el capítulo anterior, este diseñador de formularios genera una clase para cada formulario y la guarda en dos archivos. En uno de los archivos se almacenará el código que introduzca el programador para hacer funcionar los diferentes componentes y en el otro se

[email protected]

163

Page 6: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

guarda el código que se corresponde con el diseño gráfico de la ventana. Este último archivo se nombra con el nombre de la clase seguido de la palabra Designer.

• La ventana de herramientas incluye un conjunto de objetos que se podrán introducir en un formulario o en cualquier otro componente gráfico para diseñar la interfaz de usuario del proyecto en desarrollo. Mediante etiquetas se organizan los diferentes componentes gráficos que SharpDevelop enlaza automáticamente, empezando en aquellos provistos por el framework .NET. Los componentes WindowsForms corresponden a los controles de interfaz grafica estándar que se utilizan en la mayoría de aplicaciones. Los componentes Data son controles gráficos que permiten realizar la configuración y el acceso a bases de datos. Los controles incluidos en Components permiten configurar algunas funciones del sistema operativo, tales como pulsos de tiempo, conexión a los puertos, ayudas o envió de mensajes de texto al usuario. Los componentes Printing son controles que permiten generar los procesos de impresión. Y finalmente en la etiqueta Componentes personalizados se incluyen todos aquellos componentes desarrollados por el programador y que no hacen parte del framework .NET. Para acceder a la ventana de herramientas se utiliza el comando Herramientas del menú Ver o la combinación de teclas CTRL+ALT+X.

• El Editor de código o ventana Fuente permite escribir el código que determina el comportamiento de la aplicación en general. Cada archivo de código abre su propio editor de código. Para acceder al editor de código se selecciona el archivo que se va a editar en la ventana Proyectos. En el caso especifico de los formularios, además del acceso normal al editor de código, se puede hacer mediante una pestaña que aparece en la parte inferior del diseñador o haciendo doble clic sobre el diseño de la ventana.

• La ventana propiedades lista todas las propiedades y eventos que hacen parte de un control que se encuentre seleccionado en el diseñador de formularios. Para el caso de las propiedades proporciona la posibilidad de modificar sus valores ya sea escribiéndolos o seleccionándolos de alguna colección previamente establecida. En el caso de los eventos, el programador podrá definir o seleccionar el nombre del método que controlará uno o más eventos que hagan parte del control seleccionado. El IDE se encarga de asignar el código de delegación y establecer la firma del método controlador. Para acceder a la ventana de Propiedades se utiliza el comando Propiedades del menú Ver o pulsando la tecla F4.

• Las diferentes clases que conforman un proyecto, así como los diferentes elementos que las conforman se pueden visualizar por medio de la ventana Clases. A esta ventana se accede mediante el comando Clases del menú Ver o la combinación de teclas CTRL+SHIFT+C.

• En la parte inferior del entorno de desarrollo se encuentran un grupo de ventanas que le permiten al programador visualizar los resultados de los procesos de compilación realizados, en especial los mensajes de error generados por el compilador.

• Las ventanas de ayuda muestran la ayuda incluida en la documentación de SharpDevelop y también de los componentes del framework de desarrollo cuando se ha instalado el SDK de .NET. Para acceder a estas ventanas se utilizan los comandos del menú Ayuda.

La mayoría de ventanas que se acaban de describir se pueden fijar, cambiar de posición o cerrar, de acuerdo a los gustos e intereses del programador. Algunas ventanas que no se han descrito en esta sección guardan una relación directa con conceptos propios de la programación en .NET, o su funcionalidad se muestra cuando se realiza la compilación de los ensamblados, y por esa razón se explicará su utilidad en el

www.pedrov.info

164

Figura 6.4: Ventana de herramientas para el diseño de las interfaces gráf icas.

Page 7: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

momento que se asuman dichas temáticas. Otros elementos como menús y barras de herramientas se entenderán mejor con el desarrollo de ejemplos de programación que muestren en forma práctica su utilidad.

Organización de archivosDesde el punto de vista de la codificación, una aplicación real de WindowsForms o WebForms, desarrollada con C#, está conformada por clases y estas, en los IDE, se agrupan en proyectos. A diferencia de su principal antecesor, C++, el lenguaje C# está totalmente orientado a objetos y por lo tanto no soporta fragmentos de código que no hagan parte de una clase.

Aunque se podrían incluir todas las clases que conforman un programa en un único archivo de código, esta no es una práctica recomendable ya que no existe aplicación de software que en un futuro cercano o lejano no necesite revisarse, corregirse o modificarse, y una pobre organización en la codificación de la misma puede traer muchos dolores de cabeza a sus programadores y encargados del mantenimiento. Por esta y otras razones más, se recomienda colocar cada clase en un archivo diferente, de tal manera que sea fácilmente identificable, tanto al visualizarse desde el interior del entorno de desarrollo como cuando sea necesario manipular sus archivos desde el exterior.

Toda la organización de los archivos que conforman un proyecto de SharpDevelop se realiza por medio de la ventana Proyectos y el menú principal Proyecto. En el siguiente ejemplo vamos a desarrollar una pequeña aplicación de WindowsForms basada en dos clases y que hace uso de los comandos del menú Proyecto.

Ejemplo 6.1 Hola SharpDevelopEl programa que se desarrollará, parte de un proyecto vacío y para comprender la forma como SharpDevelop organiza los archivos, se configurará hasta convertirlo en un proyecto de aplicación al estilo de WindowsForms.

Inicie SharpDevelop y cree una nueva solución haciendo clic en el botón Nueva solución de la ventana Página de inicio o mediante el comando Nuevo del menú Archivo. En la ventana Proyecto Nuevo, en la sección Categorías haga clic sobre el nodo C# y en la sección Plantillas seleccione Proyecto en Blanco. Para continuar con la secuencia planteada en los anteriores capítulos asigne Ejemplo61 como el nombre del proyecto. Finalmente haga clic en el botón Crear.

Hecho lo anterior, se crea una solución con un único proyecto. Inicialmente el proyecto está constituido únicamente por una o dos referencias que apuntan a System y System.Xml. Este es el primer gran aporte que le hace un IDE como SharpDevelop al trabajo del programador, liberándolo de la tarea de tener que informarle al compilador sobre los recursos que se deben enlazar cada vez que se haga el proceso de generación del ensamblado.

Como el objetivo de este ejemplo es construir un ejecutable WindowsForms, lo primero que se debe hacer es establecer una referencia a System.Windows.Forms. Para esto, en la ventana Proyectos seleccione el nombre del proyecto y haga clic sobre el comando Agregar Referencia del menú Proyecto.

En la ventana Agregar Referencia se muestran, en las pestañas superiores, al menos cuatro tipos de referencias que pueden establecerse. En la ficha GAC se incluyen todas las referencias que apuntan a componentes incluidos en ensamblados registrados como elementos del framework .NET. En las ficha Proyectos se incluyen las referencias que pueden hacerse a otros proyectos incluidos en la solución que se esta trabajando actualmente. El Visor de Ensamblados es una forma general de acceder a cualquier ensamblado que ya se encuentre compilado. La ficha COM permite referenciar

[email protected]

165

Page 8: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

componentes COM que hayan sido desarrollados por fuera de la infraestructura .NET o anterior a la aparición de esta tecnología. Con respecto a esta última opción, es importante dejar bien claro que aunque existe como tal, será mejor evitar su uso, ya que los componentes COM son elementos totalmente extraños a la infraestructura que ofrece el framework .NET. Si el programador había desarrollado componentes COM y los necesita en su aplicación, será mejor que vaya pensando en desarrollar la versión .NET de los mismos.

Para continuar, haga doble clic sobre las referencias System.Windows.Forms y System.Drawing, y luego sobre el botón Aceptar.

Figura 6.5: La ventana Agregar Referencia permite establecer una o varias referencias a ensamblados o componentes COM.

Para comenzar con la codificación vamos a agregar una primera clase al proyecto. Manteniendo seleccionado el proyecto, elija el comando Agregar, Nuevo elemento, del menú Proyecto y en la categoría C# seleccione la plantilla Clase. A esta clase asígnele el nombre Programa.cs. Al hacer clic sobre el botón Crear aparece la plantilla de la clase en el editor de código. Esta clase Programa solo tendrá como objetivo establecer el punto de entrada para el ejecutable de la aplicación.

using System;namespace Ejemplo61{

/// <summary>/// Descripción de Programa./// </summary>public class Programa{

public Programa()www.pedrov.info

166

Page 9: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

{}

}}

Antes de editar la clase Programa, agregue la clase que contendrá la ventana que necesita la aplicación. Al igual que la anterior, por medio del menú Proyecto agregue una nueva clase al proyecto y llámela CajaMensajes.cs. Al hacer clic en el botón Crear se genera la plantilla de la nueva clase. Edite este último archivo de clase en la forma como se muestra en el siguiente bloque de código:

using System;using System.Windows.Forms;using System.Drawing;namespace Ejemplo61{

public class CajaMensaje : Form{

public CajaMensaje(){

// Llamar el método encargado de inicializar la ventanaInicializarComponentes();

}

void InicializarComponentes(){

this.BackColor = Color.Black;this.MinimizeBox = false;this.MaximizeBox = false;this.Width = 300;this.Height = 70;this.Text = "Bienvenido a C#";// Controlar el evento Paint del formulariothis.Paint += new PaintEventHandler(CajaMensajePaint);

}

void CajaMensajePaint(object emisor, PaintEventArgs e){

// Establece una fuenteFont fuente = new Font("Times", 20, FontStyle.Bold);// Definir un rectángulo para fijar el textoRectangleF cuadroTexto =

new Rectangle(0, 0, this.Width, this.Height);// Define un formato para asignar al textoStringFormat formatoCadena = new StringFormat();formatoCadena.Alignment = StringAlignment.Center;// Dibuja una cadena de texto en el cuerpo del formularioe.Graphics.DrawString("¡Hola SharpDevelop...!", fuente,

Brushes.Gold, cuadroTexto, formatoCadena);}

}}

Esta lista la ventana que mostrará la aplicación cuando se ejecute. Por ahora este solo es un ejercicio de codificación en el que se comprueba la eficacia de SharpDevelop como ayudante para escribir código. En resumen, la clase se deriva de Form, establece valores para algunas de sus propiedades y controla el evento Paint que se encargará de dibujar en el cuerpo del formulario un mensaje de bienvenida. Los detalles de su

[email protected]

167

Page 10: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

implementación se analizarán con más detenimiento cuando se trabaje con trazado de gráficos en un capítulo posterior.

Para completar el desarrollo del proyecto es necesario establecer el punto de entrada del ejecutable, y para ello editamos la clase Programa como se muestra enseguida:

using System;namespace Ejemplo61{

public class Programa{

static void Main(){

System.Windows.Forms.Application.Run(new CajaMensaje());}

}}

Para compilar la aplicación se utiliza el comando Generar solución del menú Generar, y para ejecutarla, en el caso de programas ejecutables, se utiliza el comando Ejecutar del menú Depurar. El nombre del ensamblado generado corresponde al nombre del proyecto, Ejemplo61.exe, y se guarda en el subdirectorio bin.

Al ejecutar la aplicación se observa que lo hace sobre una consola de comandos. La razón es simple: el compilador por defecto genera una ejecutable de consola. Para informarle al compilador que se desea generar un ejecutable que se ejcute totalmente dentro del sistema gráfico de Windows, se debe hacer por medio de la ventana Opciones de proyecto que se muestra a través del menú Proyecto. En esta ventana, el programador puede asignar o modificar todas las opciones relacionadas con el proyecto en la ficha Aplicación, en especial el tipo de salida, y asignar el valor Aplicación de Windows.

Otro aspecto importante en la ventana Opciones de proyecto son los datos relacionados con la compilación del ensamblado que se encuentran en la ficha Generar. Aquí se puede establecer la configuración de la compilación definitiva, Debug o Release, y la plataforma donde se va a ejecutar el ensamblado. La configuración Debug incluye en el ensamblado una gran cantidad de información adicional relacionada con su estructura para permitirle al depurador controlar la ejecución e informar sobre el estado de la misma. Esta característica hace que la ejecución de este tipo de ensamblados no sea la óptima, por lo cual se recomienda utilizarla únicamente para tareas de depuración. Los ensamblados definitivos deben compilarse en la configuración Release.

Existe un detalle importante que hasta ahora no se había mencionado. Todos los ejemplos que se han desarrollado cuentan con un único punto de entrada. Sin embargo, esto no significa que tenga que ser único en todas las aplicaciones, ya que cada clase que conforma la aplicación ejecutable puede implementar al menos un punto de entrada. Pero dada esta situación es necesario informar al compilador cual será el punto de entrada que se va a utilizar en la ejecución de la aplicación. Para establecer este dato, puede utilizar la ventana Opciones de proyecto y en la ficha Aplicación, en la entrada Objeto Inicial, establecer el punto de entrada que se desea utilizar.

El diseñador de formulariosEl diseñador de formularios es el elemento que permite generar código basándose en procesos gráficos. El programador dibuja, modifica y asigna valores a los controles que necesita incluir en un formulario y, en el caso de las aplicaciones WindowsForms, el

www.pedrov.info

168

Page 11: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

diseñador se encarga de escribir el código necesario para construir la clase que permite generar la ventana que se deriva de ella.

Cada uno de los formularios que se generan con el diseñador de formularios es una clase que por cuestiones de organización se guarda en dos archivos. En uno de ellos se coloca todo el código generado automáticamente por el diseñador, resultado de los procesos gráficos de construcción de la ventana, y se nombra con la denominación NombreClase.Designer.cs. En el otro se coloca todo el código que debe escribir el programador para dar funcionalidad a la ventana, y se nombra con la denominación NombreClase.cs.

Construida la ventana, bien se podría decir que el programador pasa a otro nivel de abstracción, en su labor de programación, que algunos autores denominan programación orientada a eventos, en el cual todo el trabajo se centra únicamente en dar funcionalidad a cada uno de los elementos que le interesan, escribiendo el código necesario que controle algunos de los eventos de dichos controles.

Ejemplo 6.2 Diseño de un programa aritméticoEn este ejemplo vamos a construir un programa que se encarga de recibir dos valores numéricos y realiza con ellos algunas operaciones aritméticas.

Inicie un nuevo proyecto con la categoría Aplicaciones de Windows, utilizando la plantilla Aplicación Windows y denomínelo Ejemplo62. Observará que se genera un formulario vacío y en la ventana Proyectos, entre otros, aparecen dos clases: Program.cs y MainForm.cs. La primera contiene el punto de inicio de la aplicación, mientras que la segunda contiene la estructura que genera el formulario.

Estamos listos para comenzar a programar. Para crear uno o más controles en la superficie del formulario se debe activar la barra de herramientas con el comando Herramientas del menú Ver y seleccionar el tipo de controles Windows Forms. Arrastre desde esta barra cuatro controles Label, tres controles TextBox y cinco controles Button.

Figura 6.6. Diseñador de formularios que muestra un formulario en construcción

Para modificar las propiedades de un control se selecciona con el puntero del ratón y de ser necesario se presiona la tecla F4, o se selecciona el comando Propiedades del

[email protected]

169

Page 12: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

menú Ver, para mostrar la ventana Propiedades. En esta ventana se modifican los valores de las propiedades que se consideren necesarias para cumplir con los objetivos de la aplicación.

Inicialmente, asigne a la propiedad Text de los controles Label los valores Número, Número y Resultado, respectivamente. A estos controles no vamos a modificar su propiedad Name por cuanto no se requerirá hacer referencia a ellos en la codificación.

Los demás controles si necesitan tener un nombre significativo para los intereses del programador ya que se utilizarán en el proceso de codificación, y por lo tanto es necesario recurrir a algún tipo de nomenclatura estándar que permita identificarlos fácilmente en una revisión posterior. Comos ya se dijo en un capítulo anterior la forma sugerida por .NET para el nombramiento de variables de objeto, utiliza cadenas de texto que comienzan por un nombre que determina el tipo al cual pertenece dicho objeto seguido de una cadena que identifica la funcionalidad del mismo dentro de la aplicación, utilizando la nomenclatura camel. En los IDE como SharpDevelop se puede establecer el nombre de la variable objeto que identifica a un control mediante la propiedad Name del mismo. Aunque esta característica puede manipularse por parte del programador y un control puede ser perfectamente definido por un nombre de variable objeto diferente al valor de la propiedad Name, pero esta práctica no es recomendable por que puede conllevar a confusiones en el momento de hacer una revisión de código.

En la tabla se muestran los valores de las propiedades Name y Text de cada uno de los controles.

Tipo Propiedad Valor

TextBox NameText

textNumero10

NameText

textNumero20

NameTextReadOnly

textResultado0True

Button NameText

buttonSumarSumar

NameText

buttonRestarRestar

NameText

buttonMultiplicarMultiplicar

NameText

buttonDividirDividir

NameText

buttonCerrarCerrar

Para dar funcionalidad a los controles vamos controlar los eventos Click de cada uno de los botones de comando. Para definir el método que se encargará de controlar un evento se utiliza la ventana Propiedades, haciendo clic sobre el icono eventos.

Seleccione el botón de comando Sumar, active la ventana Propiedades, presionando la tecla F4, y haga clic sobre el icono Eventos de esta ventana. El listado que aparece, corresponde a todos los eventos que puede generar el control seleccionado. Seleccione con el puntero del ratón el evento Click y asigne el nombre del método que lo controlará, en este caso ButtonSumarClick. Recuerde que el estilo .NET sugiere que los métodos se nombren con letra inicial mayúscula, y en el caso de aquellos que

www.pedrov.info

170

Page 13: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

controlan eventos debe hacerse iniciando con el nombre del control seguido de una cadena equivalente al nombre del evento controlado.

Cuando se ha terminado de establecer el nombre del método controlador y se presiona la tecla ENTER o se hace doble clic sobre el nombre del evento, se escribe en el archivo Designer la línea de código que establece la delegación,

this.buttonSumar.Click += new System.EventHandler(ButtonSumarClick);

y en el archivo de codificación manual se escribe la definición del método,

void ButtonSumarClick(object sender, EventArgs e){

}Para eliminar un controlador de un determinado evento se debe utilizar la misma ventana de propiedades. Se selecciona el control deseado y se borra el nombre del método que se desee desconectar de un determinado evento. Esto borra la delegación que se encontraba en el archivo Designer, pero el método se mantiene, y si desea quitarse debe hacerse manualmente.

Establezca los métodos controladores del evento Click para cada uno de los restantes botones de comando, asignándoles los nombres ButtonRestarClick, ButtonMultiplicarClick, ButtonDividirClick y ButtonCerrarClick, respectivamente.

La funcionalidad de los botones de operación la establece la siguiente codificación:

void ButtonSumarClick(object sender, EventArgs e){

int numero1 = Convert.ToInt32(textNumero1.Text);int numero2 = Convert.ToInt32(textNumero2.Text);int resultado = numero1 + numero2;textResultado.Text = resultado.ToString();

}

void ButtonRestarClick(object sender, EventArgs e){

int numero1 = Convert.ToInt32(textNumero1.Text);int numero2 = Convert.ToInt32(textNumero2.Text);int resultado = numero1 - numero2;textResultado.Text = resultado.ToString();

}

void ButtonMultiplicarClick(object sender, EventArgs e){

int numero1 = Convert.ToInt32(textNumero1.Text);int numero2 = Convert.ToInt32(textNumero2.Text);int resultado = numero1 * numero2;textResultado.Text = resultado.ToString();

}

void ButtonDividirClick(object sender, EventArgs e){

double numero1 = Convert.ToDouble(textNumero1.Text);double numero2 = Convert.ToDouble(textNumero2.Text);double resultado = 0;if (numero1 != 0){

[email protected]

171

Figura 6.7. Ventana de propiedades para definir los controladores de evento.

Page 14: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

resultado = numero1 / numero2;textResultado.Text = resultado.ToString();

}else

MessageBox.Show("División por cero...", "Error",MessageBoxButtons.OK, MessageBoxIcon.Error);

}

El botón Cerrar se encarga de finalizar la ejecución de la aplicación. En este caso basta con cerrar la ventana activa mediante su método Close y la aplicación saldrá del bucle de ejecución.

void ButtonCerrarClick(object sender, EventArgs e){

this.Close();}

En definitiva así es como queda el archivo que contiene la parte de la clase que da funcionalidad a la ventana.

using System;using System.Collections.Generic;using System.Drawing;using System.Windows.Forms;namespace Ejemplo62{

/// <summary>/// Permite definir una ventana/// </summary>public partial class MainForm : Form{

public MainForm(){

InitializeComponent();}

void ButtonSumarClick(object sender, EventArgs e){

int numero1 = Convert.ToInt32(textNumero1.Text);int numero2 = Convert.ToInt32(textNumero2.Text);int resultado = numero1 + numero2;textResultado.Text = resultado.ToString();

}

void ButtonRestarClick(object sender, EventArgs e){

int numero1 = Convert.ToInt32(textNumero1.Text);int numero2 = Convert.ToInt32(textNumero2.Text);int resultado = numero1 - numero2;textResultado.Text = resultado.ToString();

}

www.pedrov.info

172

Page 15: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

void ButtonMultiplicarClick(object sender, EventArgs e){

int numero1 = Convert.ToInt32(textNumero1.Text);int numero2 = Convert.ToInt32(textNumero2.Text);int resultado = numero1 * numero2;textResultado.Text = resultado.ToString();

}

void ButtonDividirClick(object sender, EventArgs e){

double numero1 = Convert.ToDouble(textNumero1.Text);double numero2 = Convert.ToDouble(textNumero2.Text);double resultado = 0;if (numero1 != 0){

resultado = numero1 / numero2;textResultado.Text = resultado.ToString();

}else

MessageBox.Show("División por cero...", "Error",MessageBoxButtons.OK, MessageBoxIcon.Error);

}

void ButtonCerrarClick(object sender, EventArgs e){

this.Close();}

}}

Llegado a este punto es importante que el lector revise detenidamente cada uno de los archivos de código que se han generado y, con base en lo estudiado en capítulos anteriores, dedique un poco de tiempo a comprender cual es el trabajo realizado por parte del diseñador de formularios y que función desempeña cada una de las líneas escritas.

El desarrollo de algunas actividades de programación en las secciones siguientes permitirá identificar otras funcionalidades de SharpDevelop que lo convierten en un potente IDE de desarrollo.

La caja de mensajesLa caja de mensajes es un componente prediseñado cuya función básica es establecer una comunicación instantánea con el usuario para logar una interacción efectiva con la aplicación. En los capítulos anteriores ya se han desarrollado varios ejemplos que utilizan cajas de mensajes, pero hace falta una descripción un poco más detallada de este componente gráfico para permitirle al programador sacar el máximo provecho de él.

Las diferentes versiones de la caja de mensajes son implementadas por la clase MessageBox que se encuentra definida en el espació de nombres System.Windows.Forms. Esta clase se deriva directamente de la clase base Object y, por tanto, hereda los métodos implementados en Object. El único método que implementa MessageBox es Show y se trata de un método estático, lo cual significa que para llamarlo debe escribirse antecedido del nombre de la clase,

[email protected]

173

Page 16: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

MessageBox.Show(...);

El método Show está sobrecargado y presenta al menos 21 versiones. En el siguiente cuadro se muestran 5 versiones, que generalmente son las más utilizadas en las aplicaciones estándar:

Sobrecargas del método Show de MessageBoxShow(string)Show(string, string)Show(string, string, MessageBoxButtons)Show(string, string, MessageBoxButtons, MessageBoxIcon)Show(string, string, MessageBoxButtons, MessageBoxIcon,MessageBoxDefaultButton)

Con el primer método se muestra el mensaje dentro de una caja de mensajes sin título. En cambio con la segunda versión, mediante el segundo argumento, se puede colocar una cadena de texto en la barra de titulo de la caja de mensajes. Generalmente se coloca el nombre de la aplicación que lanza el mensaje.

MessageBox.Show("Aquí va un mensaje", "El programa");

Para establecer los botones que se desea mostrar en la caja de mensajes se utilizan las constantes definidas por la enumeración MessageBoxButtons. Esta define seis constantes, que son las siguientes:

Constantes MessageBoxButtonsOK

OKCancel

AbortRetryIgnore

YesNoCancel

YesNo

RetryCancel

Por ejemplo, para mostrar un mensaje con los botones Si y No (para la versión de .NET en español) se debe hacer la siguiente llamada:

MessageBox.Show("Hola mundo", "Programa", MessageBoxButtons.YesNo);

La enumeración MessageBoxIcon, correspondiente al valor del cuarto parámetro, permite establecer un icono. Estos iconos están definidos por las siguientes constantes:

Constantes MessageBoxIconNone

Hand

Stop

Error

www.pedrov.info

174

Page 17: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS

Question

Exclamation

Warning

Asterisk

Information

Cuando se muestra más de un botón en una caja de mensajes es recomendable establecer un botón que será utilizado por defecto, mediante la enumeración MessageBoxDefaultButton. Esta característica permite el acceso rápido a dicho botón por medio del teclado, generalmente la tecla ENTER, lo cual facilita la operación por parte del usuario. Esto es muy útil cuando una caja de mensajes se presenta en situaciones relacionadas con tareas repetitivas, como por ejemplo el ingreso de datos, donde el usuario no quiere perder tiempo manipulando el puntero del ratón. Las constantes de esta enumeración son las siguientes:

Constantes MessageBoxDefaultButtonButton1

Button2

Button3

Si la caja de mensajes muestra más de un botón puede ser necesario saber cual fue el botón que presionó el usuario para cerrar la ventana, lo cual se considera como una respuesta al mensaje. Esto se logra fácilmente ya que el método Show devuelve un valor de tipo DialogResult que puede corresponder a cualquiera de los siguientes valores:

Constantes MessageBoxIconNone

OK

Cancel

Abort

Retry

Ignore

Yes

No

En el siguiente ejemplo se muestra el uso del método Show en algunas de sus sobrecargas.

Ejemplo 6.3 Unidades lógicas del sistemaLa aplicación mostrará en pantalla las unidades de disco lógicas que se encuentran instaladas en el computador donde se está ejecutando.

Inicie una nueva solución Windows Forms en SharpDevelop, del tipo Aplicación de consola, y llámela Ejemplo63. Para empezar, agregue una referencia a System.Windows.Forms mediante el comando Agregar referencia del menú Proyecto.

[email protected]

175

Page 18: ELEMENTOS DE INTERFAZ GRAFICA WindowsFormsomartellez.com/wp-content/uploads/2015/06/Programación-CSharp_06.pdfelementos básicos que él reconoce, de tal manera que le permitan acceder

CAPITULO 6 PROGRAMACION CON C#

Para determinar las unidades lógicas se utiliza el método GetLogicalDrives que devuelve un vector string con los nombres de las unidades instaladas. Modifique el método Main con el siguiente código:

using System;using System.Windows.Forms;namespace Ejemplo63{

class Program{

public static void Main(string[] args){

DialogResult resultado;

resultado = MessageBox.Show("¿Desea determinar las unidades lógicos?","Ejemplo", MessageBoxButtons.YesNo, MessageBoxIcon.Question);

if (resultado == DialogResult.Yes){

string[] discosLogicos = Environment.GetLogicalDrives();string discos = "";

foreach(string disco in discosLogicos){

discos += disco + "\n";}

MessageBox.Show(discos, "Unidades lógicas");}

}}

}

(En construcción...)

www.pedrov.info

176