tema 2. diseño de formularios windows 2.1. · pdf filetema 2. diseño de...

2.1Programación .NET (II). Diseño de formularios Windows

TEMA 2. DISEÑO DE FORMULARIOS WINDOWS

2.1. CONTROLES DEL FORMULARIO

Formularios Windows

La programación de aplicaciones para Windows se basa en formularios. De

hecho, podemos decir que es la unidad básica en nuestro desarrollo. El

formulario es lo que cualquiera de nosotros identifica como “la típica ventana

de Windows”. De forma más rigurosa diremos que el formulario es un control

derivado de la clase Form (espacio de nombres System.Windows.Forms.Form).

El hecho de que las aplicaciones en Windows utilicen, en la mayoría de los

casos, estos formularios es una ventaja, puesto que siempre usaremos los

mismos métodos y propiedades para trabajar con ellos.

Veamos el aspecto de este elemento creando un nuevo proyecto de aplicación

para Windows con la ayuda de Visual Basic 2008 Express Edition.

Programación .NET (II). Diseño de formularios Windows2.2

Visual Studio nos ofrece diferentes plantillas en función del tipo de aplicación

que queramos crear. En nuestro caso vamos a crear una aplicación Windows

Forms (formularios Windows).

La aplicación de Windows Forms recién creada constará de un único elemento

llamado “Form1”. Este elemento es un control formulario.

Nuestro formulario es una ventana de Windows común y corriente. Podemos

cambiar su tamaño, minimizarla o cerrarla como cualquier ventana.

Podemos probar el funcionamiento de la aplicación en cualquier momento con

la opción "Iniciar Depuración" del menú "Depurar", pulsando sobre

en la barra de herramientas, o simplemente pulsando F5.

Los formularios y cualquier control de formulario va constar de:

Propiedades Métodos Eventos

Propiedades

Todo control tiene un conjunto de propiedades que permitirán definir ciertas

características del mismo que afectarán a su apariencia y comportamiento.


Algunas de estas propiedades son comunes a la mayoría de los controles y

otras, sin embargo, específicas de cada uno de ellos.

Las propiedades de los controles se pueden modificar desde la vista de diseño,

directamente en la ventana de propiedades, o bien, como veremos más

adelante, desde el código fuente de la aplicación (por ejemplo, añadiendo a

nuestro código ‘Form1.Text = "Mi ventana"’).

A continuación se muestran algunas de las propiedades del control formulario.

Aunque no se describan aquí todas, es buena idea investigar el funcionamiento

de las demás… Recuerda que siempre hay disponible una descripción de cada

propiedad en la parte inferior de la ventana de propiedades.

Algunas propiedades del formulario

Propiedad Descripción

NameEstablece el nombre del formulario en el

proyecto.

AcceptButtonIndica en qué botón del formulario se hace clic

cuando el usuario pulse “Enter”.

CancelButtonIndica en qué botón del formulario se hace clic

cuando el usuario pulse “Esc”.

ForeColorEstablece el color del texto que se muestre en

el formulario.

IconRuta al archivo de imagen que se mostrará

como icono en la barra de título del formulario.

TextTexto que se muestra en la barra de título del

formulario

MaximizeBoxEstablece si el formulario tendrá un botón

“Maximizar” en la barra de título.

MinimizeBoxEstablece si el formulario tendrá un botón

“Minimizar” en la barra de título.

BackColorEstablece el color de fondo del cuerpo del

formulario.


Métodos

Los métodos de cualquier objeto proveen al mismo de ciertas funcionalidades,

las cuales podrán ser utilizadas durante la ejecución de las aplicaciones.

A continuación vemos algunos métodos importantes del control formulario. Al

igual que las propiedades, es bueno profundizar e investigar otros métodos

que, llegado el caso, nos pueden ofrecer la utilidad que andamos buscando.

Eventos

Ciertas acciones sobre un control pueden generar lo que llamamos eventos.

Estos eventos se manipulan a través de sus manejadores (handler). Dicho de

