Captulo 6

ELEMENTOS DE INTERFAZ GRAFICA

WindowsFors
Los programas de computador modernos, al menos en un alto porcentaje, a los que se
enfrenta el usuario se caracterizan por un aspecto en comn: ponen a su disposicin
una o varias ventanas que le permiten recibir o mostrar los datos que se procesan en el
computador. Est caracterstica es la que a permitido que ms personas vean al
computador como una erramienta de trabajo casi indispensable en ms ! ms tareas
que deben realizar en su vida cotidiana, sacndolo del uso e"clusivo de unos pocos !
llevndolo a formar parte de la vida misma de los abitantes del siglo ##$.
%ero, lo que realmente a facilitado el uso del computador no an sido las ventanas
como tal, sino el dise&o de las mismas inclu!endo unos elementos bsicos que o! en
da se an convertido en prcticamente un estndar del desarrollo de las interfaces
grficas de usuario. Los botones de comando, las cajas de te"to, las listas desplegables,
las barras de erramientas, las barras de desplazamiento, los mens, ! mucos otros
elementos son parte indispensable en cualquier programa de computador que el usuario
busca le sea til para sus objetivos. 'o! en da al usuario de aplicaciones de soft(are
no le interesa en que sistema operativo funcionen estas, ! menos en que lenguaje de
programacin a!an sido desarrolladas, siempre ! cuando pongan a su disposicin los
elementos bsicos que )l reconoce, de tal manera que le permitan acceder a las
funciones en la misma forma como lo acen desde las aplicaciones ms elementales
asta las ms sofisticadas.
*unque el objetivo esencial de un programa de computador es la funcionalidad que
debe prestar al usuario, ! no la forma como se a!a desarrollado, para los
programadores si es de especial cuidado el manejo de los componentes grficos que se
van a utilizar, por que un mal uso de estos puede ecar por la borda todo el trabajo de
ingeniera de soft(are aplicado en el momento de su desarrollo. +in embargo, dado
que la ma!ora de aplicaciones requieren del uso de un gran nmero de elementos
grficos, su manejo en lo que respecta a la programacin puede resultar demasiado
complejo ! dispendioso al tener que manipular mucos detalles en forma repetitiva !
precisa, lo cual consume una gran cantidad de energa ! tiempo en esta fase del
desarrollo. %or ejemplo, uno de los aspectos que puede resultar ms complejo para un
programador es la ubicacin de los componentes en varias ventanas, que le obligan a
memorizar diferentes coordenadas o realizar clculos que en la ma!ora de los casos,
aunque importantes en el campo de la presentacin, resultan intrascendentes para la
funcionalidad misma del programa que se est desarrollando.
Los entornos de desarrollo integrado
La solucin dada por la informtica moderna, al problema de la programacin con
componentes de interfaz grfica, an sido los $,E -integrated development
environment, entornos de desarrollo integrado., que le permiten al programador
centrarse en la funcionalidad misma del programa ms que en como acer funcionar
cada pieza que se va a utilizar en su construccin. Estos $,E son programas de
computador que ponen a disposicin del programador un conjunto de erramientas de
tipo visual que acen ms rpida la tarea de programacin en cualquier lenguaje. Entre
CAPITULO 6 PROGRAMACION CON C#
estas erramientas se destacan los dise&adores de interfaces grficas de usuario, que
son algo as como plantillas que permiten dibujar ! establecer las caractersticas de los
componentes grficos utilizando el puntero del ratn, mientras el $,E genera
internamente el respectivo cdigo de programacin, ! el sistema denominado
IntelliSense, que es un a!udante de escritura de cdigo que le evita al programador
tener que memorizar una gran cantidad de nombres ! palabras clave propias del
lenguaje de programacin ! del marco de trabajo donde se este desarrollando, aciendo
ms rpida la codificacin de los algoritmos.
Figura 6.1: Sistema IntelliSense mostrado por SharpDevelop
Entre los entornos de desarrollo integrado ms populares ! e"itosos que e"isten
actualmente para la programacin con /0 en .1E2 ! 3ono, estn 4isual +tudio .1E2,
+arp,evelop ! 3ono,evelop. 4isual +tudio .1E2 es un soft(are comercial cu!os
costos dependen de la versin que desee adquirir el desarrollador, mientras que
+arp,evelop ! 3onodevelop son 5pen+ource, ! se pueden descargar libremente
desde las pginas de sus respectivos desarrolladores.
*unque los $,E son de gran a!uda en el proceso de desarrollo de aplicaciones en
cualquier nivel, ! le permiten al programador centrarse en el objetivo mismo del
programa que est desarrollando, presentan un grave inconveniente, ! es que ocultan
mucos aspectos importantes de la arquitectura de una aplicacin. En consecuencia el
proceso de programacin puede volverse mecnico ! mucas veces carente de sentido
lgico si no se tiene un fundamento claro de la estructura del lenguaje de programacin
! como funciona el frame(or6 de desarrollo, para nuestro caso /0 ! .1E2. Esta
dificultad es la que ace que mucos programadores se sientan cmodos trabajando
con un $,E ! un frame(or6 determinado, pero les cueste trabajo acer lo mismo, !
con el mismo lenguaje de programacin, en un frame(or6 diferente. *dems, el eco
de no tener bien claros los fundamentos, va a complicar muco la posibilidad de
abordar t)cnicas avanzadas de programacin ! sacar el m"imo proveco al trabajo
como desarrollador.
En este curso de programacin con /0, se utilizar +arp,evelop como entorno de
desarrollo, pero no es el objetivo ense&ar su manejo ni muco menos su
funcionamiento, sino ms bien aprovecar su funcionalidad para acer ms rpido el
trabajo de programacin, liberando al lector de algunas tareas repetitivas. $gual se
sugiere que el lector dedique un poco de tiempo a analizar ! entender el cdigo
generado por el $,E para cada uno de los ejemplos antes de continuar con la lectura.
En la tarea de comprender algunos conceptos de programacin ! el funcionamiento de
los elementos del marco de desarrollo, a veces es mejor desarrollar los ejemplos sin la
a!uda de algunos asistentes del $,E. %or ejemplo, en las primeras etapas de la
programacin con componentes de interfaz grfica, cone"in con bases de datos o
procesos relacionados con la impresin o salida de datos, el lector primeramente
www.pedrov.info
160
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
debera identificar a plenitud los detalles de bajo nivel relacionados con el cdigo que
sustenta tales funciones ! luego determinar la validez del uso de los respectivos
asistentes. *dems, cuando se a entendido plenamente la lgica ! estructura del
lenguaje de programacin, algunos asistentes del $,E pasan a segundo plano ! sus
funciones se comprenden fcilmente sin necesidad de aberlos estudiado en forma
e"clusiva.
SharpDevelop
+arp,evelop es un $,E libre desarrollado inicialmente para programar con /0, pero
en las ltimas versiones tambi)n inclu!e la posibilidad de acerlo con 47.1E2, 7oo,
80 ! %!ton, entre otros, en pro!ectos que utilizan el marco de trabajo 3icrosoft. 1E2
o 3ono. 9 un aspecto que lo ace verdaderamente interesante ! til es que se trata de
un pro!ecto de cdigo abierto, ! se puede descargar tanto el cdigo fuente como los
ejecutables desde la pgina de sus desarrolladores, http://www.icsharpcode.net.
/omo cualquier otro programa de :indo(s, se descarga el instalador de
+arp,evelop ! se instala sin ma!ores problemas. Las ltimas versiones se ejecutan
sobre el 8rame(or6 ;.< o superior de .1E2, as que se deber tener instalado primero
este componente para que las cosas funcionen bien. *dicional, se sugiere descargar el
6it de desarrollo de soft(are -SDK. de 3icrosoft .1E2 8rame(or6 =.< -">?. o
superior, desde la pgina de 3icrosoft, para de esta manera poder contar con la
documentacin necesaria de los componentes de .1E2, a trav)s de los comandos de su
men *!uda.
Ventanas del IDE
Figura 6.2: Ventana principal de SharpDevelop, la cual muestra la pgina
de inicio con un listado de las soluciones que se han desarrollado.
La primera vez que se ejecuta +arp,evelop el entorno mostrar un listado de las
ltimas soluciones desarrolladas ! le pedir que se abra una solucin e"istente o inicie
una nueva. @na solucin es un grupo formado por uno o varios pro!ectos de
desarrollo, los cuales pueden ser independientes unos de otros, pero que el
programador puede manipularlos para establecer relaciones directas entre ellos
pedrov.cs@hotmail.com
161
CAPITULO 6 PROGRAMACION CON C#
aprovecando las erramientas que le ofrece el entorno de desarrollo. /ada proyecto, a
su vez, es el conjunto de elementos que permiten desarrollar un ensamblado !
generalmente esta constituido por varios arcivos que se guardan en un directorio con
el nombre del pro!ecto. ,e esta manera, dentro del directorio que define la solucin se
ubican uno o varios subdirectorios que corresponden a cada uno de los pro!ectos que
la constitu!en.
/uando se inicia una nueva solucin, el entorno muestra el cuadro de dialogo !ro"#$to
nu#%o, que le permite al programador establecer el tipo de aplicacin que va a
desarrollar, el lenguaje que va a utilizar en su programacin ! el frame(or6 sobre el
cual se va a trabajar. El nombre que se asigne al primer pro!ecto ser el nombre que
asuma la solucin, aunque este valor puede cambiarse en la caja de te"to Nombre de la
solucin.
Figura 6.3: Cuadro de dialogo Proyecto nuevo que permite definir el proyecto que se va
a desarrollar, sus caractersticas y el lengua!e de programaci"n que se va a utili#ar
En el caso del frame(or6 .1E2, cualquier versin que se encuentre instalada se
configura automticamente para ofrecerse como una posibilidad del marco de
trabajo que desee seleccionar el programador. %ero no sucede lo mismo, al
menos asta la versin ;.< de +arp,evelop, con el frame(or6 3ono, que debe
configurarse manualmente.
@na vez definido el pro!ecto que se va a desarrollar, se ingresa al entorno de desarrollo
que est constituido por un grupo de ventanas ! barras de erramientas que buscan ser
el a!udante perfecto que el programador va a necesitar en su trabajo. Enseguida
revisaremos brevemente el propsito de cada uno de estos elementos, teniendo en
cuenta que para mostrar cualquiera de ellos se debe utilizar el men 4er. 2ambi)n se
podr abrir mucos de ellos utilizando un acceso directo de teclado o pulsando sobre
alguno de los iconos contenidos en la barra de erramientas principal, como se indicar
a continuacin.
www.pedrov.info
162
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
La ventana de pro!ectos proporciona informacin de los componentes que
conforman la solucin en desarrollo, mostrando los pro!ectos que la componen !
sus respectivos componentes. /ada pro!ecto est constituido por los ensamblados
de referencia que se enlazan para acceder a los componentes de soft(are tanto del
frame(or6 .1E2 como de los componentes desarrollados por el mismo
programador o por terceros, ! por los arcivos que guardan el cdigo de
programacin, las propiedades ! los recursos. %ara acceder a esta ventana podr
utilizarse el comando %ro!ectos del men 4er o la combinacin de teclas
/2ALB*L2BL.
Dise$ador de formularios
Ventana de propiedades
Ventana de proyectos
%arra de herramientas principal
Figura 6.3: &ntorno de desarrollo de SharpDevelop mostrando algunas de sus ventanas ms importantes
El programador podr utilizar la ventana del dise&ador de formularios para dise&ar
la interfaz de usuario de aquellos pro!ectos que se basen en estos componentes,
utilizando :indo(s8orms o :eb8orms, principalmente. /ada pro!ecto puede
estar conformado por uno o ms formularios ! para cada uno de ellos e"istir un
dise&ador de formularios independiente. 7asndose en este dise&o, el generador de
cdigo escribir en un arcivo el cdigo necesario para mostrar la ventana tal
como la dibuj el programador. /omo !a se menciono en el captulo anterior, este
dise&ador de formularios genera una clase para cada formulario ! la guarda en dos
arcivos. En uno de los arcivos se almacenar el cdigo que introduzca el
programador para acer funcionar los diferentes componentes ! en el otro se
pedrov.cs@hotmail.com
163
CAPITULO 6 PROGRAMACION CON C#
guarda el cdigo que se corresponde con el dise&o grfico de la ventana. Este
ltimo arcivo se nombra con el nombre de la clase seguido de la palabra
Designer.
La ventana de erramientas inclu!e un conjunto de objetos que se podrn
introducir en un formulario o en cualquier otro componente grfico para dise&ar la
interfaz de usuario del pro!ecto en desarrollo. 3ediante etiquetas se organizan los
diferentes componentes grficos que +arp,evelop enlaza automticamente,
empezando en aquellos provistos por el frame(or6 .1E2. Los componentes
:indo(s8orms corresponden a los controles de interfaz grafica estndar que se
utilizan en la ma!ora de aplicaciones. Los componentes ,ata son controles
grficos que permiten realizar la configuracin ! el acceso a bases de datos. Los
controles incluidos en /omponents permiten configurar algunas funciones del
sistema operativo, tales como pulsos de tiempo, cone"in a los puertos, a!udas o
envi de mensajes de te"to al usuario. Los componentes %rinting son controles que
permiten generar los procesos de impresin. 9 finalmente en la etiqueta
/omponentes personalizados se inclu!en todos aquellos componentes
desarrollados por el programador ! que no acen parte del frame(or6 .1E2. %ara
acceder a la ventana de erramientas se utiliza el comando 'erramientas del men
4er o la combinacin de teclas /2ALB*L2B#.
El Editor de cdigo o ventana 8uente permite escribir el cdigo que determina el
comportamiento de la aplicacin en general. /ada arcivo de cdigo abre su
propio editor de cdigo. %ara acceder al editor de cdigo se selecciona el arcivo
que se va a editar en la ventana %ro!ectos. En el caso especifico de los formularios,
adems del acceso normal al editor de cdigo, se puede acer mediante una
pesta&a que aparece en la parte inferior del dise&ador o aciendo doble clic sobre
el dise&o de la ventana.
La ventana propiedades lista todas las propiedades ! eventos que acen parte de un
control que se encuentre seleccionado en el dise&ador de formularios. %ara el caso
de las propiedades proporciona la posibilidad de modificar sus valores !a sea
escribi)ndolos o seleccionndolos de alguna coleccin previamente establecida. En
el caso de los eventos, el programador podr definir o seleccionar el nombre del
m)todo que controlar uno o ms eventos que agan parte del control
seleccionado. El $,E se encarga de asignar el cdigo de delegacin ! establecer la
firma del m)todo controlador. %ara acceder a la ventana de %ropiedades se utiliza
el comando %ropiedades del men 4er o pulsando la tecla 8C.
Las diferentes clases que conforman un pro!ecto, as como los diferentes
elementos que las conforman se pueden visualizar por medio de la ventana /lases.
* esta ventana se accede mediante el comando /lases del men 4er o la
combinacin de teclas /2ALB+'$82B/.
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
compilacin realizados, en especial los mensajes de error generados por el
compilador.
Las ventanas de a!uda muestran la a!uda incluida en la documentacin de
+arp,evelop ! tambi)n de los componentes del frame(or6 de desarrollo cuando
se a instalado el +,D de .1E2. %ara acceder a estas ventanas se utilizan los
comandos del men *!uda.
La ma!ora de ventanas que se acaban de describir se pueden fijar, cambiar de posicin
o cerrar, de acuerdo a los gustos e intereses del programador. *lgunas ventanas que no
se an descrito en esta seccin guardan una relacin directa con conceptos propios de
la programacin en .1E2, o su funcionalidad se muestra cuando se realiza la
compilacin de los ensamblados, ! por esa razn se e"plicar su utilidad en el
www.pedrov.info
164
Figura 6.4: Ventana
de herramientas para
el dise$o de las
interf aces grf icas.
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
momento que se asuman dicas temticas. 5tros elementos como mens ! barras de
erramientas se entendern mejor con el desarrollo de ejemplos de programacin que
muestren en forma prctica su utilidad.
Organizai!n de arhivos
,esde el punto de vista de la codificacin, una aplicacin real de :indo(s8orms o
:eb8orms, desarrollada con /0, est conformada por clases ! estas, en los $,E, se
agrupan en pro!ectos. * diferencia de su principal antecesor, /BB, el lenguaje /0 est
totalmente orientado a objetos ! por lo tanto no soporta fragmentos de cdigo que no
agan parte de una clase.
*unque se podran incluir todas las clases que conforman un programa en un nico
arcivo de cdigo, esta no es una prctica recomendable !a que no e"iste aplicacin de
soft(are que en un futuro cercano o lejano no necesite revisarse, corregirse o
modificarse, ! una pobre organizacin en la codificacin de la misma puede traer
mucos dolores de cabeza a sus programadores ! encargados del mantenimiento. %or
esta ! otras razones ms, se recomienda colocar cada clase en un arcivo diferente, de
tal manera que sea fcilmente identificable, tanto al visualizarse desde el interior del
entorno de desarrollo como cuando sea necesario manipular sus arcivos desde el
e"terior.
2oda la organizacin de los arcivos que conforman un pro!ecto de +arp,evelop se
realiza por medio de la ventana %ro!ectos ! el men principal %ro!ecto. En el siguiente
ejemplo vamos a desarrollar una peque&a aplicacin de :indo(s8orms basada en dos
clases ! que ace uso de los comandos del men %ro!ecto.
E"e#plo 6.1 'ola SharpDevelop
El programa que se desarrollar, parte de un pro!ecto vaco ! para comprender la
forma como +arp,evelop organiza los arcivos, se configurar asta convertirlo en
un pro!ecto de aplicacin al estilo de :indo(s8orms.
$nicie +arp,evelop ! cree una nueva solucin aciendo clic en el botn 1ueva
solucin de la ventana %gina de inicio o mediante el comando 1uevo del men
*rcivo. En la ventana %ro!ecto 1uevo, en la seccin /ategoras aga clic sobre el
nodo /0 ! en la seccin %lantillas seleccione %ro!ecto en 7lanco. %ara continuar con
la secuencia planteada en los anteriores captulos asigne Ejemplo?E como el nombre
del pro!ecto. 8inalmente aga clic en el botn /rear.
'eco lo anterior, se crea una solucin con un nico pro!ecto. $nicialmente el pro!ecto
est constituido nicamente por una o dos referencias que apuntan a +!stem !
+!stem.#ml. Este es el primer gran aporte que le ace un $,E como +arp,evelop al
trabajo del programador, liberndolo de la tarea de tener que informarle al compilador
sobre los recursos que se deben enlazar cada vez que se aga el proceso de generacin
del ensamblado.
/omo el objetivo de este ejemplo es construir un ejecutable :indo(s8orms, lo
primero que se debe acer es establecer una referencia a +!stem.:indo(s.8orms. %ara
esto, en la ventana %ro!ectos seleccione el nombre del pro!ecto ! aga clic sobre el
comando *gregar Aeferencia del men %ro!ecto.
En la ventana *gregar Aeferencia se muestran, en las pesta&as superiores, al menos
cuatro tipos de referencias que pueden establecerse. En la fica F*/ se inclu!en todas
las referencias que apuntan a componentes incluidos en ensamblados registrados como
elementos del frame(or6 .1E2. En las fica %ro!ectos se inclu!en las referencias que
pueden acerse a otros pro!ectos incluidos en la solucin que se esta trabajando
actualmente. El 4isor de Ensamblados es una forma general de acceder a cualquier
ensamblado que !a se encuentre compilado. La fica /53 permite referenciar
pedrov.cs@hotmail.com
165
CAPITULO 6 PROGRAMACION CON C#
componentes /53 que a!an sido desarrollados por fuera de la infraestructura .1E2 o
anterior a la aparicin de esta tecnologa. /on respecto a esta ltima opcin, es
importante dejar bien claro que aunque e"iste como tal, ser mejor evitar su uso, !a
que los componentes /53 son elementos totalmente e"tra&os a la infraestructura que
ofrece el frame(or6 .1E2. +i el programador aba desarrollado componentes /53 !
los necesita en su aplicacin, ser mejor que va!a pensando en desarrollar la versin
.1E2 de los mismos.
%ara continuar, aga doble clic sobre las referencias +!stem.:indo(s.8orms !
+!stem.,ra(ing, ! luego sobre el botn *ceptar.
Figura 6.$: (a ventana )gregar *eferencia permite esta+lecer una o varias
referencias a ensam+lados o componentes C,-.
%ara comenzar con la codificacin vamos a agregar una primera clase al pro!ecto.
3anteniendo seleccionado el pro!ecto, elija el comando *gregar, 1uevo elemento, del
men %ro!ecto ! en la categora /0 seleccione la plantilla /lase. * esta clase asgnele
el nombre %rograma.cs. *l acer clic sobre el botn /rear aparece la plantilla de la
clase en el editor de cdigo. Esta clase %rograma solo tendr como objetivo establecer
el punto de entrada para el ejecutable de la aplicacin.
using System;
namespace Ejemplo61
{
/// <summary>
/// Descripcin de Programa.
/// </summary>
public class Programa
{
public Programa(
www.pedrov.info
166
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
{
!
!
!
*ntes de editar la clase %rograma, agregue la clase que contendr la ventana que
necesita la aplicacin. *l igual que la anterior, por medio del men %ro!ecto agregue
una nueva clase al pro!ecto ! llmela /aja3ensajes.cs. *l acer clic en el botn /rear
se genera la plantilla de la nueva clase. Edite este ltimo arcivo de clase en la forma
como se muestra en el siguiente bloque de cdigo:
using System;
using System."indo#s.$orms;
using System.Dra#ing;
namespace Ejemplo61
{
public class %aja&ensaje ' $orm
{
public CajaMensaje(
{
// (lamar el m)todo encargado de iniciali*ar la +entana
InicializarComponentes(;
!
+oid InicializarComponentes(
{
this.,ac-%olor . %olor.,lac-;
this.&inimi*e,o/ . false;
this.&a/imi*e,o/ . false;
this."idt0 . 122;
this.3eig0t . 42;
this.5e/t . 6,ien+enido a %76;
// %ontrolar el e+ento Paint del 8orm9lario
this.Paint :. new PaintEventHandler(%aja&ensajePaint;
!
+oid CajaMensajePaint(o;ject emisor< PaintE+ent=rgs e
{
// Esta;lece 9na 89ente
$ont 89ente . new ont(65imes6< >2< $ontStyle.,old;
// De8inir 9n rect?ng9lo para 8ijar el te/to
@ectangle$ c9adro5e/to .
new !ectangle(2< 2< this."idt0< this.3eig0t;
// De8ine 9n 8ormato para asignar al te/to
String$ormat 8ormato%adena . new "tringormat(;
8ormato%adena.=lignment . String=lignment.%enter;
// Di;9ja 9na cadena de te/to en el c9erpo del 8orm9lario
e.Arap0ics.#raw"tring(6B3ola S0arpDe+elop...C6< 89ente<
,r9s0es.Aold< c9adro5e/to< 8ormato%adena;
!
!
!
Esta lista la ventana que mostrar la aplicacin cuando se ejecute. %or aora este solo
es un ejercicio de codificacin en el que se comprueba la eficacia de +arp,evelop
como a!udante para escribir cdigo. En resumen, la clase se deriva de 8orm, establece
valores para algunas de sus propiedades ! controla el evento %aint que se encargar de
dibujar en el cuerpo del formulario un mensaje de bienvenida. Los detalles de su
pedrov.cs@hotmail.com
167
CAPITULO 6 PROGRAMACION CON C#
implementacin se analizarn con ms detenimiento cuando se trabaje con trazado de
grficos en un captulo posterior.
%ara completar el desarrollo del pro!ecto es necesario establecer el punto de entrada
del ejecutable, ! para ello editamos la clase %rograma como se muestra enseguida:
using System;
namespace Ejemplo61
{
public class Programa
{
static +oid Main(
{
System."indo#s.$orms.=pplication.!un(new CajaMensaje(;
!
!
!

%ara compilar la aplicacin se utiliza el comando Fenerar solucin del men Fenerar,
! para ejecutarla, en el caso de programas ejecutables, se utiliza el comando Ejecutar
del men ,epurar. El nombre del ensamblado generado corresponde al nombre del
pro!ecto, Ejemplo?E.e"e, ! se guarda en el subdirectorio bin.
*l ejecutar la aplicacin se observa que lo ace sobre una consola de comandos. La
razn es simple: el compilador por defecto genera una ejecutable de consola. %ara
informarle al compilador que se desea generar un ejecutable que se ejcute totalmente
dentro del sistema grfico de :indo(s, se debe acer por medio de la ventana
5pciones de pro!ecto que se muestra a trav)s del men %ro!ecto. En esta ventana, el
programador puede asignar o modificar todas las opciones relacionadas con el
pro!ecto en la fica *plicacin, en especial el tipo de salida, ! asignar el valor
*plicacin de :indo(s.
5tro aspecto importante en la ventana 5pciones de pro!ecto son los datos relacionados
con la compilacin del ensamblado que se encuentran en la fica Fenerar. *qu se
puede establecer la configuracin de la compilacin definitiva, ,ebug o Aelease, ! la
plataforma donde se va a ejecutar el ensamblado. La configuracin ,ebug inclu!e en
el ensamblado una gran cantidad de informacin adicional relacionada con su
estructura para permitirle al depurador controlar la ejecucin e informar sobre el estado
de la misma. Esta caracterstica ace que la ejecucin de este tipo de ensamblados no
sea la ptima, por lo cual se recomienda utilizarla nicamente para tareas de
depuracin. Los ensamblados definitivos deben compilarse en la configuracin
Aelease.
E"iste un detalle importante que asta aora no se aba mencionado. 2odos los
ejemplos que se an desarrollado cuentan con un nico punto de entrada. +in embargo,
esto no significa que tenga que ser nico en todas las aplicaciones, !a que cada clase
que conforma la aplicacin ejecutable puede implementar al menos un punto de
entrada. %ero dada esta situacin es necesario informar al compilador cual ser el punto
de entrada que se va a utilizar en la ejecucin de la aplicacin. %ara establecer este
dato, puede utilizar la ventana 5pciones de pro!ecto ! en la fica *plicacin, en la
entrada 5bjeto $nicial, establecer el punto de entrada que se desea utilizar.
El dise%ador de &or#ularios
El dise&ador de formularios es el elemento que permite generar cdigo basndose en
procesos grficos. El programador dibuja, modifica ! asigna valores a los controles que
necesita incluir en un formulario !, en el caso de las aplicaciones :indo(s8orms, el
www.pedrov.info
168
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
dise&ador se encarga de escribir el cdigo necesario para construir la clase que permite
generar la ventana que se deriva de ella.
/ada uno de los formularios que se generan con el dise&ador de formularios es una
clase que por cuestiones de organizacin se guarda en dos arcivos. En uno de ellos se
coloca todo el cdigo generado automticamente por el dise&ador, resultado de los
procesos grficos de construccin de la ventana, ! se nombra con la denominacin
NombreClase.,esigner.cs. En el otro se coloca todo el cdigo que debe escribir el
programador para dar funcionalidad a la ventana, ! se nombra con la denominacin
NombreClase.cs.
/onstruida la ventana, bien se podra decir que el programador pasa a otro nivel de
abstraccin, en su labor de programacin, que algunos autores denominan
programacin 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 cdigo
necesario que controle algunos de los eventos de dicos controles.
E"e#plo 6.2 Dise$o de un programa aritm.tico
En este ejemplo vamos a construir un programa que se encarga de recibir dos valores
num)ricos ! realiza con ellos algunas operaciones aritm)ticas.
$nicie un nuevo pro!ecto con la categora *plicaciones de :indo(s, utilizando la
plantilla *plicacin :indo(s ! denomnelo Ejemplo?=. 5bservar que se genera un
formulario vaco ! en la ventana %ro!ectos, entre otros, aparecen dos clases:
%rogram.cs ! 3ain8orm.cs. La primera contiene el punto de inicio de la aplicacin,
mientras que la segunda contiene la estructura que genera el formulario.
Estamos listos para comenzar a programar. %ara crear uno o ms controles en la
superficie del formulario se debe activar la barra de erramientas con el comando
'erramientas del men 4er ! seleccionar el tipo de controles :indo(s 8orms.
*rrastre desde esta barra cuatro controles Label, tres controles 2e"t7o" ! cinco
controles 7utton.

Figura 6.6. Dise$ador de formularios que muestra un formulario en construcci"n
%ara modificar las propiedades de un control se selecciona con el puntero del ratn !
de ser necesario se presiona la tecla 8C, o se selecciona el comando %ropiedades del
pedrov.cs@hotmail.com
169
CAPITULO 6 PROGRAMACION CON C#
men 4er, para mostrar la ventana %ropiedades. En esta ventana se modifican los
valores de las propiedades que se consideren necesarias para cumplir con los objetivos
de la aplicacin.
$nicialmente, asigne a la propiedad 2e"t de los controles Label los valores Nmero,
Nmero ! !esultado, respectivamente. * estos controles no vamos a modificar su
propiedad 1ame por cuanto no se requerir acer referencia a ellos en la codificacin.
Los dems controles si necesitan tener un nombre significativo para los intereses del
programador !a que se utilizarn en el proceso de codificacin, ! por lo tanto es
necesario recurrir a algn tipo de nomenclatura estndar que permita identificarlos
fcilmente en una revisin posterior. /omos !a se dijo en un captulo anterior la forma
sugerida por .1E2 para el nombramiento de variables de objeto, utiliza cadenas de
te"to que comienzan por un nombre que determina el tipo al cual pertenece dico
objeto seguido de una cadena que identifica la funcionalidad del mismo dentro de la
aplicacin, utilizando la nomenclatura camel. En los $,E como +arp,evelop se
puede establecer el nombre de la variable objeto que identifica a un control mediante la
propiedad 1ame del mismo. *unque esta caracterstica puede manipularse por parte
del programador ! un control puede ser perfectamente definido por un nombre de
variable objeto diferente al valor de la propiedad 1ame, pero esta prctica no es
recomendable por que puede conllevar a confusiones en el momento de acer una
revisin de cdigo.
En la tabla se muestran los valores de las propiedades 1ame ! 2e"t de cada uno de los
controles.
'ipo (ropiedad Valor
/e0t%o0 1ame
/e0t
te0t1umero2
3
1ame
/e0t
te0t1umero4
3
1ame
/e0t
*ead,nly
te0t*esultado
3
/rue
%utton 1ame
/e0t
+uttonSumar
Sumar
1ame
/e0t
+utton*estar
*estar
1ame
/e0t
+utton-ultiplicar
-ultiplicar
1ame
/e0t
+uttonDividir
Dividir
1ame
/e0t
+uttonCerrar
Cerrar
%ara dar funcionalidad a los controles vamos controlar los eventos /lic6 de cada uno
de los botones de comando. %ara definir el m)todo que se encargar de controlar un
evento se utiliza la ventana %ropiedades, aciendo clic sobre el icono eventos.
+eleccione el botn de comando +umar, active la ventana %ropiedades, presionando la
tecla 8C, ! aga clic sobre el icono Eventos de esta ventana. El listado que aparece,
corresponde a todos los eventos que puede generar el control seleccionado. +eleccione
con el puntero del ratn el evento /lic6 ! asigne el nombre del m)todo que lo
controlar, en este caso 7utton+umar/lic6. Aecuerde que el estilo .1E2 sugiere que
los m)todos se nombren con letra inicial ma!scula, ! en el caso de aquellos que
www.pedrov.info
170
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
controlan eventos debe acerse iniciando con el nombre del control seguido de una
cadena equivalente al nombre del evento controlado.
/uando se a terminado de establecer el nombre del m)todo controlador ! se presiona
la tecla E12EA o se ace doble clic sobre el nombre del evento, se escribe en el
arcivo ,esigner la lnea de cdigo que establece la delegacin,
this.;9ttonS9mar.%lic- :.
new System.EventHandler(,9ttonS9mar%lic-;
! en el arcivo de codificacin manual se escribe la definicin del m)todo,
+oid $utton"umarClic%(o;ject sender< E+ent=rgs e
{
!
%ara eliminar un controlador de un determinado evento se debe utilizar la misma
ventana de propiedades. +e selecciona el control deseado ! se borra el nombre del
m)todo que se desee desconectar de un determinado evento. Esto borra la delegacin
que se encontraba en el arcivo ,esigner, pero el m)todo se mantiene, ! si desea
quitarse debe acerse manualmente.
Establezca los m)todos controladores del evento /lic6 para cada uno de los restantes
botones de comando, asignndoles los nombres 7uttonAestar/lic6,
7utton3ultiplicar/lic6, 7utton,ividir/lic6 ! 7utton/errar/lic6, respectivamente.
La funcionalidad de los botones de operacin la establece la siguiente codificacin:
+oid $utton"umarClic%(o;ject sender< E+ent=rgs e
{
int n9mero1 . %on+ert.&oInt'((te/tD9mero1.5e/t;
int n9mero> . %on+ert.&oInt'((te/tD9mero>.5e/t;
int res9ltado . n9mero1 : n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!
+oid $utton!estarClic%(o;ject sender< E+ent=rgs e
{
int n9mero1 . %on+ert.&oInt'((te/tD9mero1.5e/t;
int n9mero> . %on+ert.&oInt'((te/tD9mero>.5e/t;
int res9ltado . n9mero1 E n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!
+oid $uttonMultiplicarClic%(o;ject sender< E+ent=rgs e
{
int n9mero1 . %on+ert.&oInt'((te/tD9mero1.5e/t;
int n9mero> . %on+ert.&oInt'((te/tD9mero>.5e/t;
int res9ltado . n9mero1 F n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!
+oid $utton#ividirClic%(o;ject sender< E+ent=rgs e
{
double n9mero1 . %on+ert.&o#ouble(te/tD9mero1.5e/t;
double n9mero> . %on+ert.&o#ouble(te/tD9mero>.5e/t;
double res9ltado . 2;
if (n9mero1 C. 2
{
pedrov.cs@hotmail.com
171
Figura 6.). Ventana de
propiedades para definir los
controladores de evento.
CAPITULO 6 PROGRAMACION CON C#
res9ltado . n9mero1 / n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!
else
&essage,o/."how(6Di+isin por cero...6< 6Error6<
&essage,o/,9ttons.GH< &essage,o/Icon.Error;
!
El botn /errar se encarga de finalizar la ejecucin de la aplicacin. En este caso basta
con cerrar la ventana activa mediante su m)todo /lose ! la aplicacin saldr del bucle
de ejecucin.
+oid $uttonCerrarClic%(o;ject sender< E+ent=rgs e
{
this.Close(;
!
En definitiva as es como queda el arcivo que contiene la parte de la clase que da
funcionalidad a la ventana.
using System;
using System.%ollections.Aeneric;
using System.Dra#ing;
using System."indo#s.$orms;
namespace Ejemplo6>
{
/// <summary>
/// Permite de8inir 9na +entana
/// </summary>
public partial class &ain$orm ' $orm
{
public Mainorm(
{
InitializeComponent(;
!
+oid $utton"umarClic%(o;ject sender< E+ent=rgs e
{
int n9mero1 . %on+ert.&oInt'((te/tD9mero1.5e/t;
int n9mero> . %on+ert.&oInt'((te/tD9mero>.5e/t;
int res9ltado . n9mero1 : n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!
+oid $utton!estarClic%(o;ject sender< E+ent=rgs e
{
int n9mero1 . %on+ert.&oInt'((te/tD9mero1.5e/t;
int n9mero> . %on+ert.&oInt'((te/tD9mero>.5e/t;
int res9ltado . n9mero1 E n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!

www.pedrov.info
172
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
+oid $uttonMultiplicarClic%(o;ject sender< E+ent=rgs e
{
int n9mero1 . %on+ert.&oInt'((te/tD9mero1.5e/t;
int n9mero> . %on+ert.&oInt'((te/tD9mero>.5e/t;
int res9ltado . n9mero1 F n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!
+oid $utton#ividirClic%(o;ject sender< E+ent=rgs e
{
double n9mero1 . %on+ert.&o#ouble(te/tD9mero1.5e/t;
double n9mero> . %on+ert.&o#ouble(te/tD9mero>.5e/t;
double res9ltado . 2;
if (n9mero1 C. 2
{
res9ltado . n9mero1 / n9mero>;
te/t@es9ltado.5e/t . res9ltado.&o"tring(;
!
else
&essage,o/."how(6Di+isin por cero...6< 6Error6<
&essage,o/,9ttons.GH< &essage,o/Icon.Error;
!
+oid $uttonCerrarClic%(o;ject sender< E+ent=rgs e
{
this.Close(;
!
!
!
Llegado a este punto es importante que el lector revise detenidamente cada uno de los
arcivos de cdigo que se an generado !, con base en lo estudiado en captulos
anteriores, dedique un poco de tiempo a comprender cual es el trabajo realizado por
parte del dise&ador de formularios ! que funcin desempe&a cada una de las lneas
escritas.
El desarrollo de algunas actividades de programacin en las secciones siguientes
permitir identificar otras funcionalidades de +arp,evelop que lo convierten en un
potente $,E de desarrollo.
La a"a de #ensa"es
La caja de mensajes es un componente predise&ado cu!a funcin bsica es establecer
una comunicacin instantnea con el usuario para logar una interaccin efectiva con la
aplicacin. En los captulos anteriores !a se an desarrollado varios ejemplos que
utilizan cajas de mensajes, pero ace falta una descripcin un poco ms detallada de
este componente grfico para permitirle al programador sacar el m"imo proveco de
)l.
Las diferentes versiones de la caja de mensajes son implementadas por la clase
3essage7o" que se encuentra definida en el espaci de nombres
+!stem.:indo(s.8orms. Esta clase se deriva directamente de la clase base 5bject !,
por tanto, ereda los m)todos implementados en 5bject. El nico m)todo que
implementa 3essage7o" es Show ! se trata de un m)todo esttico, lo cual significa
que para llamarlo debe escribirse antecedido del nombre de la clase,
pedrov.cs@hotmail.com
173
CAPITULO 6 PROGRAMACION CON C#
&essage,o/.S0o#(...;
El m)todo +o( est sobrecargado ! presenta al menos =E versiones. En el siguiente
cuadro se muestran G versiones, que generalmente son las ms utilizadas en las
aplicaciones estndar:
So*reargas del #+todo Sho, de -essage.o/
S0o#(string
S0o#(string< string
S0o#(string< string< &essage,o/,9ttons
S0o#(string< string< &essage,o/,9ttons< &essage,o/Icon
S0o#(string< string< &essage,o/,9ttons< &essage,o/Icon<&essage,o/De8a9lt,9tton
/on el primer m)todo se muestra el mensaje dentro de una caja de mensajes sin ttulo.
En cambio con la segunda versin, mediante el segundo argumento, se puede colocar
una cadena de te"to en la barra de titulo de la caja de mensajes. Feneralmente se
coloca el nombre de la aplicacin que lanza el mensaje.
&essage,o/.S0o#(6=J9K +a 9n mensaje6< 6El programa6;
%ara establecer los botones que se desea mostrar en la caja de mensajes se utilizan las
constantes definidas por la enumeracin "essage#o$#uttons. Esta define seis
constantes, que son las siguientes:
0onstantes -essage.o/.uttons
,5
,5Cancel
)+ort*etryIgnore
6es1oCancel
6es1o
*etryCancel
%or ejemplo, para mostrar un mensaje con los botones Si ! No -para la versin de .1E2
en espa&ol. se debe acer la siguiente llamada:
&essage,o/."how(63ola m9ndo6< 6Programa6< &essage,o/,9ttons.LesDo;
La enumeracin "essage#o$Icon, correspondiente al valor del cuarto parmetro,
permite establecer un icono. Estos iconos estn definidos por las siguientes constantes:
0onstantes -essage.o/Ion
1one
'and
Stop
&rror
www.pedrov.info
174
CAPITULO 6 ELEMENTOS DE INTERFAZ GRAFICA WINDOWSFORMS
7uestion
&0clamation
8arning
)steris9
Information
/uando se muestra ms de un botn en una caja de mensajes es recomendable
establecer un botn que ser utilizado por defecto, mediante la enumeracin
"essage#o$De%ault#utton. Esta caracterstica permite el acceso rpido a dico botn
por medio del teclado, generalmente la tecla E12EA, lo cual facilita la operacin por
parte del usuario. Esto es mu! 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 ratn. Las
constantes de esta enumeracin son las siguientes:
0onstantes -essage.o/De&ault.utton
%utton2
%utton4
%utton:
+i la caja de mensajes muestra ms de un botn puede ser necesario saber cual fue el
botn que presion el usuario para cerrar la ventana, lo cual se considera como una
respuesta al mensaje. Esto se logra fcilmente !a que el m)todo +o( devuelve un
valor de tipo ,ialogAesult que puede corresponder a cualquiera de los siguientes
valores:
0onstantes -essage.o/Ion
1one
,5
Cancel
)+ort
*etry
Ignore
6es
1o
En el siguiente ejemplo se muestra el uso del m)todo +o( en algunas de sus
sobrecargas.
E"e#plo 6.3 ;nidades l"gicas del sistema
La aplicacin mostrar en pantalla las unidades de disco lgicas que se encuentran
instaladas en el computador donde se est ejecutando.
$nicie una nueva solucin :indo(s 8orms en +arp,evelop, del tipo *plicacin de
consola, ! llmela Ejemplo?;. %ara empezar, agregue una referencia a
+!stem.:indo(s.8orms mediante el comando *gregar referencia del men %ro!ecto.
pedrov.cs@hotmail.com
175
CAPITULO 6 PROGRAMACION CON C#
%ara determinar las unidades lgicas se utiliza el m)todo FetLogical,rives que
devuelve un vector string con los nombres de las unidades instaladas. 3odifique el
m)todo 3ain con el siguiente cdigo:
using System;
using System."indo#s.$orms;
namespace Ejemplo61
{
class Program
{
public static +oid Main(stringMN args
{
Dialog@es9lt res9ltado;
res9ltado . &essage,o/."how(6ODesea determinar las 9nidades lgicosP6<
6Ejemplo6< &essage,o/,9ttons.LesDo< &essage,o/Icon.Q9estion;
if (res9ltado .. Dialog@es9lt.Les
{
stringMN discos(ogicos . En+ironment.)et*ogical#rives(;
string discos . 66;
foreach(string disco in discos(ogicos
{
discos :. disco : 6Rn6;
!
&essage,o/."how(discos< 6Snidades lgicas6;
!
!
!
!
-En construccin....
www.pedrov.info
176