1

3. APLICACIONES PARA WINDOWS. CONTROLES BÁSICOS

EL CUADRO DE HERRAMIENTAS

El Cuadro de herramientas es la caja de herramientas donde se encuentran los controles que se van ha usar para diseñar la interface de los diferentes tipos de aplicaciones, este varia de acuerdo al tipo de plantilla elegida.

Para utilizar el Cuadro de herramientas es necesario elegir la ficha adecuada para después seleccionar el control y arrastrarlo sobre el formulario o contenedor donde se desea ubicar, también es posible hacer doble clic sobre el control para que éste se posicione en las coordenadas 0,0 del formulario activo.

CONTROL Label

El control Label se corresponde con una etiqueta que muestra un texto no editable. El control Label se utiliza para los títulos y descripciones de otros controles.

Propiedades

PROPIEDAD DESCRIPCIÓN Anchor Es una nueva propiedad que permite determiner a que extremos del

formulario o contenedor está fijada la posición del objeto Autosize Ajusta el texto de la etiqueta al tamaño del control BackColor Especifica el Color de fondo de la etiqueta BorderStyle Controla la apariencia del borde de la etiqueta. Tiene 3 opciones Cursor Especifica el cursor que aparece al situar el ratón sobre la etiqueta Dock Con Docking lo que hacemos es indicarle al control dos bordes a los que estará

conectado, de tal manera que si se redimensiona el formulario el control se redimensionará también.

Enabled Habilita o deshabilita la etiqueta Font Configura la fuente del texto de la etiqueta Forecolor Especifica el color del texto de la etiqueta Location Indica la posición de la etiqueta con respecto a su contenedor Locked Bloquea el control para que no se mueva o modifique de tamaño Right ToLeft Determina la alineación del texto con respecto al control Size Configura el tamaño del control en pixeles Text Visualiza el texto de la etiqueta TextAlign Alinea el texto hacia el control, sea: izquierda, derecha o centro Visible Visualiza o no el control

2

Métodos

MÉTODO DESCRIPCIÓN FindForm Devuelve el formulario en que se encuentra el control Focus Pone el foco sobre la etiqueta Hide Oculta la etiqueta, sin descargarla de la memoria Refresh Repinta la etiqueta SetLocation Ubica la etiqueta en una cierta posición de la pantalla SetSize Configura el tamaño de la etiqueta Show Hace visible la etiqueta

Eventos

EVENTO DESCRIPCIÓN Clic Se desencadena al dar clic con el ratón sobre la etiqueta DoubleClick Se desencadena al dar doble clic con el ratón sobre la etiqueta GotFocus Ocurre al fijar el foco sobre el control LostFocus Ocurre al salir el foco del control MouseEnter Se habilita al ingresar el ratón sobre la etiqueta MouseLeave Se habilita al salir el ratón de la etiqueta MouseMove Se desencadena al pasar el ratón sobre la etiqueta

Notas:

1. Para provocar un salto de línea en el texto de un control Label

Label1.Text = "Primera línea" & vbCrLf & "Segunda línea"

CONTROL TextBox

El control TextBox es uno de los más utilizados en Windows. Este control se utiliza para mostrar e introducir texto.

El control TextBox se suele utilizar para introducir y modificar líneas de texto, como son los números y las contraseñas.

Propiedades

PROPIEDAD DESCRIPCIÓN CharacterCasing Nueva propiedad que convierte a mayúsculas o minúsculas el texto. Lines Muestra el contenido de cada línea del texto. MaxLength Determina el número de caracteres que se pueden ingresar en el control. MultiLine Si es true se pueden escribir varias líneas de texto. PasswordChar Señala el carácter que aparecerá como máscara de entrada ReadOnly Indica que el control solo se puede ver pero no editar. Antes se llamaba

Locked.

3

ScrollBars Habilita las barras de desplazamiento si el control es multilínea. Text Contiene el texto del control WordWrap Cambia de línea al llegar al extremo derecho del control.

Métodos

MÉTODO DESCRIPCIÓN AppendText Añade texto al final del texto actual Clear Borra el contenido del cuadro de texto Copy Copia el texto y lo envía al portapapeles Cut Corta el texto y lo envía al portapapeles. Paste Pega el texto del portapapeles al cuadro. Reset text Inicializa el texto Select Selecciona el texto. Undo Deshace el último cambio en el texto