otra forma, un manejador de eventos es un objeto en el que un control delega

la tarea de manipular cierto evento.

Más adelante veremos como con los manejadores de eventos podremos

programar las acciones que queramos realizar al producirse un evento concreto

(al hacer clic sobre un botón, al cargar un formulario…).

A continuación puedes ver algunos de los eventos de los formularios.

Algunos métodos del formulario

Método Descripción

Show()

Visualiza el formulario. Se puede especificar su

formulario “owner” o propietario. Si un formulario form1

es propietario de otro form2, form2 se visualizará

siempre sobre form1, aunque haya cualquier otro

formulario activo.

Focus() Establece el foco en el formulario.

Hide() Oculta el formulario al usuario.

Close() Cierra el formulario.


Veamos ahora un ejemplo del manejo de propiedades, métodos y eventos de

un formulario.

Empezamos estableciendo algunas propiedades del formulario. Para ello,

accedemos a su ventana de propiedades pulsando con el botón derecho sobre

la vista de diseño del formulario.

Algunos eventos del formulario

Evento Descripción

LoadSucede cuando el formulario se carga en

memoria, antes de llegar a visualizarse.

ActivatedSucede cuando el formulario se activa, bien por

código, bien por la acción del usuario.

GotFocusEl formulario recibe el foco. Cuando lo pierde,

sucede su complementario LostFocus.

Click

Ocurre cuando el usuario hace clic con el ratón

sobre el control. Si lo que se produce es un doble

clic entonces el evento provocado será

DoubleClick.

ResizeOcurre cuando se cambia el tamaño del

formulario.

MoveMove se produce cuando varía la posición del

formulario en la pantalla.


La ventana de propiedades se nos mostrará en la parte derecha de la pantalla.

En ella podrás modificar los valores de las propiedades de cualquier control.


Realizamos los siguientes cambios en tres de las propiedades del formulario

“Form1”:

Propiedad Text Mi formulario

Propiedad Icon files.ico

(cualquier archivo de imagen en nuestro equipo)

Propiedad BackColor Color de sistema GradientActiveCaption

Observa cómo ha cambiado su apariencia:

Para probar los manejadores de eventos del formulario, en primer lugar

añadimos otro formulario al proyecto mediante el menú Proyecto - AgregarWindows Forms.... Lo llamamos “Form2.vb”.

Vamos a hacer que se muestre el formulario Form2 al hacer doble clic sobre

el formulario Form1.

Accedemos al código fuente del formulario Form1:


En la ventana de código debes elegir el listado de eventos de Form1 y, a

continuación, el evento del que deseas crear el manejador. En nuestro caso, el

evento DoubleClick.

Si el manejador no estaba creado ya, se creará su definición automáticamente:

Private Sub Form1_DoubleClick(ByVal sender As Object, ByVal e As System.EventArgs) _

Handles Me.DoubleClick

End Sub


El código que escribamos dentro de este procediemiento se ejecutará alproducirse el evento que maneja, en este caso, cuando el usuario haga

doble clic sobre el formulario Form1.

Nosotros queremos mostrar el formulario Form2, utilizamos el método Showde dicho formulario:

Controles del formulario

Ya has tenido un primer contacto con los formularios, ahora es el momento de

llenarlos de contenidos añadiendo controles.

Los controles son un medio para que el usuario interactúe con nuestras

aplicaciones. Por ejemplo, iniciando acciones al pulsar un botón o introduciendo

algún dato a través de una caja de texto.

Con Visual Basic 2008 es posible examinar los controles de Windows Forms

desde el cuadro de herramientas, en la parte izquierda del entorno de

desarrollo. Para agregarlos al formulario bastaría con arrastrarlos hasta el

lugar deseado.

Private Sub Form1_DoubleClick(ByVal sender As Object, ByVal e As System.EventArgs) _

Handles Me.DoubleClick

Form2.Show()

End Sub


Todos estos controles se localizan en el espacio de nombres