Eventos

EVENTO DESCRIPCIÓN Key Down Ocurre al pulsar hacia abajo una tecla extendida Key Press Ocurre al pulsar una tecla normal Key Up Ocurre al soltar una tecla extendida previamente pulsada TextChanged Es un nuevo evento que reemplaza al evento Change Validated Rehabilita después de validarse el control Validating Se habilita cuando el control esta validándose

Nota: En el caso de que se requiera que al pulsar Enter en el control TextBox el foco cambie al siguiente control se puede utilizar este controlador de evento

'Al pulsar una tecla, detecte si se pulsó enter y pase el foco al siguiente control Private Sub TextBox1_KeyPress(ByVal sender As Object, ByVal e As System.Windows.Forms.KeyPressEventArgs) Handles TextBox1.KeyPress 'Si se pulsó Enter If e.KeyChar = ChrW(Keys.Enter) Then 'Provoca el evento KeyPress e.Handled = True 'envío la tecla Tab SendKeys.Send("{TAB}") End If End Sub

4

CONTROL Button

Este control representa el botón clásico de Windows, es habitual que ejecute operaciones fundamentales dentro del formulario como ir a otro formulario, realizar operaciones con los contenidos de los controles, etc.

Propiedades

PROPIEDADES DESCRIPCIÓN Name Generalmente usaremos el prefijo btn BackGroundImage Especifica la imagen de fondo que usara el botón DialogResult Determina el valor del formulario padre si se da clic sobre el botón FlatStyle Determina el estilo o apariencia del control. Tiene 3 valores Image Imagen que se mostrara en el control ImageAlign Alineación de la imagen dentro del control

Métodos

MÉTODO PROPIEDAD Refresh Redibuja la imagen de nuevo Dispose Libera todos los recursos utilizados por el objeto

Eventos

EVENTO DESCRIPCIÓN Click Se desencadena al dar clic con el Ratón sobre la etiqueta GetFocus Ocurre al ingresarse el foco sobre el botón LostFocus Ocurre al salir el foco del botón Mouseenter Se habilita al ingresarse el ratón sobre el botón MouseLeave Se habilita al salir el ratón del botón

CONTROL PictureBox

El control PictureBox es un control que se puede utilizar para mostrar una imagen. Puede mostrar distintos tipos de archivos: mapa de bits, metarchivo, icono, JPEG, GIF o PNG.

Propiedades

PROPIEDADES DESCRIPCIÓN Name Generalmente usaremos el prefijo img Image contiene la imagen que se quiere mostrar BorderStyle Borde de la imagen

Fixed3D Borde tridimensional. FixedSingle Borde de una sola línea. None Sin borde.

5

SizeMode Forma en la que se adapta el tamaño de la imagen al tamaño del control

AutoSize El tamaño del control debe ajustarse igual que el tamaño de la imagen que contiene.

CenterImage

La imagen se muestra en el centro si PictureBox es más grande que la imagen. Si la imagen es más grande que PictureBox, la imagen se coloca en el centro del control y se recortan los bordes exteriores.

Normal La imagen se coloca en la esquina superior izquierda de PictureBox. La imagen se recorta si es más grande que el objeto PictureBox que la contiene.

StretchImage La imagen situada dentro de PictureBox se estira o encoge para ajustarse al tamaño del mismo.

Zoom La imagen se ajusta al tamaño del control, aplicando un efecto de zoom para ello

Métodos

MÉTODO PROPIEDAD NotifyDefault Indica si el botón serpa el control por defecto. Es de tipo lógico Performeclick Ejecuta el evento clic del botón

Eventos

EVENTO DESCRIPCIÓN Clic Se desencadena al dar clic con el Ratón sobre la etiqueta GetFocus Ocurre al ingresarse el foco sobre el botón LostFocus Ocurre al salir el foco del botón Paint Se produce cuando vuelve a dibujarse el control LoadCompleted Se produce cuando la carga asíncrona se ha completado

CONTROL GroupBox

Antes conocida como Frame, es un contenedor que se utiliza para agrupar varias opciones que pueden ser de opción única como el RadioButton o de opción múltiple como los CheckBox

Este control se utiliza como contenedor y por si solo no tiene mucha funcionalidad es por eso que solo veremos sus principales métodos y eventos.

Propiedades

PROPIEDAD DESCRIPCIÓN Name Generalmente utilizaremos el prefijo GBX Enabled Determina si el botón esta habilitado o deshabilitado

6

Text Indica que se mostrara como encabezado del control Visible Muestra y oculta el control y todo su contenido

Métodos

MÉTODO DESCRIPCIÓN Focus Pone el foco sobre el control Hide Oculta el control, sin descargarlo de la memoria Show Pone visible el cuadro de grupo

Eventos

EVENTO DESCRIPCIÓN GetFocus Ocurre al ingresar el foco sobre el control LostFocus Ocurre al salir el foco del control

CONTROL ListBox

El control ListBox permite seleccionar elementos de una lista que el usuario puede fijar de en modo diseño o editando sus propiedades. En tiempo de ejecución se pueden agregar elementos utilizando el método Add del control.

Para añadir elementos al control se puede utilizar la propiedad Items de la ventana Propiedades .

Para agregar los mismo items que el ejemplo anterior en tiempo de ejecución se deberían ejecutar las siguientes instrucciones

Cadena.Add(“A Coruña”) Cadena.Add(“Lugo”) Cadena.Add(“Ourense”) Cadena.Add(“Pontevedra”) Cadena.Add(“Vigo”)

7

Después de introducir los ítems en el objeto ListBox se mostrará en el formulario un cuadro con el siguiente aspecto:

Propiedades

PROPIEDADES DESCRIPCIÓN Name Generalmente usaremos el prefijo lst ColumnWidth Indica el ancho de cada columna en una lista de varias columnas HorizontalExtent Indica el ancho mismo en píxeles que se requiere para que aparezca la

barra horizontal HorizontalScollBar Muestra u culta la barra de desplazamiento horizontal de la lista Integral height Determina que las opciones de la lista se vean en forma completa ItemHeight Devuelve el Alto en píxeles de cada elemento de la lista Ítems Es la principal propiedad y se refiere a los elementos de la lista MultiColumn Indica si los elementos se pueden ver en varias columnas ScrollAlwaysVisible Visualiza siempre las 2 barras de desplazamiento SelectionMode Determina la forma de selección Sorted Ordena la lista en forma ascendente SelectedIndex Devuelve o establece el índice del elemento seleccionado SelectedIndices Devuelve una colección se los índices seleccionados SelectedItems Es una colección donde se guardan los elementos seleccionados

Métodos

MÉTODOS DESCRIPCIÓN findString Devuelve el índice de un elemento buscado en una lista. Sino existe

devuelve -1 y si existe devuelve un numero mayor que - FindStringExact Realiza una labor similar al método anterior pero compara con exactitud la

cadena GetSelected Devuelve True si un elemento ha sido seleccionado o False sino

Eventos

EVENTOS DESCRIPCIÓN DoubleClick Ocurre al dar dos veces clic sobre la lista SelectedIndexChanged Ocurre al cambiar el índice del elementos seleccionado

8

CONTROL CheckedListBox

El control CheckedListBox es siminar al ListBox con la diferencia de que cada elemento de la lista tiene anexo una casilla de verificación.

Sus propiedades son similares a las del ListBox por ello veremos aquellas propiedades que son diferentes.

El aspecto de un CheckedListBox es el siguiente:

Propiedades

PROPIEDADES DESCRIPCIÓN Name Generalmente usaremos el prefijo ckl CheckedOnClick Establece si el control podrá ser fijado la primera vez al dar clic CheckedItems Es una colección donde se guardan los elementos seleccionados CheckedIndices Devuelve una colección se los índices seleccionados

Métodos

MÉTODOS DESCRIPCIÓN GetItemChecked Devuelve True si un cierto Ítem ha sido seleccionado y False si no GetItemCkeckState Devuelve el valor de la propiedad CkeckState SetItemChjecked Establece o quita la selección de un cierto elemento SetItemCheckState Establece la propiedad CheckState de un cierto elemento

Eventos

EVENTOS DESCRIPCIÓN ItemCheck Se produce cuando cambia de estado alguno de sus elementos SelectedIndexChanged Se produce cuando se modifica la selección de un elemento

CONTROL ComboBox

El control ComboBox se corresponde con la tradicional lista desplegable que permite seleccionar uno de sus elmento al hacer clic sobre él.

9

El aspecto de un ComboBox es el siguiente

Propiedades