System.Windows.Forms, y sus respectivas clases son subclases de la clase

Control. A continuación vamos a presentar los esenciales para casi cualquier

aplicación.

Como ya hemos comentado antes, todos los controles contarán con

propiedades, métodos y eventos.

El entorno de desarrollo de Visual Studio nos mostrará las propiedades de

cualquier objeto que seleccionemos en la ventana de propiedades.

Además, veremos que algunos controles ofrecen una ventana con las

propiedades y acciones más comunes para configurarlos. Esta ventana es la

ventana de tareas del control y es accesible haciendo clic en el icono

que aparece tras seleccionar un control.

Podremos ver los eventos de los controles en la ventana de propiedades (lista

de eventos) o en la ventana de código. Además, si hacemos doble clic sobre

cualquier control de la aplicación abriremos la ventana de código directamente

en la implementación del evento predeterminado del control. Por ejemplo, si

hacemos doble clic sobre un formulario iremos directamente a su evento “load”,

o, al pusar sobre un botón, a su evento “click”.


Control Label - Etiqueta

Se encuentra en la sección “Controles comunes” del cuadro de herramientas.

Este control sirve para mostrar un texto que no podrá ser modificado por el

usuario. Este texto podrá tener varias líneas de longitud y su apariencia podrá

modificarse a través de las propiedades del control.

Las etiquetas serán útiles para presentar información diversa al usuario (títulos,

instrucciones…).

Algunas propiedades interesantes del control etiqueta

Name: Nombre con el que nos referiremos al control en el código de

la aplicación. Todos los controles tienen esta propiedad.

Text: Texto que mostrará la etiqueta.

BackColor: Valor del color de fondo de la etiqueta.

Font: Fuente o tipo de letra con el que se visualizará el texto de la

etiqueta

ForeColor: Color del texto de la etiqueta.


Control TextBox - Caja de texto


Este control permite al usuario escribir texto y visualizarlo. Se usan con mucha

frecuencia para presentar formularios en los que el usuario puede rellenar una

serie de datos.

La propiedad a través de la que se puede visualizar y escribir el texto es Text,es su principal propiedad.

Otras propiedades del control TextBox


la aplicación.

BackColor: Valor del color de fondo de la caja de texto.

Font: Fuente o tipo de letra con el que se visualizará el texto en la

caja.

ForeColor: Color del texto de la caja.

Multiline: Si esta propiedad de tipo booleano tiene valor true,

permite que el texto de la caja ocupe más de un línea. Además

podremos variar la altura del TextBox para controlar cuántas líneas

serán visibles.


Control Button - Botón


Este control es un botón sobre el que el usuario podrá pulsar. Lo lógico es que

haya algún tipo de acción asociada a él, y que se ejecute cuando el usuario

pulse el botón.

Pero lo realmente importante del botón son sus eventos:

Algunas propiedades del control Button


la aplicación.

Text: Texto que se mostrará sobre el botón.

Algunos eventos del control Button

Click: El evento Click se produce, como era de esperar, cuando el

usuario hace clic sobre el botón. Es el evento principal del botón.

MouseClick: Este evento es sensiblemente diferente al anterior. Sólo

se producirá cuando el usuario haga clic sobre el botón

exclusivamente con el ratón, no siendo así cuando el usuario pulse

“enter” sobre un botón previamente enfocado.


Control CheckBox - Casilla de verificación


Este control sirve para que el usuario pueda seleccionar determinada opción u

opciones dentro de un grupo.

Gráficamente, el control incluye, además de la casilla, una etiqueta con texto

en la que podremos definir la opción que representa.

Respecto a sus eventos, si duda el más importante es:

Algunas propiedades del control CheckBox


la aplicación.

Text: Texto que acompaña a la casilla de verificación.

Checked: Propiedad booleana que indica si la opción del control está

seleccionada (verdadero) o no (falso).

CheckedChanged: Se produce cuando el usuario ha cambiado el

estado de selección del control CheckBox.