PROPIEDADES DESCRIPCIÓN Name Generalmente usaremos el prefijo cbo Ítems Es la principal propiedad y se refiere a los elementos del combo maxDropDownitems Indica el máximo numero de elementos que se mostraran al

desplegarse el combo Maxlenght Determina el máximo numero de caracteres que se podrán escribir Sorted Ordena los elementos del combo en forma ascendente Style Especifica el tipo de combo que puede ser. Simples dropdown, y

dropdownlist SelectedIndex Devuelve o establece el índice del elemento seleccionado Text Se refiere al texto escrito en el cuadro del combo

Métodos

MÉTODOS DESCRIPCIÓN FindString Devuelve el índice de un elemento buscado en el combo. Sino existe

devuelve -1 y si existe devuelve un numero mayor que -1 FindStringExact Realiza una labor similar al método anterior pero compara con exactitud la

cadena

Eventos

EVENTOS DESCRIPCIÓN Clic Ocurre al dar clic con el Ratón a un elemento de la lista DoubleClick Se da al dar dos veces clic sobre un elemento de la lista SelectedindexChanged Ocurre cuando al cambiar el índice del elemento seleccionado SelectionChangeCommited Se da cuando se selecciona un elemento del combo TextChanged| Ocurre al cambiar la propiedad Text del combo

COLECCIÓN Ítems

Para poder manipular cualquier control que contenga elementos de una lista desde el código debemos aprender a manipular colecciones, para ello es necesario conocer la forma de realizar las siguientes operaciones:

10

• Añadir elementos a una lista:

o ListBox1.Items.Add(ítem)-> Añade el ítem al final de la lista o ListBox1.Items.Insert(posición, ítem)-> Añade el ítem en la posición indicada

• Eliminar elementos de una lista:

o ListBox1.Items.Clear-> Elimina todos los elementos de la lista o ListBox1.items.RemoveAt(index)-> borra el elemento de la posición indicada

• Acceder a elementos individuales de la lista

o ListBox1.Items(i)->Se puede acceder a un elemento individual de la colección por su posición, se debe tener en cuenta que la primera posición es la 0 y la última es el número de elementos-1

Propiedades

PROPIEDADES DESCRIPCIÓN All Devuelve un objeto con todos los elementos de la colección Count Devuelve el numero de elementos del combo ValueMember Indica la propiedad que se va a utilizar como valor real

Métodos

MÉTODOS DESCRIPCIÓN Add Añade un elemento al final del combo Clear Borra todos los elementos del combo CopyTo Almacena todos los elementos de una colección y los envía a un array Contains Acepta como parámetro un objeto y devuelve el valor True/False indicando si

está contenido o no en la colección Insert Inserta un elemento en la posición indicada por el índice Remove Elimina un elemento del combo de acuerdo a su índice

MENÚS

Los menús se construyen a partir de la clase MenuStrip, que representa un contenedor de la estructura de menús de un formulario.

Para crear un menú se debe arrastrar el control sobre el formulario. El control se podrá observar en la posición superior del formulario y en la parte inferior, en la denominada bandeja de componentes.

El control MenuStrip se compone de objetos ToolStripMenuItem. Los elementos del menú se pueden introducir de forma gráfica desde la vista Diseño del formulario.

11

Después de tener diseñado el menú lo único que hay que hacer es programar la acción ligada a cada una de las opciones. Para acceder al controlador del evento Clic de una opción tan solo es necesario pulsar doble clic sobre la misma desde la vista Diseño.

El carácter ampersand (&) hace que el carácter siguiente se convierta en la tecla de acceso rápido. Las recomendaciones de diseño de la interfaz indican que todos los elementos de un menú deben tener tecla de acceso rápido.

Por omisión el aspecto del elemento de menú es una etiqueta con texto estático, aunque es posible cambiar ese aspecto para mostrar un ComboBox o un TextBox utilizando para ello el botón derecho de cada uno de los elementos del menú. Se debe tener en cuenta que los elementos de tipo ComboBox y TextBox no pueden tener submenús.

Se pueden insertar separadores en los menús, para ello se debe situar el cursor en el lugar deseado y pulsar el botón derecho, entonces seleccionar Insertar>Separator.

La propiedad Enabled, permite deshabilitar las opciones no disponibles en un momento dado.

MENÚ CONTEXTUAL