CheckedChanged: Se produce cuando el usuario ha cambiado el

estado de selección del control CheckBox.


Control RadioButton - Botón de opción


Este control es un botón que puede estar activado o desactivado. Sirve para

elegir una única opción entre varias posibles de un grupo. Esta sería la

principal diferencia respecto al control CheckBox: con CheckBox podemos

seleccionar varias opciones a la vez, con RadioButton sólo una de ellas.

De la misma forma que con el control CheckBox, podemos establecer u obtener

su estado a través de la propiedad Checked.

También entre sus eventos cuenta con CheckedChanged, que funciona

exactamente igual que con CheckBox y que, sin duda, será el que más

utilizaremos.

Control GroupBox - Marco

Se encuentra en la sección “Contenedores” del cuadro de herramientas.

Este control, por un lado, sirve para mejorar la estética de nuestro formulario,

agrupando controles dentro de un marco.

Esto puede favorecer la creación de una interfaz de usuario más intuitiva para

el mismo, agrupando los controles y otros elementos de forma racional en el

formulario.

Además, nos servirá para formar grupos de controles de opción quefuncionarán independientemente de otros posibles grupos.

Una propiedad interesante para este control es Text, que es el texto asociado

al control y que nos permitirá incluir un título o una descripción para la

agrupación de controles que pueda contener.


Control PictureBox - Caja de imagen


Este control sirve básicamente para mostrar una imagen de tipo BMP, ICO,

JPEG, GIF o PNG.

Su principal propiedad es Image, mediante la que establecemos el archivo de

imagen a mostrar. Si queremos especificar la ruta a un disco o ubicación en la

Web desde la que cargar la imagen podemos usar la propiedad

ImageLocation.

Otras propiedades del control PictureBox

SizeMode: Mediante esta propiedad se establece cómo se visualizará

la imagen y con qué tamaño. Admite los siguientes valores:

Normal – Visualiza la imagen tal cual, si su tamaño es mayor

que el establecido para el control la imagen se mostrará cortada.

StrechImage – Fuerza el tamaño de la imagen al tamaño del

control.

AutoSize – Adapta el tamaño del control al de la imagen.

CenterImage – Muestra la imagen centrada dentro del control.

Zoom – Aumenta la imagen hasta llenar el tamaño del control.

Size: Con Size podemos especificar el tamaño del control PictureBox,

siempre teniendo en cuenta que, si hemos establecido la propiedad

SizeMode a Autosize, en ningún caso podremos hacer que el

tamaño del control sea inferior al de la imagen.


Controles ListBox y ComboBox - Lista desplegada y lista desplegable

Se encuentran en la sección “Controles comunes” del cuadro de herramientas.

Tratamos ambos controles juntos debido a sus similitudes. Ambos controles

permiten establecer una lista de elementos de la que el usuario podrá elegir

uno o varios haciendo clic sobre ellos.

La principal diferencia entre ambos es que ListBox presenta la listadesplegada, mientras que ComboBox combina una caja de texto y unalista desplegable.

El evento que más vamos a usar de estos dos controles es

SelectedIndexChanged. Este evento se produce cada vez que el usuario

selecciona un elemento de la lista.

Principales propiedades

Items: Es sin duda la porpiedad más importante de ambos controles.

Nos permite acceder a la colección de elementos de nuestra lista.

Además, a partir de esta propiedad tendremos acceso a métodos que

nos permitirán manipularla (Add, Clear, Remove, Insert…), como

veremos más adelante.

SelectionMode: Exclusiva de ListBox. Permite establecer el modo en

que el usuario podrá seleccionar los elementos de la lista. Admite los

siguientes valores:

One - Sólo se podrá seleccionar un único elemento a la vez.

MultiSimple - Selección múltiple con cada clic sobre los elementos.

MultiExtended - Selección múltiple con la combinación de clic sobre

los elementos y las teclas shift o control.


Control TabControl - Pestañas

Se encuentra en la sección “Contenedores” del cuadro de herramientas.

Este control permite distribuir en él los controles organizados en diferentes

pestañas. Es muy útil cuando necesitamos incluir muchos controles en un

formulario pequeño, o bien cuando ya no nos basta con controles GroupBox

para mostrar el contenido del formulario de una forma organizada. Esto último

siempre será bien valorado por los usuarios de nuestra aplicación.

El control TabControl se compone a su vez de TabPages, las cuales son cada

una de las pestañas que queramos incluír. Desde el punto de vista del código

las pestañas son a su vez controles, con sus propiedades, métodos y

eventos. Podemos agregar a un TabControl todas las TabPages que

necesitemos.

Cada pestaña o TabPage cuenta con la propiedad Text en la que podemos

establecer el texto que se mostrará en el borde de la pestaña. Los controles

que coloquemos sobre una pestaña serán visibles al usuario sólo cuando la

pestaña esté seleccionada.


Control DateTimePicker - Calendario


Este control permite seleccionar una fecha y hora de forma sencilla.

Respecto a los eventos de DateTimePicker cabe destacar:

Algunas propiedades del control DateTimePicker

Value: Devuelve o establece el valor de la fecha / hora seleccionadas.

MinDate, MaxDate: Respectivamente, fecha mínima y máxima que

se puede seleccionar.

Y para cambiar el aspecto del calendario se puede modificar las

propiedades ForeColor, Font, TitleBackColor, TitleForeColor,TrailingForeColor, y BackColor.

ValueChanged: Se produce cuando el usuario ha cambiado el valor

de la fecha.


2.2. DISEÑO DEL FORMULARIO

A la hora de distribuir los controles que

necesitamos en un formulario no basta con ir

añadiéndolos en cualquier parte del mismo.

Los formularios y sus controles formarán

parte de la interfaz gráfica de usuario(GUI, Graphic User Interface), es decir, serán

la parte de nuestra aplicación con la que el

usuario interactuará, y, por lo tanto debemos

diseñarlos de la forma más racional e intuitiva

posible.

Por ello, antes de lanzarnos al diseño de formularios debemos tener en cuenta

ciertas consideraciones previas.

La ley de Fitts es un modelo matemático sobre el movimiento humano. A

grandes rasgos, podríamos decir que predice el tiempo necesario en moverse

rápidamente desde una posición inicial a una zona destino final, en función de

la distancia entre ambos puntos y el tamaño de la zona final.

No vamos a entrar en demostraciones matemáticas, sólo nos quedamos con

las aplicaciones que esta ley tiene para el diseño de la interfaz gráfica de

aplicaciones informáticas.

Ley de Fitts aplicada al diseño de formularios

Los controles deben tener un tamaño razonable para que sea fácil

pulsar sobre ellos.

La distancia entre posibles opciones debe ser la mínima posible,

dentro de lo estéticamente aceptable.

De la misma forma, si hay que dar una serie de pasos para completar

una tarea, éstos deben estar próximos entre sí.

Las opciones similares o relacionadas deben estar agrupadas.

No colocar barreras al usuario.

Lanzar ventanas adicionales sólo si es necesario y son útiles.

No abrumar al usuario con demasiadas opciones.


Ya que conoces algunos controles y tienes ciertas directivas sobre cómo

distribuirlos en el formulario, te proponemos diseñar un sencillo formulario con

algunos de ellos. Después nos ocuparemos de añadirle funcionalidad.

Verás paso a paso cómo diseñamos el formulario. Es recomendable que abras

un nuevo proyecto de Windows Forms con Visual Basic Express y los sigas.

Lo que proponemos es una aplicación con un único formulario, en el que

podamos modificar el tipo de letra, tamaño y color del texto de una etiqueta.

Para abordar este proyecto lo primero que haremos es estimar qué objetos o

controles necesitaremos en nuestra interfaz:

El ejemplo que realizaremos a continuación es una pequeña muestra que parte

de un nuevo proyecto de Windows Forms al que hemos llamado