Un menú contextual es aquel que surge al hacer clic con el botón derecho del ratón. El control que se corresponde con el menú contextual es el control ContextMenuStrip.

Al arrastrar un control ContextMenuStrip hacia un formulario, el control ContextMenuStrip se muestra como un cuadro en la parte superior del formulario con el texto "Escriba aquí" en su interior, y se agrega un icono a la bandeja de componentes. A diferencia de MenuStrip, sólo pueden agregarse elementos adicionales debajo del primer elemento de menú, creándose un menú vertical

.

Para asociar un elemento ContextMenuStrip con un control particular se debe asociar la propiedad ContextMenu del control con el control de menú contextual que le corresponda.

12

CONVENCIONES

En el siguiente enlace tendremos amplia información sobre convenciones al respecto de la programación en .NET

http://msdn.microsoft.com/es-es/library/czefa0ke%28v=vs.71%29.aspx

Mayúsculas y minúsculas Pascal

La primera letra del identificador y la primera letra de las siguientes palabras concatenadas están en mayúsculas. El estilo de mayúsculas y minúsculas Pascal se puede utilizar en identificadores de tres o más caracteres. Por ejemplo:

BackColor

Mayúsculas y minúsculas Camel

La primera letra del identificador está en minúscula y la primera letra de las siguientes palabras concatenadas en mayúscula. Por ejemplo:

backColor

Mayúsculas

Todas las letras del identificador van en mayúsculas. Utilice esta convención sólo para identificadores que estén formados por dos o menos letras. Por ejemplo:

System.IO System.Web.UI

Para nombrar los controles

Es conveniente utilizar prefijos comunes a los controles para identificar el tipo de control por su nombre, de la misma manera se debe incluir en el nombre su funcionalidad. De esta forma si tenemos un control que se denomina BntCerrar, el nombre nos aporta dos datos: el tipo de objeto y la función que realiza.

Control Prefijo Button Btn Label Lbl GroupBox Gbx Timer Tmr TextBox Txt ListBox Lst ComboBox Cbx

13

CheckedListBox Cxl El control MenuStrip se suele dejar con el nombre por defecto ya que suele haber un único menú en cada formulario.

Control del orden de tabulación Es importante verificar el orden de tabulación de los controles. En los controles que pueden tomar el foco, el orden de tabulación lo determina la propiedad TabIndex (también podemos evitar que esos controles entren en el orden de tabulación estableciendo la propiedad TabStop a False). El control Label no puede tomar el foco, aunque si tiene propiedad TabIndex. En este caso, la propiedad se utiliza para establecer que control tomará el foco al utilizar su tecla de acceso, que será el siguiente en el orden de tabulación. Podemos establecer manualmente la propiedad TabIndex, o bien utilizar la opción ORDEN DE

TABULACIÓN del menú VER que permite establecerla de forma visual.

PRÁCTICA

1) Realizar un proyecto llamado DatosPersonales donde se solicite la siguiente información

a. Nombre de usuario b. Contraseña c. Si la contraseña es igual a una dada se mostrará un ComboBox que permita

seleccionar el nivel de estudios. El nivel de estudios estará previamente cargado con los siguientes datos: Estudios primarios, Estudios medios y Estudios superiores

d. El el caso de que seleccione i. Estudios superiores, se mostrará un ComboBox en el que se incluirán

las siguientes opciones: Ingeniería superior y Licenciatura ii. Estudios medios, se mostrará un ComboBox en el que se incluirán las

siguientes opciones: Ingeniería técnica y Diplomatura, iii. Estudios básicos, se mostrará un ComboBox en el que se incluirán las

siguientes opciones: ESO, Bachillerato y Módulo superior

En todos los casos los datos se agregarán desde el programa

e. Al seleccionar el tipo de estudio se debe mostrar un control CheckedListBox que muestre opciones de 4 temas de interés (deportes, lectura, teatro y música). El usuario podrá elegir cualquiera de ellos.

14

f. El formulario debe incluir un botón para cerrar

Se deben respetar las convenciones de nombres de controles.

2) Realizar un documento técnico que muestre un esquema de la interfaz con los nombres de los controles y eventos a los que responde.

3) Realizar un pequeño manual de usuario que indique el funcionamiento del programa. 4) Eliminar el botón Cerrar y crear un menú que tenga las entradas Archivo>Cerrar