“FormatoTexto”.

Vamos a empezar a añadir controles al formulario. La forma más sencilla de

hacerlo es arrastrando el contro desde el cuadro de herramientas.

Un formulario que contenga la interfaz.

La etiqueta sobre la que haremos las modificaciones de formato.

Una caja de texto para introducir el tamaño del texto.

Casillas de verificación para indicar si el texto está en cursiva o en

negrita.

Un control que nos permita elegir colores. En la sección “cuadros de

diálogo” del cuadro de herramientas encontramos el control ColorDialog.

Un botón para aplicar el formato a la etiqueta.


En todo momento podremos variar la posición de un control, arrastrándolo, y

su tamaño, estirando con el ratón de los cuadros situados en los bordes y

esquinas del control.

Una vez añadidos los controles necesarios y ajustado su tamaño y forma,

pasaríamos a modificar aquellas propiedades que sean necesarias para terminar

de establecer sus características.

Ya sabes que las propiedades de un formulario, y cualquier control, están

disponibles en la ventana propiedades, tras seleccionar el control. Si esta

ventana no estuviera visible podemos verla pulsando sobre el control con el

botón derecho del ratón y seleccionando propiedades en el menú emergente.


Añadimos todos los controles necesarios para nuestro ejemplo:

Las propiedades que hemos especificado para cada uno son las siguientes:

Control Label para modificar formato

Propiedad Name EtiquetaPrueba

Propiedad Text Texto Prueba

Control GroupBox

Propiedad Text Formato


Control ComboBox

Propiedad Name TipoFuente

Propiedad DropDownStyle DropDownList

Control TextBox

Propiedad Name TamañoTexto

Control Label para la selección de color

Propiedad Name Color

Propiedad AutoSize False

Propiedad BackColor Black (web)

Propiedad Text (vacío)

Botón para cambiar de color

Propiedad Name CambiarColor

Propiedad Text Cambiar

Control CheckBox para cursiva

Propiedad Name Cursiva

Propiedad Text Cursiva


Con nuestra interfaz creada, si pruebas la aplicación, te darás cuenta de que

aún nos falta un pequeño detalle. Y es que la lista desplegable para seleccionar

el tipo de fuente está vacía.

Vamos a añadir a la lista tres tipos de letra distintos:

Arial

Times New Roman

Verdana

Para ello, abrimos la ventana de tareas del comboBox “TipoFuente” y

seleccionamos Editar elementos.

Control CheckBox para negrita

Propiedad Name Negrita

Propiedad Text Negrita

Botón para aplicar el formato a la etiqueta

Propiedad Name CambiarColor

Propiedad Text Cambiar


En la ventana que se abre escribimos los elementos que queremos en la

colección, uno por línea:

Crear controles dinámicamente

Además de en tiempo de diseño, podemos crear nuevos controles en nuestra

aplicación durante su ejecución, sólo hay que escribir el código para crearlos.

No olvidemos que los controles son objetos y, como tales, pueden sercreados invocando al constructor de su clase.

También podremos establecer los valores deseados para sus propiedades con

la notación Objeto.propiedad = valor.

Desde los entornos de desarrollo Visual Basic Express o Visual Studio vamos a

contar siempre con la tecnología intellisense que listará los miembros

(propiedades, métodos…) de cualquier objeto al escribir un punto a

continuación de su nombre. Esto nos facilita el trabajo enormemente, ya que

podemos localizar cualquier miembro del objeto fácilmente.


Observa el código que se muestra a continuación. En él se crea una instancia

de la clase Label llamada “etiqueta”, se inicializan algunas de sus propiedades

y, por último, se añade a la colección de controles del formulario o cualquier

objeto contenedor.

Normalmente resultará más sencillo añadir los controles en tiempo de diseño

y con ayuda de un entorno de desarrollo como Visual Studio. No obstante,

siempre podremos recurrir a la creación dinámica de controles cuando nos

veamos obligados a crearlos bajo ciertas condiciones conocidas durante la

ejecución.

'Declaramos la variable y creamos el objeto con New

Dim etiqueta As New Label

'Definimos algunas propiedades

etiqueta.Text = "Hola!!"

etiqueta.ForeColor = Color.DarkBlue

etiqueta.Font = New Font("Arial", 14)

'Añadimos la etiqueta a la colección de controles

Controls.Add(etiqueta)


2.3. IMPLEMENTACIÓN DE FUNCIONALIDAD

Ya tenemos nuestro formulario preparado. Todos los controles necesarios están

en su sitio. Si iniciamos nuestra aplicación, veremos que el funcionamiento de

los controles es el mínimo, cuando no nulo. Siguiendo nuestro ejemplo,

podemos elegir un tipo de fuente o seleccionar un color, pero no se aplican

estos cambios al texto.

Como ya supondrás, lo siguiente que debemos hacer es establecer las acciones

a realizar cuando el usuario interactúe con los controles de nuestro formulario.

Esto es, añadirles funcionalidad.

Ya hemos hablado sobre los eventos de los controles. Cuando sobre un objeto

de nuestra aplicación ocurre un suceso (por ejemplo, el usuario hace clic sobre

un botón, cambia el texto de una caja de texto…) se produce un evento.

Si queremos que nuestra aplicación realice alguna acción al producirse un

evento, nos corresponde a nosotros escribir un método que responda a eseevento.

Por ejemplo, queremos que, cuando el usuario pulse sobre un botón (evento

click), se muestre un diálogo para elegirlo (control ColorDialog).


Imagina que en un formulario tenemos un botón llamado (propiedad Name)

“Boton” y un control ColorDialog llamado “DialogoColor”, lo que habrá que

hacer para que el botón muestre el diálogo será lo siguiente:

Tras esto, el código correspondiente al manejador del evento click del botón

quedaría de la siguiente forma:

Observa lo siguiente:

El manejador que hemos creado se llama Boton_Click, y recibe dos

parámetros, sender y e. El parámetro sender hace referencia al objeto quegeneró el evento. El parámetro e proporciona información del evento.

Implementar el método para el evento click del botón.

El evento click es el evento predeterminado del control botón,

por ello, bastará con hacer doble clic sobre el botón en la vista de

diseño para que nos muestre la ventana del código con la

declaración del método creada.

Añadir el código que queramos ejecutar cuando seproduzca el evento click.

En nuestro caso queremos mostrar el diálogo de color. El control

ColorDialog cuenta con un método propio llamado ShowDialogque realiza esta función.

Private Sub Boton_Click(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles Boton.Click

DialogoColor.ShowDialog()

End Sub


En la parte final de la declaración pone Handles Boton.Click. Esta cláusula

indica (literalmente) que el método llamado Boton_Click maneja el eventoclick del control Boton.

Los manejadores de eventos son llamados también delegados y son objetos

de la clase EventHandler del espacio de nombres System.

En otras palabras, la sentencia Handles Boton.Click hace que se ejecute

Boton_Click cuando se pulse sobre el botón Boton.

Por último, dentro del manejador hacemos la llamada al método ShowDialog

del control DialogoControl. En Visual Basic la forma general de referirse a una

propiedad de un objeto es Objeto.Propiedad. Esto mostrará el diálogo al

usuario.

Como ya hemos visto, cláusula Handles sirve para indicar qué métodomanejará determinado evento.

Si usamos Handles al final de la declaración del método, lo asociamosal evento durante la compilación de la aplicación, antes de suejecución.

Existe otra forma de vincular métodos a eventos de forma dinámica, esto

es, en el transcurso de la ejecución: Mediante las sentencias AddHandler, para

vincular y RemoveHandler, para desvincular. Sus respectivas sintaxis son las

siguientes:

Esto puede ser útil si se quiere asignar un manejador a determinado evento

sólo si se dan ciertas condiciones durante la ejecución de la aplicación.

AddHandler miObjeto.Evento, AddressOf Manejador

RemoveHandler miObjeto.Evento, AddressOf Manejador


Si volvemos a nuestro caso de ejemplo, ¿qué acciones necesitamos

implementar en nuestra aplicación “FormatoTexto”?

Ejemplo:

Private Sub Pulsa_Boton(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles Boton.Click


End Sub

¡Ambos fragmentos de código son equivalentes!

Private Sub Pulsa_Boton(ByVal sender As System.Object, _

ByVal e As System.EventArgs)


End Sub

[…]

AddHandler Boton.Click, AddressOf Pulsa_Boton

Acción 1: El botón “CambiarColor” debe abrir el diálogo de color

“DialogoColor” y poner el color seleccionado en éste como color de fondo

de la etiqueta “Color” para que el usuario vea el color seleccionado

actualmente.

Acción 2: El botón “BotonAplicar” debe aplicar todos los valores de

formato seleccionados a la etiqueta “EtiquetaPrueba”.


Cómo abrir “DialogoColor” al hacer clic en “CambiarColor”.

Implementamos el manejador del evento click del botón “CambiarColor” (doble

clic sobre el control).

Añadimos el código para abrir el diálogo de color. Si recuerdas, al inicio del

apartado, usábamos el evento ShowDialog.

Pero no basta con mostrar el diálogo, si el usuario elige un color, hay que

mostrarlo de fondo en la etiqueta “Color”.

El método quedaría implementado como se muestra a continuación.

Este código vendría a expresar: “Si el usuario pulsa Aceptar en el dialogo de

color entonces asigna el color elegido a la propiedad color de fondo de la

etiqueta ‘Color’ ”.

Cómo aplicar el formato seleccionado a la etiqueta “EtiquetaPrueba” tras

pulsar en “BotonAplicar”

Implementamos el manejador del evento click del botón “BotonAplicar”

(haciendo doble clic sobre el control).

Lo primero que haremos es determinar el formato que se aplicará por defecto

en el caso de que el usuario no seleccione alguna opción.

Después revisamos lo que el usuario seleccionó y finalmente aplicamos el

formato a la etiqueta “EtiquetaPrueba”.

Private Sub CambiarColor_Click(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles CambiarColor.Click

If DialogoColor.ShowDialog = Windows.Forms.DialogResult.OK Then

Color.BackColor = DialogoColor.Color

End If

End Sub


El método queda implementado como se muestra a continuación.

Private Sub BotonAplicar_Click(ByVal sender As System.Object, _

ByVal e As System.EventArgs) Handles BotonAplicar.Click

'Declaramos las variables y asignamos valores por defecto

Dim fuente As String = "Times New Roman"

Dim tamaño As Integer = 11

Dim tipo As System.Drawing.FontStyle = FontStyle.Regular

'Revisamos lo que seleccionó el usuario

'tipo de fuente

If TipoFuente.SelectedItem <> Nothing Then

fuente = TipoFuente.SelectedItem.ToString

End If

'tamaño

If TamañoTexto.Text <> "" Then

tamaño = TamañoTexto.Text

End If

'estilo cursiva

If Cursiva.Checked Then

tipo = FontStyle.Italic

End If

'añade estilo negrita

If Negrita.Checked Then

tipo = tipo + FontStyle.Bold

End If

'Aplicamos el formato elegido a la etiqueta EtiquetaPrueba

EtiquetaPrueba.Font = New Font(fuente, tamaño, tipo)

EtiquetaPrueba.ForeColor = Color.BackColor

End Sub


Nuestro ejemplo ya está completo. Si iniciamos el proyecto comprobaremos

que es plenamente funcional, pues la aplicación responderá a las acciones del

usuario ejecutando los manejadores que hemos programado.

Ya sabemos lo básico para crear aplicaciones Windows Forms, en el próximo

tema profundizaremos en las posibilidades de los formularios para aplicaciones

más avanzadas.

tema 2. diseño de formularios windows 2.1. · pdf filetema 2. diseño de...

Documents