Vous êtes sur la page 1sur 202

Introduccin al lenguaje de programacin Visual Basic

Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 Visual Basic Express es una manera rpida y sencilla de crear programas para Microsoft Windows. Aunque no tenga experiencia de programacin en Windows, con Visual Basic dispone de un completo conjunto de herramientas para simplificar las tareas de desarrollo. Y qu es Visual Basic? "Visual" hace referencia al mtodo utilizado para crear lo que ve el usuario, la interfaz grfica de usuario o GUI. "Basic" hace referencia al lenguaje de programacin BASIC, de Beginners All-Purpose Symbolic Instruction Code (Cdigo de Instruccin Simblico Todo Propsito para Principiantes), un lenguaje utilizado por ms programadores que cualquier otro lenguaje en la historia de la informtica. Puede crear programas tiles slo con aprender algunas de sus caractersticas. Los vnculos siguientes le servirn para empezar a programar en Visual Basic; cada vnculo incluye ejemplos, as como acceso a informacin adicional.

Programar los conceptos


Qu es exactamente un lenguaje de programacin? Los vnculos siguientes le darn cierta informacin general sobre lo que es un lenguaje y cmo almacena diferentes tipos de informacin. Conceptos bsicos: funcionamiento de la programacin Cmo funciona un lenguaje de programacin y terminologa bsica. Representacin de palabras, nmeros y valores con variables Cmo las variables almacenan valores y representan informacin, as como la manera de utilizarlas. Palabras y texto: utilizar variables de cadena para organizar palabras Cmo utilizar una variable String para representar palabras y texto. Matrices: variables que representan ms de un valor Cmo utilizar una variable Array para representar varios valores del mismo tipo. Aritmtica: crear expresiones con variables y operadores Cmo escribir cdigo que realiza operaciones aritmticas.

Comparaciones: Utilizar expresiones para comparar valores Cmo escribir cdigo que compara valores numricos.

Su primer programa
Preparado para un poco de programacin real? Los vnculos siguientes le guiarn por el proceso de creacin de un programa simple y le mostrarn cmo buscar los errores del programa. Hacer que el equipo haga algo: escribir el primer procedimiento Cmo escribir cdigo que indica a su programa que realice una accin determinada. Hacer que un programa repita acciones: establecer bucles For...Next Cmo escribir cdigo que repite acciones en su programa y cuenta las veces que stas se han realizado. Hacer que un programa elija entre dos posibilidades: la instruccin If...Then Cmo escribir cdigo que hace cosas diferentes en respuesta a condiciones diferentes. Qu hacer cuando algo sale mal: control de errores Cmo escribir cdigo que controla los errores de sus programas. Tambin obtendr informacin sobre los diferentes tipos de errores.

Ms sobre Visual Basic


Los vnculos siguientes le ayudarn a ampliar sus conocimientos de programacin y del lenguaje Visual Basic. Informacin detallada: comprender propiedades, mtodos y eventos Cmo funcionan las propiedades, los mtodos y los eventos. Informacin detallada: tipos de datos Cmo se almacenan los datos utilizando los diferentes tipos de variables. Informacin detallada: convertir un tipo de variable en otro Cmo convertir datos de un tipo en otro, junto con algunos errores comunes de este proceso. Informacin detallada: utilizar Do...While y Do...Until para repetir hasta cumplir una condicin Cmo utilizar las instrucciones Do...While y Do...Until para repetir cdigo basndose en ciertas condiciones. Informacin detallada: utilizar Select Case para decidir entre varias opciones

Cmo ejecutar cdigo basndose en varias condiciones donde hay muchas elecciones. Paseo con gua por Visual Basic Ms tareas que puede realizar con el lenguaje de programacin Visual Basic.

Conceptos bsicos: funcionamiento de la programacin


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 Antes de comenzar el aprendizaje del lenguaje de programacinVisual Basic, puede resultarle til entender qu es un lenguaje de programacin y cmo funciona. Tambin puede resultarle til familiarizarse con algunos trminos que se utilizan en programacin. El mejor punto de partida es comenzar con los conceptos bsicos.

Cmo funciona la programacin


Por s solo, un equipo no es muy inteligente. Un equipo est constituido, bsicamente, por un gran nmero de conmutadores electrnicos de pequeo tamao que puede estar activados o desactivados. Al establecer diferentes combinaciones de estos modificadores, se logra que el equipo realice alguna accin, por ejemplo, que muestre algo en la pantalla o que emita un sonido. Eso es la programacin en su concepto ms bsico: decirle a un equipo qu hacer. Claro est que comprender qu combinacin de modificadores lograr que el equipo realice lo que se desea ser una difcil tarea; aqu es donde entran en juego los lenguajes de programacin.

Qu es un lenguaje de programacin?
Las personas se expresan utilizando un lenguaje compuesto de muchas palabras. Los equipos utilizan un lenguaje simple, que slo consta de ceros y unos; el 1 significa "activado" y el 0 significa "desactivado". Tratar de hablar con un equipo en su propio lenguaje sera como tratar de hablar con sus amigos utilizando el cdigo Morse; se puede hacer, pero no es necesario. Un lenguaje de programacin acta como un traductor entre el usuario y el equipo. En lugar de aprender el lenguaje nativo del equipo (conocido como lenguaje mquina), se puede utilizar un

lenguaje de programacin para dar instrucciones al equipo de un modo que sea ms fcil de aprender y entender. Un programa especializado conocido como compilador toma las instrucciones escritas en el lenguaje de programacin y las convierte en lenguaje mquina. Esto significa que, como programador de Visual Basic, no necesita entender lo que el equipo hace o cmo lo hace. Basta con que entienda cmo funciona el lenguaje de programacin de Visual Basic.

Descripcin general del lenguaje Visual Basic


El lenguaje hablado y escrito tambin posee su propia estructura: por ejemplo, un libro consta de captulos con prrafos que, a su vez, contienen frases que estn formadas por palabras. Los programas escritos en Visual Basic tambin tiene una estructura: los mdulos son como los captulos, los procedimientos como los prrafos y las lneas de cdigo como las frases. Al hablar o escribir, se utilizan distintas categoras de palabras, como nombres o verbos. Cada categora se usa segn un conjunto definido de reglas. En muchos sentidos, el lenguaje Visual Basic es muy parecido al lenguaje cotidiano. Visual Basic tambin dispone de una serie reglas que definen cmo deben utilizarse las categoras de palabras (que reciben el nombre de elementos de programacin) para escribir programas. Los elementos de programacin de Visual Basic incluyen instrucciones, declaraciones, mtodos, operadores y palabras clave. A medida que avance en las siguientes lecciones, ir aprendiendo ms sobre estos elementos y cmo utilizarlos. El lenguaje escrito y hablado tambin tiene reglas, o sintaxis, que definen el orden de las palabras en una frase. Visual Basic tambin tiene su sintaxis, al comienzo resulta extraa pero realmente es muy simple. Por ejemplo, para decir "La velocidad mxima de mi automvil es 55", se escribira: Car.Speed.Maximum = 55 Ms adelante, obtendr ms informacin acerca de la sintaxis y las herramientas de Visual Basic como, por ejemplo IntelliSense, que le servir de gua para utilizar la sintaxis correcta al escribir programas.

Representacin de palabras, nmeros y valores con variables


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007

Las variables son un concepto importante en programacin. Una variable es una letra o un nombre que puede almacenar un valor. Al crear programas, se pueden utilizar variables para almacenar nmeros, por ejemplo, el alto de un edificio, o palabras, por ejemplo, el nombre de una persona. Resumiendo, se pueden utilizar variables para representar cualquier tipo de informacin que el programa necesite. Puede surgir la pregunta, "Por qu utilizar una variable cuando en su lugar se puede utilizar simplemente la informacin?" Como su nombre indica, las variables pueden cambiar el valor que representan cuando el programa se est ejecutando. Por ejemplo, puede escribir un programa para realizar el seguimiento del nmero de caramelos que tiene en un frasco en su escritorio. Dado que los dulces se comen, es probable que la cantidad de caramelos del frasco cambie con el tiempo. En lugar de volver a escribir el programa cada vez que quiere comerse un caramelo, puede representar el nmero de caramelos con una variable que cambia con el tiempo.

Almacenar informacin en variables

Hay tres pasos para utilizar una variable: 1. 2. 3. Declarar la variable. Indicar al programa el nombre y el tipo de variable que se desea utilizar. Asignar la variable. Proporcionar un valor a la variable. Utilizar la variable. Recuperar el valor contenido en la variable y utilizarlo en el programa.

Declarar variables

Cuando declara una variable, tiene que decidir qu nombre y qu tipo de datos asignarle. Puede asignar a la variable cualquier nombre que desee, siempre y cuando el nombre empiece con una letra o un carcter de subrayado. Cuando se usa un nombre que describe el contenido de la variable, el cdigo es ms fcil de leer. Por ejemplo, una variable que controla el nmero de caramelos del frasco puede llamarse totalCandy. Una variable se declara mediante las palabras claveDim y As, como se muestra a continuacin. VB Copiar

Dim aNumber As Integer

Esta lnea de cdigo indica al programa que se desea utilizar una variable denominada aNumber, que almacene nmeros enteros (el tipo de datos Integer). Puesto que aNumber es un Integer, slo puede almacenar nmeros enteros. Por ejemplo, si desea almacenar 42,5 utilizar el tipo de datos Double. Y si desea almacenar una palabra, utilizar un tipo

de datos String. Otro tipo de datos que vale la pena mencionar en este punto es Boolean, que puede almacenar un valor True o False. Aqu hay ms ejemplos de cmo declarar las variables. VB Copiar

Dim aDouble As Double Dim aName As String Dim YesOrNo As Boolean

Nota:
Puede crear una variable local sin declarar el tipo de la variable utilizando la inferencia de tipos de variable local. Al utilizar la inferencia de tipos de variable local, el valor que le asigna determina el tipo de la variable. Para obtener ms informacin, vea Inferencia de tipo de variable local.

Para obtener ms informacin sobre otros tipos de variable, vea Informacin detallada: tipos de datos.

Asignar variables

Se asigna un valor a la variable con el signo =, que a veces se denomina operador de asignacin, como se muestra en el ejemplo siguiente. VB Copiar

aNumber = 42

Esta lnea de cdigo toma el valor 42 y lo almacena en la variable declarada previamente denominada aNumber.

Declarar y asignar variables con un valor predeterminado

Como se mostr anteriormente, puede declarar una variable en una lnea de cdigo y asignar ms adelante el valor en otra lnea. Esto puede producir un error si intenta utilizar la variable antes de asignarle un valor. Por esa razn, es mejor declarar y asignar las variables en una lnea nica. Aunque no sepa an el valor que contendr la variable, puede asignar un valor predeterminado. El cdigo para declarar y asignar las mismas variables mostradas anteriormente ser similar al siguiente. VB Copiar

Dim aDouble As Double = 0 Dim aName As String = "default string" Dim YesOrNo As Boolean = True

Si declara las variables y asigna los valores predeterminados en una sola lnea, puede evitar posibles errores. Todava puede utilizar la asignacin para dar despus un valor diferente a la variable.

Intntelo

En este ejercicio, escribir un breve programa que crea cuatro variables, les asigna valores y a continuacin muestra cada valor en una ventana llamada cuadro de mensaje. Comencemos creando el proyecto donde se almacenar el cdigo.

Para crear el proyecto


1. 2. 3. 4. Si an no est abierto, abra Visual Basic desde el men Inicio de Windows. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Variables y haga clic en Aceptar. Visual Basic crear los archivos para el programa y abrir el Diseador de Windows Forms. A continuacin, crear las variables.

Para crear las variables y mostrar sus valores


1. Haga doble clic en el formulario para abrir el Editor de cdigo. El Editor de cdigo abrir una seccin de cdigo llamada Form1_Load. Esta seccin de cdigo es un controlador de eventos, que tambin se conoce como procedimiento. El cdigo que escribe en este procedimiento corresponde a las instrucciones que se realizarn cuando el formulario se cargue por primera vez en la memoria.

2.

En el procedimiento Form1_Load, escriba el siguiente cdigo. VB Copiar

Dim aInteger As Integer = 42 Dim aSingle As Single = 39.345677653 Dim aString As String = "I like candy" Dim aBoolean As Boolean = True

Este cdigo declara cuatro variables y asigna sus valores predeterminados. Las cuatro variables son Integer, Single, String y Boolean.

Sugerencia:
Al escribir el cdigo, quiz haya observado que despus de escribir As, aparece una lista de palabras bajo el cursor. Esta caracterstica se llama IntelliSense. Permite escribir las primeras letras de una palabra hasta que se seleccione la palabra en la lista. Una vez seleccionada, presione la tecla TAB para finalizar la palabra.

Nota:
Siempre que representa texto real en un programa, ste debe aparecer entre comillas (""). Esto le dice al programa que interprete el texto como texto real en lugar de interpretarlo como un nombre de variable. Cuando asigna un valor True o False a una variable Boolean, la palabra no se encierra entre comillas, porque True y False son palabras clave de Visual Basic, con significados especiales propios.

3.

Debajo del cdigo que escribi en el paso anterior, escriba lo siguiente. VB Copiar

MsgBox(aInteger) MsgBox(aSingle) MsgBox(aString)

MsgBox(aBoolean)

Este cdigo indica al programa que muestre cada valor que asign en el paso anterior en una nueva ventana, utilizando la funcinMsgBox. 4. Presione F5 para ejecutar el programa. Haga clic en Aceptar para cada cuadro de mensaje que aparezca. Observe que se muestra cada vez el valor de cada variable. Puede cerrar el formulario haciendo clic en la x situada en la esquina superior derecha del formulario. Cuando haya finalizado el programa, puede volver y cambiar los valores que se asignaron en el cdigo; compruebe que los nuevos valores aparecen la siguiente vez que ejecute el programa.

Palabras y texto: utilizar variables de cadena para organizar palabras


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a utilizar el tipo de datos String para representar palabras y texto. En la leccin anterior, se mostraba cmo usar las variables para almacenar datos en un programa y que cada variable debe ser del tipo adecuado para los datos que almacenar. En esta leccin, aprender sobre el tipo de datos String utilizado para almacenar el texto.

Qu es una cadena?

Una cadena es cualquier serie de caracteres de texto, como letras, nmeros, caracteres especiales y espacios. Las cadenas pueden ser frases y oraciones legibles, como "El rpido zorro de color caf salta sobre el perro perezoso" o una combinacin aparentemente ininteligible como "@#fTWRE^3 35Gert". Las variables String se crean del mismo modo que otras variables, es decir, declarando primero la variable y asignndole despus un valor, tal y como se muestra a continuacin. VB

Copiar

Dim aString As String = "This is a string"

Al asignar un texto real (tambin denominado literales de cadena) a una variable String, el texto debe estar entre comillas (""). Tambin puede utilizar el carcter = para asignar una variable String a otra variable String, como se muestra en este ejemplo. VB Copiar

Dim aString As String = "This is a string"

Dim bString As String = "" bString = aString

El cdigo anterior establece el valor de bString en el mismo valor que aString (This is a string). Puede usar el carcter & para combinar dos o ms cadenas secuencialmente en una nueva cadena, tal y como se muestra a continuacin. Esta operacin tambin recibe el nombre de concatenacin. VB Copiar

Dim aString As String = "using string" Dim bString As String = "variables" Dim cString As String = "" cString = aString & bString

El ejemplo anterior declara tres variables de String y asigna respectivamente "using string" y "variables" a las dos primeras, y luego asigna los valores combinados de las dos primeras a la tercera variable. Cul cree que es el valor de cString? Le sorprender saber que el valor es using stringvariables ya que no hay ningn espacio al final de aString ni al inicio de bString. Las dos cadenas simplemente estn unidas. Si desea agregar espacios o cualquier otro smbolo entre dos cadenas, deber hacerlo mediante un literal de cadena, como " ", tal y como se muestra a continuacin.

VB Copiar

Dim aString As String = "using string" Dim bString As String = "variables" Dim cString As String = "" cString = aString & " " & bString

Ahora, el texto incluido en cString dice using string variables.

Intntelo

Para unir las cadenas


1. 2. En el men Archivo, haga clic en Nuevoproyecto. En el cuadro de dilogo Nuevo proyecto: a. En el panel Plantillas, haga clic en Aplicacin para Windows. b. En el cuadro Nombre, escriba Concatenacin. c. Haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 3. 4. Haga doble clic en el formulario para abrir el Editor de cdigo. En el procedimiento del evento Form1.Load, declare cuatro variables de cadena y asigne los valores de cadena, tal y como se muestra a continuacin: VB Copiar

Dim aString As String = "Concatenating" Dim bString As String = "Without" Dim cString As String = "With" Dim dString As String = "Spaces"

5.

Agregue el siguiente cdigo para concatenar las cadenas y mostrar los resultados: VB

Copiar

' Displays "ConcatenatingWithoutSpaces". MsgBox(aString & bString & dString)

' Displays "Concatenating With Spaces". MsgBox(aString & " " & cString & " " & dString)

6.

Presione F5 para ejecutar el programa. El texto mostrado en el cuadro de mensaje es el resultado de la unin de las variables de cadena asignadas en un paso anterior. En el primer cuadro, las cadenas estn unidas sin espacios. En el segundo, los espacios se insertan explcitamente entre cada cadena.

Matrices: variables que representan ms de un valor


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a utilizar matrices para almacenar grupos de valores. Tal y como se ha explicado en las lecciones anteriores, las variables se usan para almacenar diferentes tipos de datos que el programa utiliza. Hay otro tipo de variable denominado matriz que proporciona una manera conveniente de almacenar diversos valores del mismo tipo. Por ejemplo, supongamos que est escribiendo un programa para un equipo de bisbol y desea almacenar los nombres de todos los jugadores que se encuentran en el campo de juego. Puede crear nueve variables de cadenas distintas, una para cada jugador, o puede declarar una variable de matriz que se parezca al cdigo que se muestra a continuacin. VB Copiar

Dim players() As String

Una variable de matriz se declara colocando parntesis despus del nombre de la variable. Si se sabe por anticipado cuntos valores deben almacenarse, tambin se puede especificar el tamao de la matriz en la declaracin de la siguiente manera. VB Copiar

Dim players(8) As String

El tamao de la matriz es 9 porque un equipo del bisbol tiene 9 jugadores. Una matriz est formada por una serie de valores, o elementos, que comienzan con el elemento 0 y terminan con un nmero inferior al especificado en la declaracin. En este caso, la matriz contiene los elementos 0 a 8, de un total de nueve. Si desea hacer referencia a uno de los jugadores del equipo, basta con que reste 1. Por ejemplo, para hacer referencia al primer jugador, debe hacer referencia al elemento 0, para hacer referencia al noveno jugador, debe hacer referencia al elemento 8.

Asignar valores a las matrices

Al igual que ocurre con otros tipos de valores, es necesario asignar valores a las matrices. Para ello, debe hacer referencia al nmero del elemento como parte de la asignacin, tal y como se muestra a continuacin. VB Copiar

players(0) = "John" players(3) = "Bart"

En el cdigo anterior, el valor John se asigna al primer elemento de la matriz (elemento 0) y el valor Bart se asigna al cuarto elemento (elemento 3). Los elementos de la matriz no se tienen que asignar en orden y cualquier elemento sin asignar tendr un valor predeterminado; en este caso, una cadena vaca. Al igual que con otros tipos de valores, puede declarar y asignar los valores a una matriz en una lnea nica de la siguiente manera. VB Copiar

Dim players() As Integer = {1, 2, 3, 4, 5, 6, 7, 8, 9}

En este caso, las llaves indican una lista de valores. Los valores se asignan a los elementos en el orden mostrado. Observe que no se especifica el tamao de la matriz, lo determina el nmero de elementos que se muestran.

Recuperar valores de las matrices

Al igual que se usan nmeros para especificar la posicin de un elemento en una matriz, para especificar el valor que se desea recuperar se utiliza el nmero de elemento. VB Copiar

Dim AtBat As String AtBat = players(3)

El cdigo anterior recupera el cuarto elemento de la matriz y lo asigna a la variable de cadena AtBat.

Intntelo

Para almacenar los valores en una matriz


1. 2. 3. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba MyFirstArray y, a continuacin, haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. 6. 7. En el Cuadro de herramientas, arrastre un control Textbox al formulario. En el Cuadro de herramientas, arrastre un control Button al formulario. Haga doble clic en Button para abrir el Editor de cdigo. En el procedimiento de evento Button1_Click, agregue el siguiente cdigo: VB Copiar

Dim players() As String = {"Dan", "Fred", "Bart", "Carlos", _ "Ty", "Juan", "Jay", "Sam", "Pedro"} Dim i As Integer = CInt(Textbox1.Text) MsgBox(players(i) & " is on first base.")

Observe que el cdigo anterior usa la funcin CInt para convertir el valor String (TextBox1.Text) en un valor Integer (i). Puede obtener ms informacin sobre las conversiones en Informacin detallada: convertir un tipo de variable en otro. 8. 9. Presione F5 para ejecutar el programa. Escriba un nmero comprendido entre 0 y 8 en el cuadro de texto y haga clic en el botn. Se muestra el nombre que corresponde a ese elemento en un cuadro de mensaje.

Sugerencia:
Debera escribir cdigo adicional para comprobar que los datos escritos son vlidos. Por ejemplo, puede comprobar que el valor escrito es un valor numrico comprendido entre 0 y 8. Para obtener ms informacin, consulte Qu hacer cuando algo sale mal: control de errores.

Aritmtica: crear expresiones con variables y operadores


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a crear expresiones para realizar operaciones aritmticas y devolver valores. Una expresin es un segmento de cdigo que realiza operaciones aritmticas y, a continuacin, devuelve un valor. En el siguiente ejemplo se muestra una expresin de suma simple: 5+4

La expresin 5 + 4, cuando se evala, devuelve el valor 9, y est formada por dos partes: los operandos (5 y 4), que son los valores con los que se realiza la operacin, y el operador (+), que especifica la operacin que se va a realizar.

Utilizar valores devueltos por expresiones

Para que una expresin sea til, se debe realizar una accin con el valor que se devuelve. Lo ms comn es asignar el valor a una variable, tal y como se muestra a continuacin. VB Copiar

Dim anInteger As Integer = 5 + 4

Este ejemplo declara una nueva variable Integer, llamada anInteger y le asigna el valor devuelto por 5 +4.

Operadores aritmticos

Las expresiones habitualmente se utilizan para realizar operaciones aritmticas con variables: suma, resta, multiplicacin o divisin. En la tabla siguiente se describen los operadores que se usan con ms frecuencia en las operaciones aritmticas.

Operador
+ (suma)

Descripcin
Devuelve la suma de dos operandos

Ejemplo
5+4

- (resta)

Devuelve la diferencia de dos operandos

5-4

* (multiplicacin)

Devuelve el producto de dos operandos

5*4

/ (divisin)

Devuelve el cociente de dos operandos

5/4

El tipo de variable utilizado para realizar la operacin aritmtica puede afectar al resultado. La divisin de dos nmeros a menudo da como resultado un valor que no es un nmero entero. Por ejemplo, cuando se divide 3 por 2, el resultado es 1,5. Si se asigna el valor devuelto de esa expresin a una variable Integer, se redondear al nmero entero ms cercano. Al realizar la divisin, se debe utilizar una variable Double para almacenar el valor devuelto.

Nota:
Tambin se puede convertir una variable de un tipo de datos en otra mediante las funciones de conversin de Visual Basic. Para obtener ms informacin, vea Informacin detallada: convertir un tipo de variable en otro.

Intntelo

Para sumar nmeros


1. 2. 3. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Arithmetic y haga clic en Aceptar. Se abrir un nuevo proyecto de formularios Windows Forms. 4. 5. 6. 7. En el Cuadro de herramientas, arrastre dos controles Textbox al formulario. En el Cuadro de herramientas, arrastre un control Button al formulario. Haga doble clic en Button para abrir el Editor de cdigo. En el procedimiento de evento Button1_Click, escriba el siguiente cdigo. VB Copiar

Dim A As Double = Textbox1.Text Dim B As Double = Textbox2.Text

MsgBox(A + B) MsgBox(A - B) MsgBox(A * B) MsgBox(A / B)

Las dos primeras lneas declaran las variables A y B. A y B contendrn los valores numricos utilizados en este programa y asignarn los valores de los dos controles TextBox (su texto) a las variables A y B.

Las cuatro lneas finales crean expresiones con las dos variables y cada uno de los operadores aritmticos bsicos y muestran los resultados de esas expresiones en un cuadro de mensaje. 8. 9. Presione F5 para ejecutar la aplicacin. Escriba un nmero en cada cuadro de texto y haga clic en Button1.

Nota:
Si escribe algn otro carcter en los cuadros de texto, se producir un error.

10. Las expresiones se crean usando los dos nmeros que se escriben y uno de los cuatro operadores aritmticos bsicos (suma, resta, multiplicacin y divisin). El resultado de cada expresin se muestra en un cuadro de mensaje.

Comparaciones: Utilizar expresiones para comparar valores


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre cmo utilizar los operadores de comparacin para crear expresiones que comparan valores. En la ltima leccin, vimos cmo utilizar operadores aritmticos para crear expresiones numricas y devolver valores numricos. Se puede utilizar otro tipo de operador, los operadores de comparacin, para comparar valores numricos y devolver valores Boolean (True o False). Los operadores de comparacin se utilizan frecuentemente para comparar valores y tomar decisiones basadas en esa comparacin. La toma de decisiones en el programa se tratar exhaustivamente en Hacer que un programa elija entre dos posibilidades: la instruccin If...Then. La siguiente tabla resume los operadores de comparacin:

Operador
= (igual)

Descripcin
Devuelve True si el nmero del lado izquierdo es igual al nmero del lado derecho.

Ejemplos
5 = 4 (falso) 4 = 5 (falso)

4=4 (verdadero)

<> (distinto de)

Devuelve True si el nmero de la izquierda no es igual al nmero de la derecha.

5 <> 4 (True) 4 <> 5 (True) 4 <> 4 (False)

> (mayor que)

Devuelve True si el nmero de la izquierda es mayor que el nmero de la derecha.

5 > 4 (True) 4 > 5 (False) 4 > 4 (False)

< (menor que)

Devuelve True si el nmero de la izquierda es menor que el nmero de la derecha.

5 < 4 (False) 4 < 5 (True) 4 < 4 (False)

>= (mayor o igual que)

Devuelve True si el nmero de la izquierda es mayor o igual que el nmero de la derecha.

5 >= 4 (True) 4 >= 5 (False) 4 >= 4 (True)

<= (menor o igual que)

Devuelve True si el nmero de la izquierda es menor o igual que el nmero de la derecha.

5 <= 4 (False) 4 <= 5 (True) 4 <= 4 (True)

Intntelo

Para comparar expresiones


1. 2. 3. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Comparison y haga clic en Aceptar. Se abrir un nuevo proyecto de formularios Windows Forms. 4. 5. En el Cuadro de herramientas, arrastre dos controles Textbox al formulario. En el Cuadro de herramientas, arrastre un control Button al formulario.

6. 7.

Haga doble clic en Button para abrir el Editor de cdigo. En el controlador de eventos Button1_Click, escriba el siguiente cdigo: VB Copiar

Dim A As Double = CDbl(Textbox1.Text) Dim B As Double = CDbl(Textbox2.Text) MsgBox(A > B) MsgBox(A < B) MsgBox(A = B)

Las dos primeras lneas declaran las variables A y B, que contendrn los valores numricos usados en este programa; utilizan la instruccin CDbl para convertir el texto de Textbox1 y Textbox2 en valores numricos. Finalmente, las ltimas tres lneas crean expresiones que permiten comparar las dos variables mediante tres operadores de comparacin bsicos y muestran los resultados de esas expresiones en tres cuadros de mensaje. 8. 9. Presione F5 para ejecutar la aplicacin. Escriba un nmero en cada uno de los cuadros de texto y haga clic en Button1. El primer cuadro de mensaje mostrar True si A (el nmero que escribi en el primer cuadro de texto) es mayor que B (el nmero que escribi en el segundo cuadro de texto); de lo contrario, mostrar False. El segundo cuadro de mensaje mostrar True si A es menor que B, y el tercer cuadro de mensaje mostrar True si ambos nmeros son iguales. Pruebe a escribir diferentes nmeros en los cuadros de texto para ver cmo cambian los resultados.

Informacin detallada: convertir un tipo de variable en otro


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007

Como se explic en lecciones anteriores, hay distintos tipos de variables. El tipo determina la clase de datos que puede contener una variable. Una variable de tipo Integer slo puede contener datos numricos sin separadores decimales. Una variable de tipo String slo puede contener texto. Qu pasa cundo desea mostrar un valor Integer en un control TextBox que requiere una variable de tipo String? La respuesta es que los datos se deben convertir de un tipo a otro. En este tema, estudiar cmo convertir los datos de un tipo en otro y aprender algunas tcnicas utilizadas para la conversin de datos, as como algunos de sus problemas habituales.

Convertir variables en texto

Cada variable de Visual Basic se puede convertir en texto usando una funcin especial llamada CStr (que es la abreviatura del ingls Convert to String: convertir en cadena). Esta funcin, como el nombre implica, devuelve los datos representados por la variable como de tipo String. El procedimiento siguiente muestra un ejemplo sencillo de convertir un valor Integer en texto.

Intntelo!

Para convertir una variable en texto


1. 2. 3. En el men Archivo, haga clic en Nuevoproyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Conversion y haga clic en Aceptar. Se abrir un nuevo proyecto de formularios Windows Forms. 4. 5. Haga doble clic en el formulario para abrir el Editor de cdigo. En el controlador del evento Form1_Load, escriba el siguiente cdigo. VB Copiar

Dim anInteger As Integer = 54 MsgBox(CStr(anInteger))

Este cdigo declara una variable de tipo entero llamada anInteger, le asigna un valor de 54 y, a continuacin, convierte ese valor en texto y lo muestra en un cuadro de mensaje llamando a la funcin CStr. 6. Presione F5 para compilar y ejecutar la aplicacin. Aparece un cuadro de mensaje que indica 54.

Probemos algo slo por diversin. En el Editor de cdigo, cambie la lnea que indica MsgBox(CStr(anInteger)) para que indique MsgBox(anInteger) y presione F5 para ejecutarla. Qu pasa? El programa se comporta exactamente igual que antes. Visual Basic es lo suficientemente inteligente para saber que realmente desea convertir la variable de tipo Integer en texto para que aparezca en el cuadro de mensaje. Sin embargo, no puede confiar en este comportamiento para todas las clases: existen muchos tipos de variables que no se pueden convertir automticamente. Por consiguiente, es una buena prctica usar siempre la funcin CStr, aun cuando una variable se convertira automticamente en texto. Adems de la conversin de variables Integer en texto, se puede utilizar la funcin CStr en cualquier tipo de dato numrico, como Double o Long. Tambin se puede utilizar para convertir la informacin de Date y tipos de datos Boolean en texto. Para obtener ms informacin sobre los tipos de datos, vea Informacin detallada: tipos de datos.

Conversin entre tipos de datos numricos

Como aprendi en la leccin aritmtica, a veces el resultado de una operacin aritmtica no se puede expresar como un valor de tipo Integer. Al igual que Visual Basic tiene una funcin para convertir nmeros en texto, tambin tiene funciones para convertir variables de un tipo de datos numricos en otro. Por ejemplo, puede utilizar la funcin CDbl (de Convert to Double) en una operacin aritmtica para devolver un nmero fraccionario al trabajar con variables de tipo Integer. El procedimiento siguiente muestra cmo utilizar la funcin CDbl al dividir dos enteros.

Intntelo!

Para convertir tipos de datos numricos


1. En el Editor de cdigo, elimine el cdigo que escribi en el procedimiento anterior y escriba lo siguiente: VB Copiar

Dim A As Integer = 1 Dim B As Integer = 2 MsgBox(CDbl(A / B))

Este cdigo declara dos variables de tipo Integer (A y B), les asigna los valores 1 y 2 y, a continuacin, convierte el resultado de la operacin de divisin (A / B) utilizando la funcin CDbl y lo muestra en un cuadro de mensaje.

2.

Presione F5 para compilar y ejecutar la aplicacin. Aparece un cuadro de mensaje que indica 0.5.

Visual Basic tambin tiene funciones para otros tipos de variables numricas. Por ejemplo, si agrega dos variables de tipo Double y desea redondear el resultado al nmero entero ms cercano, utilice la funcin CInt. Otras funciones de conversin numricas son CByte, CDec, CLng y CShort. Para obtener una lista de todas las funciones de conversin de Visual Basic, vea Funciones de conversin de tipos.

Hacer que el equipo haga algo: escribir el primer procedimiento


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a crear un procedimiento, es decir, un bloque de cdigo independiente que puede ejecutarse desde otros bloques de cdigo. A continuacin, aprender a crear parmetros para los procedimientos. Un procedimiento es simplemente un bloque de cdigo que indica al programa que realice una accin. Aunque es posible que no lo haya notado, ya se han utilizado procedimientos en las lecciones anteriores. Por ejemplo, la funcin MsgBox tiene un procedimiento integrado que realiza la accin de mostrar un cuadro de dilogo. Mientras Visual Basic tiene muchos procedimientos integrados para realizar las acciones comunes, siempre habr casos en que se desea que el programa realice una accin que un procedimiento integrado no puede controlar. Por ejemplo, la funcin MsgBox no puede mostrar un cuadro de dilogo que contenga una imagen. Es necesario escribir un procedimiento para realizar esta tarea.

Qu es un procedimiento?

Un procedimiento es un bloque de cdigo independiente que se puede ejecutar desde otros bloques de cdigo. En general, cada procedimiento contiene el cdigo necesario para realizar una tarea. Pongamos, por ejemplo, que dispone de un procedimiento denominado PlaySound que contiene el cdigo necesario para reproducir un archivo de onda. Aunque puede escribir el mismo cdigo para reproducir un sonido cada vez que el programa tenga que realizar un ruido, tiene ms sentido crear un procedimiento nico al que se pueda llamar en cualquier parte del programa. Un procedimiento se ejecutallamndolo en el cdigo. Por ejemplo, para ejecutar el procedimiento PlaySound, basta con que agregue una lnea de cdigo con el nombre del procedimiento, tal y como se muestra a continuacin.

PlaySound() Es todo lo que tiene que hacer. Cuando el programa llegue a esa lnea, ir al procedimiento PlaySound y ejecutar el cdigo all contenido. A continuacin, el programa regresa a la siguiente lnea que viene despus de la llamada a PlaySound. Puede llamar a tantos procedimientos como desee. Los procedimientos se ejecutan en el orden de llamada. Por ejemplo, podra tener tambin un procedimiento denominado DisplayResults; para ejecutarlo despus de ejecutar el procedimiento PlaySounds, llame a los procedimientos tal y como se muestra a continuacin. PlaySounds() DisplayResults()

Funciones y Subs

Existen dos tipos de procedimientos: las funciones y las subrutinas (tambin denominadas sub). Una funcin devuelve un valor al procedimiento que la llam, mientras que una subrutina simplemente ejecuta cdigo. Se llama a una subrutina cuando una lnea de cdigo, que contiene el nombre de sta, se agrega al programa como en el siguiente ejemplo. DisplayResults Las funciones son diferentes, porque las funciones no slo ejecutan cdigos, tambin devuelven un valor. Por ejemplo, imagine una funcin llamada GetDayOfWeek que devuelve un Integer que indica el da de la semana. Se llama a esta funcin declarando primero una variable para almacenar el valor devuelto y asignando despus el valor devuelto a la variable para un uso posterior, tal y como se muestra a continuacin. Dim Today As Integer Today = GetDayOfWeek En este ejemplo, el valor devuelto por la funcin se copia a la variable denominada Today y se almacena para un uso posterior.

Escribir procedimientos

Los procedimientos se escriben colocando primero una declaracin de procedimiento. Una declaracin de procedimiento realiza varias acciones. Indica si el procedimiento es una funcin o una subrutina, asigna un nombre al procedimiento y detalla todos los parmetros que puede tener. (Los parmetros se analizarn en profundidad ms adelante en esta leccin.) A continuacin, se ofrece un ejemplo de una declaracin de procedimiento sencilla. VB Copiar

Sub MyFirstSub() End Sub

La palabra clave Sub indica al programa que este procedimiento es una subrutina y no devolver un valor. El nombre de la subrutina (MyFirstSub) viene a continuacin y el parntesis vaco indica que no hay parmetros para este procedimiento. Finalmente, la palabra clave End Sub indica el fin de la subrutina. Todos los cdigos que tiene que ejecutar esta subrutina van entre estas dos lneas. Declarar funciones es similar, pero, adems, se debe especificar el tipo de valor devuelto (como por ejemplo,Integer, String, etc.). Por ejemplo, una funcin que devolvi un valor Integer puede ser similar a la siguiente. VB Copiar

Function MyFirstFunction() As Integer End Function

Las palabras clave As Integer indican que la funcin devolver un valor Integer . Para devolver un valor desde una funcin, utilice la palabra clave Return, como se muestra en el ejemplo siguiente. VB Copiar

Function GetTheNumberOne() As Integer Return 1 End Function

Este procedimiento devolver el nmero 1.

Intntelo

Para crear procedimientos


1. En el men Archivo, haga clic en Nuevo proyecto.

2. 3.

En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba MyFirstProcedure y, a continuacin, haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms.

4. 5.

Haga doble clic en el formulario para abrir el Editor de cdigo. En el Editor de cdigo, busque la lnea que contiene End Class. Esta lnea indica el final de la seccin de cdigo que compone el formulario. Inmediatamente antes de esta lnea, agregue el siguiente procedimiento: VB Copiar

Function GetTime() As String Return CStr(Now) End Function

Esta funcin usa el procedimiento integrado Now para recibir la hora actual y, a continuacin, utiliza la funcin CStr para convertir el valor devuelto por Now en un valor de tipo String legible. Finalmente, ese valor String se devuelve como el resultado de la funcin. 6. Sobre la funcin que agreg en el paso anterior, agregue el siguiente Sub. VB Copiar

Sub DisplayTime() MsgBox(GetTime) End Sub

Esta subrutina llama a la funcin GetTime y muestra el resultado que devolvi en un cuadro de mensaje. 7. Finalmente, agregue una lnea al controlador del evento Form1_Load que llama a la subrutina DisplayTime, tal y como se muestra en el siguiente ejemplo. VB Copiar

DisplayTime()

8.

Presione F5 para ejecutar el programa. Cuando el programa se inicia, se ejecuta el procedimiento de evento Form1_Load. Este procedimiento llama a la subrutina DisplayTime, de manera que la ejecucin del programa va al procedimiento de subrutina DisplayTime. Esa subrutina a su vez llama a la funcin GetTime, por lo que la ejecucin del programa va a la funcin GetTime. Esta funcin devuelve una String que representa el tiempo para el procedimiento de subrutina DisplayTime, el que muestra esa cadena en un cuadro de mensaje. Despus de que la subrutina termina de ejecutarse, el programa contina normalmente y muestra el formulario.

Parmetros en funciones y subrutinas

A veces, ser necesario suministrar informacin adicional a los procedimientos. Por ejemplo, en el procedimiento PlaySound, se desea reproducir uno de varios sonidos diferentes. La informacin acerca de qu sonido debe reproducirse puede suministrarse utilizando parmetros. Los parmetros se parecen mucho a las variables. Tienen un tipo y un nombre y almacenan informacin al igual que las variables. Se pueden utilizar como variables en un procedimiento. Existen dos diferencias principales entre los parmetros y las variables:

Los parmetros se declaran en la declaracin de procedimiento, no en lneas individuales de cdigo. Slo se pueden utilizar los parmetros en el procedimiento en el que se declaran.

Los parmetros se declaran en la declaracin de procedimiento, en los parntesis que siguen al nombre del procedimiento. La palabra clave As se utiliza para declarar el tipo y la palabra clave ByVal precede generalmente a cada parmetro. Visual Basic agregar automticamente esta palabra clave si no se agrega, sta tiene una funcin bastante avanzada que va ms all de los temas tratados en esta leccin. A continuacin, se muestra un ejemplo de una subrutina con parmetros. VB Copiar

Sub PlaySound(ByVal SoundFile As String, ByVal Volume As Integer) My.Computer.Audio.Play(SoundFile, Volume) End Sub

Despus, se llamar a la subrutina con los valores para los parmetros, tal y como se muestra a continuacin. VB Copiar

PlaySound("Startup.wav", 1)

Los parmetros para las funciones tambin pueden declararse del mismo modo que hara con las subrutinas.

Intntelo

Para crear una funcin con parmetros


1. 2. 3. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba parameters y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. 6. 7. En el Cuadro de herramientas, arrastre dos controles Textbox al formulario. En el Cuadro de herramientas, arrastre un control Button al formulario. Haga doble clic en Button para abrir el Editor de cdigo. Inmediatamente despus de la lnea End Sub del controlador de eventos Button1_Click, agregue el siguiente procedimiento: VB Copiar

Function AddTwoNumbers(ByVal N1 As Integer, ByVal N2 As Integer) _ As Integer Return N1 + N2 End Function

8.

En el procedimiento Button1_Click, agregue el cdigo siguiente: VB

Copiar

Dim aNumber As Integer = CInt(Textbox1.Text) Dim bNumber As Integer = CInt(Textbox2.Text) MsgBox(AddTwoNumbers(aNumber, bNumber))

Este cdigo declara dos enteros y convierte el texto de los dos cuadros de texto en valores enteros. Luego pasa dichos valores a la funcin AddTwoNumbers y muestra el valor devuelto en un cuadro de mensaje. 9. Presione F5 para ejecutar el programa. 10. Escriba un valor numrico en cada cuadro de texto y haga clic en el botn. Se sumarn los dos nmeros y el resultado se mostrar en un cuadro de mensaje.

Hacer que un programa repita acciones: establecer bucles For...Next


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a utilizar la instruccin For...Next para repetir las acciones en el programa y para contar cuntas veces se han realizado estas acciones. Cuando escribe un programa, debe repetir las acciones con frecuencia. Por ejemplo, suponga que est escribiendo un mtodo que muestra una serie de nmeros en pantalla. Desear repetir la lnea de cdigo que muestra el nmero las veces que sea necesario. El bucle For...Next le permite especificar un nmero y repetir un cdigo contenido dentro de ese bucle para el nmero especfico de veces. El siguiente ejemplo muestra cmo aparece un bucle For...Next en un cdigo. VB Copiar

Dim i As Integer = 0 For i = 1 To 10 DisplayNumber(i) Next

El bucle For...Next comienza con una variable de contador, i. sta es una variable que utiliza el bucle para contar la cantidad de veces que se ha ejecutado. La siguiente lnea (For i = 1 to 10) le dice al programa cuntas veces se debe repetir el bucle y los valores i que va a tener. Cuando el cdigo entra en el bucle For...Next, se inicia con i que contiene el primer valor, en este caso 1. El programa ejecuta las lneas de cdigo entre la lnea For y la lnea Next, en este caso llamando al mtodo DisplayNumber con un parmetro de i (en este caso tambin 1). Cuando se alcanza la lnea Next, se agrega 1 a i y la ejecucin de programa regresa nuevamente a la lnea For. Esto se repite hasta que el valor de i es mayor que el segundo nmero en la lnea For, en este caso 10. Cuando esto sucede, el programa contina con cualquier cdigo despus de la lnea Next.

Intntelo

Para utilizar la instruccin For...Next


1. 2. 3. En el men Archivo, seleccione Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba ForNext y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. 6. En el Cuadro de herramientas, arrastre un control TextBox y un control Button al formulario. Haga doble clic en Button para abrir el Editor de cdigo. En el controlador de eventos Button1_Click, escriba el siguiente cdigo: VB Copiar

Dim i As Integer = 0 Dim NumberOfRepetitions As Integer = CInt(Textbox1.Text) For i = 1 To NumberOfRepetitions MsgBox("This line has been repeated " & i & " times")

Next

7. 8.

Presione F5 para ejecutar el programa. En el cuadro de texto, escriba un nmero y haga clic en el botn. Aparece un Cuadro de mensaje las veces indicadas en el cuadro de texto.

Hacer que un programa elija entre dos posibilidades: la instruccin If...Then


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a utilizar la instruccin If...Then para ejecutar el cdigo basado en condiciones. Los programas deben realizar diferentes acciones en respuesta a distintas condiciones. Por ejemplo, quiz desee que el programa compruebe qu da de la semana es y haga algo diferente dependiendo del da. La instruccin If...Then permite evaluar una condicin y ejecutar las diferentes secciones de cdigo basndose en los resultados de esa condicin. El siguiente ejemplo muestra cmo funciona la instruccin If...Then. VB Copiar

If My.Computer.Clock.LocalTime.DayOfWeek = DayOfWeek.Monday Then MsgBox("Today is Monday!") End If

Cuando se ejecuta este cdigo, se evala la condicin (la parte entre If y Then). Si la condicin es true, se ejecuta la siguiente lnea de cdigo y se muestra un cuadro de mensaje; si es false, el cdigo pasa a la lnea End If. En otras palabras, el cdigo estipula "Si hoy es lunes, muestre el mensaje".

Intntelo

Para utilizar la instruccin If...Then


1. 2. 3. En el men Archivo, seleccione Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba IfThen y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. Haga doble clic en el formulario para abrir el Editor de cdigo. En el controlador de eventos Form1_Load, escriba el siguiente cdigo. VB Copiar

If My.Computer.Clock.LocalTime.DayOfWeek = DayOfWeek.Saturday Or _ My.Computer.Clock.LocalTime.DayOfWeek = DayOfWeek.Sunday Then MsgBox("Happy Weekend!") End If

6.

Presione F5 para ejecutar el programa. Si hoy es sbado o domingo, aparecer un cuadro de mensaje indicndole Happy Weekend!. De lo contrario, no aparecer ningn cuadro de mensaje.

7.

En el men Depurar, seleccione Detener depuracin para finalizar el programa. Mantenga abierto este proyecto. Se utilizar en el siguiente procedimiento, "Para utilizar la clusula Else".

Es posible que haya observado en el ejemplo anterior que la instruccin If...Then utiliz el operador Or para evaluar varias condiciones ("Si es sbado Or si es domingo"). Puede utilizar los operadores Or y And para evaluar tantas condiciones como desee en una instruccin If...Then nica.

La clusula Else

Ha visto cmo utilizar la instruccin If...Then para ejecutar el cdigo si una condicin es true, pero qu pasa si desea ejecutar un cdigo si una condicin es true, pero otro si es false? En este caso, puede utilizar la clusula Else. La clusula Else le permite especificar un bloque de cdigos que se ejecutar si la condicin es false. El siguiente ejemplo muestra cmo funciona la clusula Else.

VB Copiar

If My.Computer.Clock.LocalTime.DayOfWeek = DayOfWeek.Friday Then MsgBox("Today is Friday!") Else MsgBox("It isn't Friday yet!") End If

En este ejemplo, se evala la expresin; si es true, se ejecuta la siguiente lnea de cdigo y se muestra el primer cuadro de mensaje. Si es false, el cdigo se desplaza a la clusula Else y se ejecuta la lnea Else siguiente, que muestra el segundo cuadro de mensaje.

Intntelo

Este procedimiento comienza donde finaliz "Para utilizar la instruccin If... Then". Si no complet "Para utilizar la instruccin If... Then", debe hacerlo antes de continuar.

Para utilizar la clusula Else


1. Cambie el cdigo en la instruccin If...Then de la siguiente forma. VB Copiar

If My.Computer.Clock.LocalTime.DayOfWeek = DayOfWeek.Saturday Or _ My.Computer.Clock.LocalTime.DayOfWeek = DayOfWeek.Sunday Then MsgBox("Happy Weekend!") Else MsgBox("Happy Weekday! Don't work too hard!") End If

2.

Presione F5 para ejecutar el programa. El programa mostrar ahora un cuadro de mensaje que indica si es un fin de semana o un da de la semana, con contenido adecuado.

Nota:
Para cambiar el da de la semana haga doble clic en la hora en la barra de tareas de Windows, si desea probar la ejecucin de los dos bloques de cdigo. (La barra de tareas es la que contiene el botn Inicio de Windows; de manera predeterminada, se encuentra en la parte inferior del escritorio y la hora se muestra en la esquina derecha).

Informacin detallada: utilizar Do...While y Do...Until para repetir hasta cumplir una condicin
Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a utilizar las instrucciones Do...While y Do...Until para repetir el cdigo basndose en algunas condiciones. En la leccin anterior, aprendi a usar la instruccin For...Next para recorrer un bloque de cdigo un nmero especfico de veces, pero qu ocurre si el nmero de veces que el cdigo se debe repetir es diferente para algunas condiciones? Las instrucciones Do...While y Do...Until permiten repetir un bloque de cdigo mientras cierta condicin sea True o hasta que cierta condicin sea True. Por ejemplo, si se dispona de un programa para agregar una serie de nmeros, pero nunca dese que la suma de los nmeros fuera mayor que 100. Se podra utilizar la instruccin Do...While para llevar a cabo la suma de la siguiente forma: VB Copiar

Dim sum As Integer = 0 Do While sum < 100 sum = sum + 10 Loop

En el cdigo anterior, la lnea Do While evala la variable sum para ver si es menor que 100: si lo es, se ejecuta la siguiente lnea de cdigo; si no lo es, pasa a la lnea de cdigo que se encuentra a continuacin de Loop. La palabra clave Loop le dice al cdigo que regrese a la lnea DoWhile y evale el nuevo valor de sum.

Intntelo

Para utilizar una instruccin Do...While


1. 2. 3. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba DoWhile y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. 6. En el Cuadro de herramientas, arrastre un control TextBox y un control Button al formulario. Haga doble clic en Button para abrir el Editor de cdigo. En el controlador de eventos Button1_Click, escriba el siguiente cdigo: VB Copiar

Dim sum As Integer = 0 Dim counter As Integer = 0 Do While sum < 100 sum = sum + CInt(Textbox1.Text) counter = counter + 1 Loop MsgBox("The loop has run " & CStr(counter) & " times!")

7. 8.

Presione F5 para ejecutar el programa. En el cuadro de texto, escriba un nmero y haga clic en el botn. Aparece un cuadro de mensaje que muestra cuntas veces se sum el nmero a s mismo antes de llegar a 100.

9.

Para cerrar el programa, en el men Depuracin, haga clic en Detener depuracin. Mantenga abierto este proyecto. Ms adelante se agregarn elementos.

Instruccin Do...Until

La instruccin Do...While repite un bucle mientras una condicin permanece True, pero a veces es posible que desee que el cdigo se repita a s mismo hasta que una condicin se convierta True. Puede utilizar la instruccin Do...Until del siguiente modo. VB Copiar

Dim sum As Integer = 0 Do Until sum >= 100 sum = sum + 10 Loop

Este cdigo es similar al cdigo de la instruccin Do...While, slo que esta vez, el cdigo evala la variable sum para ver si es igual o mayor que 100.

Intntelo

Este procedimiento empieza donde termin "Para utilizar una instruccin Do... While". Si no complet "Para utilizar una instruccin Do... While", debe hacerlo antes de continuar.

Para utilizar una instruccin Do...Until


1. Agregue el siguiente cdigo debajo de la lnea MsgBox. VB Copiar

Dim sum2 As Integer = 0 Dim counter2 As Integer = 0 Do Until sum2 >= 100 sum2 = sum2 + CInt(Textbox1.Text) counter2 = counter2 + 1 Loop

MsgBox("The loop has run " & CStr(counter2) & " times!")

2. 3.

Presione F5 para ejecutar el programa. En el cuadro de texto, escriba un nmero y haga clic en el botn. Aparece un segundo cuadro de mensaje que muestra cuntas veces se sum el nmero a s mismo antes de ser igual o mayor que 100.

Informacin detallada: utilizar Select Case para decidir entre varias opciones
Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a utilizar la instruccin Select Case para ejecutar cdigo basado en mltiples condiciones. En la leccin anterior, se mostr cmo usar las instrucciones If...Then para ejecutar diferentes bloques de cdigo segn las condiciones. Aunque es posible evaluar ms de dos condiciones en una instruccin If...Then mediante la palabra clave ElseIf, la instruccin Select Case proporciona una manera mucho mejor de evaluar varias condiciones. La instruccin Select Case permite utilizar tantas condiciones (o casos) como sea necesario, y conviene escribir el cdigo para situaciones en las que hay muchas opciones. Por ejemplo, suponga que el programa utiliz una variable String para almacenar una opcin de color y se necesitaba obtener el valor de color. El cdigo para la instruccin Select Case podra ser similar al siguiente: VB Copiar

Select Case Color Case "red" MsgBox("You selected red") Case "blue" MsgBox("You selected blue")

Case "green" MsgBox("You selected green") End Select

Cuando se ejecuta este cdigo, la lnea Select Case determina el valor (Color) de la expresin. Suponga que Color es una variable String y que esta variable es un parmetro para un mtodo que contiene la instruccin Select Case. El valor de Color se compara con el valor para la primera instruccin Case. Si el valor coincide, se ejecuta la siguiente lnea de cdigo y el cdigo pasa a la lnea End Select; si el valor no coincide, se evala la siguiente lnea Case. La instruccin Case adopta muchas formas distintas; en el ejemplo anterior es String. Pero puede ser cualquier tipo de datos o expresin. Puede evaluar un intervalo de nmeros utilizando la palabra clave To, como sigue: VB Copiar

Case 1 To 10

En este ejemplo, cualquier nmero entre 1 y 10 ser una coincidencia. Tambin puede evaluar varios valores en una sola instruccin Case separndolos con comas de la siguiente forma: VB Copiar

Case "red", "white", "green"

En este ejemplo, cualquiera de los tres valores producir una coincidencia. Tambin puede utilizar operadores de comparacin y la palabra clave Is para evaluar los valores de la siguiente manera. VB Copiar

Case Is > 9

En este ejemplo, cualquier nmero mayor que 9 provocar una coincidencia.

Case Else

El ejemplo anterior funciona cuando conoce todas las condiciones posibles, pero qu sucede si hay una condicin con la que no contaba? Por ejemplo, si el valor de Color es yellow, el cdigo simplemente evaluar los tres casos sin encontrar una coincidencia y no se mostrar ningn cuadro de mensaje. La instruccin Case Else se puede utilizar para ejecutar el cdigo cuando no se encuentra ninguna coincidencia, como en el siguiente ejemplo. VB Copiar

Select Case Color Case "red" MsgBox("You selected red") Case "blue" MsgBox("You selected blue") Case "green" MsgBox("You selected green") Case Else MsgBox("Please choose red, blue, or green") End Select

En el cdigo anterior, si el valor de Color es yellow el cdigo lo comparar con las primeras tres lneas Case sin encontrar una coincidencia. Cuando se llega a la lnea Case Else, se ejecuta la siguiente lnea de cdigo antes de pasar a End Select.

Para utilizar la instruccin Select Case


1. En el men Archivo, seleccione Nuevo proyecto.

2. 3.

En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba SelectCase y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms.

4. 5. 6.

En el Cuadro de herramientas, arrastre un control TextBox y un control Button al formulario. Haga doble clic en el botn para abrir el Editor de cdigo. En el controlador de eventos Button1_Click, escriba el siguiente cdigo. VB Copiar

Dim Number As Integer = CInt(Textbox1.Text) Select Case Number Case 1 MsgBox("Less than 2") Case 2 To 5 MsgBox("Between 2 and 5") Case 6, 7, 8 MsgBox("Between 6 and 8") Case 9 To 10 MsgBox("Greater than 8") Case Else MsgBox("Not between 1 and 10") End Select

7. 8.

Presione F5 para ejecutar el programa. En el cuadro de texto, escriba un nmero y haga clic en el botn. Aparecer un cuadro de mensaje que muestra el mensaje de la instruccin Case que coincide con el nmero que ha especificado.

Qu hacer cuando algo sale mal: control de errores


Visual Studio 2008

Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a crear cdigo de control de errores bsico para los programas. Incluso los programas mejor diseados a veces encuentran errores. Algunos errores son defectos en el cdigo que se pueden encontrar y corregir. Otros errores son una consecuencia natural del programa; por ejemplo, el programa puede intentar abrir un archivo que ya est en uso. En casos as, los errores se pueden predecir, pero no evitar. Como desarrollador, es su trabajo predecir estos errores y ayudar a que el programa los solucione.

Errores en tiempo de ejecucin

Un error que se produce mientras un programa se est ejecutando se llama error en tiempo de ejecucin. Los errores en tiempo de ejecucin se producen cuando un programa trata de hacer algo para lo cual no fue diseado. Por ejemplo, si el programa intenta realizar una operacin no vlida, como convertir una cadena no numrica en un valor numrico, se producir un error en tiempo de ejecucin. Cuando se produce un error en tiempo de ejecucin, el programa produce una excepcin, que soluciona los errores buscando cdigo dentro del programa para tratar el error. Si no se encuentra tal cdigo, se detiene el programa y se tiene que reiniciar. Dado que esto puede conducir a la prdida de datos, es prudente crear el cdigo de control de errores dondequiera que se tenga previsto que se produzcan errores.

El bloque Try...Catch...Finally

Se puede utilizar el bloque Try...Catch...Finally para controlar errores en tiempo de ejecucin en el cdigo. Puede utilizar Try para un segmento de cdigo; si ese cdigo produce una excepcin, salta al bloque Catch y se ejecuta el cdigo del bloque Catch. Despus de que ese cdigo ha finalizado, se ejecuta cualquier cdigo en el bloque Finally. La instruccin End Try cierra el bloque Try...Catch...Finally completo. En el ejemplo siguiente se ilustra cmo se utiliza cada bloque. VB Copiar

Try ' Code here attempts to do something.

Catch ' If an error occurs, code here will run. Finally ' Code in this block will always run. End Try

Primero, se ejecuta el cdigo del bloque Try. Si se ejecuta sin error, el programa omite el bloque Catch y ejecuta el cdigo del bloque Finally. Si se produce un error en el bloque Try, la ejecucin salta inmediatamente al bloque Catch y se ejecuta el cdigo que se encuentra all; luego se ejecuta el cdigo del bloque Finally.

Intntelo

Para utilizar el bloque Try...Catch


1. 2. 3. En el men Archivo, elija Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba TryCatch y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. 6. En el Cuadro de herramientas, arrastre un control TextBox y un control Button al formulario. Haga doble clic en Button para abrir el Editor de cdigo. En el controlador de eventos Button1_Click, escriba el siguiente cdigo: VB Copiar

Try Dim aNumber As Double = CDbl(Textbox1.Text) MsgBox("You entered the number " & aNumber) Catch MsgBox("Please enter a number.") Finally MsgBox("Why not try it again?") End Try

7. 8.

9.

Presione F5 para ejecutar el programa. En el cuadro de texto, escriba un valor numrico y haga clic en el botn. Aparece un cuadro de mensaje que muestra el nmero que ha escrito, seguido por una invitacin para volver a intentarlo. A continuacin, escriba un valor no numrico en el cuadro de texto, como una palabra y haga clic en el botn. Esta vez, cuando el programa intente convertir el texto del cuadro de texto en un nmero, no podr hacerlo y se producir un error. En lugar de finalizar el cdigo en el bloque Try, se ejecuta el bloque Catch y aparece un cuadro de mensaje solicitando que se escriba un nmero. Se ejecuta el bloque Finally y se le invita a intentarlo de nuevo.

Crear la apariencia visual de un programa: introduccin a los formularios Windows Forms


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 La interfaz de usuario es la parte del programa que ven los usuarios cuando ejecutan el programa. Una interfaz de usuario suele estar compuesta de una ventana principal o formulario y varios controles, como botones, campos para escribir texto, etc. Estos tipos de programas de Visual Basic se conocen como aplicaciones de formularios Windows Forms y la interfaz de usuario se crea utilizando los controles de formularios Windows Forms.

Nota:
Tambin puede crear aplicaciones para Windows mediante la reciente tecnologa Windows Presentation Foundation. Esta actividad se tratar en el siguiente conjunto de lecciones, Crear la apariencia visual de un programa: introduccin a Windows Presentation Foundation.

Las lecciones de esta seccin le mostrarn cmo crear una interfaz de usuario utilizando algunos de los controles de formularios Windows Forms ms comunes.

En esta seccin
Comunicarse con el usuario del programa: interfaz de usuario Describe cmo crear un formulario y agregarle controles.

Interactuar con el usuario: utilizar botones Describe cmo agregar un botn a un formulario y cmo agregar cdigo que se ejecutar cuando el usuario haga clic en el botn. Mostrar y recibir texto: utilizar etiquetas y cuadros de texto Describe cmo se puede usar una etiqueta y un cuadro de texto para mostrar texto y recibir la entrada de texto del usuario. Hacer que el programa reaccione ante el usuario: crear un controlador de eventos Describe cmo crear un controlador de eventos para un botn. Obtener opciones seleccionadas por el usuario: utilizar casillas y botones de opcin Describe cmo utilizar casillas y botones de opcin para presentar y recuperar las opciones de usuario. Mostrar imgenes: Utilizar el control PictureBoxl Describe cmo mostrar imgenes en un formulario. Proporcionar opciones al usuario: crear mens en tiempo de diseo Describe cmo agregar mens estndar y elementos de men a una aplicacin de formularios Windows Forms. Usar controles Timer para realizar acciones regulares Describe cmo usar el componente Timer para ejecutar cdigo a intervalos establecidos. Controles de varios elementos: trabajar con controles ListBox y ComboBox Describe cmo agregar y quitar elementos de una lista. Mostrar fechas: Usar los controles MonthCalendar y DateTimePicker Describe cmo recuperar una fecha seleccionada en un control MonthCalendar y un control DateTimePicker y mostrarla en un formulario Windows Forms. Controles invisibles: utilizar componentes Presenta los componentes y describe cmo agregar un componente que permita validar los datos escritos en un programa. Reutilizar controles: trabajar con cuadros de dilogo integrados Describe cmo utilizar los cuadros de dilogo integrados para mostrar un cuadro de dilogo Abrir archivo, aplicar una fuente al texto y aplicar color a un formulario. Presionar botones: agregar barras de herramientas y botones

Describe cmo agregar un control ToolStrip a una aplicacin y cmo agregar un botn a ToolStrip. Proporcionar un explorador propio: trabajar con controles TreeView Describe cmo crear una aplicacin con la apariencia del Explorador de Windows con un control TreeView.

Secciones relacionadas
Informacin detallada: compartir un controlador de eventos Describe cmo crear un controlador de eventos compartido que controla eventos para ms de un control. Informacin detallada: utilizar varios grupos de botones de opcin Explica cmo crear varios grupos de botones de opcin mutuamente excluyentes en un nico formulario. Informacin detallada: ms informacin acerca de los mens Explica cmo habilitar o deshabilitar mens en tiempo de ejecucin, as como crear mens emergentes. Paseo con gua por Visual Basic Proporciona una serie de lecciones secuenciales que presentan los conceptos bsicos de programacin de Visual Basic 2008. Qu sali mal? Encontrar y corregir errores mediante depuracin Describe cmo utilizar las herramientas de depuracin en Visual Basic 2008. Introduccin al lenguaje de programacin Visual Basic Describe los fundamentos del lenguaje Visual Basic.

Crear la apariencia visual de un programa: introduccin a Windows Presentation Foundation


Visual Studio 2008 Actualizacin: noviembre 2007 La interfaz de usuario es la parte del programa que ven los usuarios cuando ejecutan el programa. El conjunto anterior de lecciones mostr cmo crear una interfaz de usuario mediante Windows Forms. Este conjunto de lecciones muestra una manera diferente de crear una interfaz de usuario para una aplicacin basada en Windows: mediante Windows Presentation Foundation (WPF).

Las aplicaciones de WPF son aplicaciones en las que se utilizan controles de WPF para crear la interfaz de usuario. En estas aplicaciones, la interfaz de usuario consta normalmente de una ventana principal o formulario y varios controles, como botones, cuadros de texto para escribir el texto, etc. WPF utiliza un lenguaje de marcado llamado Lenguaje de marcado de aplicaciones extensible (XAML) para proporcionar nuevas tcnicas con el fin de desarrollar interfaces de usuario visualmente mejoradas. Las lecciones de esta seccin le muestran cmo crear interfaces de usuario que utilizan algunos de los controles de WPF ms comunes.

En esta seccin
Disear una interfaz de usuario para una aplicacin de WPF (Visual Basic) Describe cmo crear una aplicacin WPF y agregarle controles. Usar controles comunes de WPF Proporciona informacin general de los controles de WPF ms comunes. Crear controladores de eventos para los controles de WPF Describe cmo asociar un controlador de eventos a un control de WPF y cmo escribir cdigo que se ejecuta cuando se provoca el controlador de eventos. Crear una aplicacin de dibujo con WPF Muestra cmo crear una aplicacin de WPF para trazar dibujos.

Disear una interfaz de usuario para una aplicacin de WPF (Visual Basic)
Visual Studio 2008 Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre cmo crear una aplicacin de WPF y cmo agregar controles a la interfaz de usuario. Disear una aplicacin de Windows Presentation Foundation (WPF) es como disear una aplicacin de formularios Windows Forms: los controles se agregan a una superficie de diseo. Sin embargo, hay varias diferencias. Adems de tener un diseador, la ventana Propiedades y el Cuadro de herramientas, hay una ventana que contiene XAML. XAML significa Extensible Application Markup Language (Lenguaje de marcado de aplicaciones extensible). ste es un lenguaje de marcado que se utiliza para crear una interfaz de usuario. La ilustracin siguiente muestra la ubicacin predeterminada del editor XAML. Para obtener ms informacin, vea Tutorial: Editar XAML en WPF Designer.

Editor XAML

Al crear una aplicacin de formularios Windows Forms convencional, puede arrastrar un control del Cuadro de herramientas a un formulario Windows Forms o, si lo desea, puede escribir el cdigo para crear el control. Al arrastrar el control al formulario, el cdigo se genera automticamente. De igual forma, al crear una aplicacin WPF, puede crear un control escribiendo el marcado XAML o puede arrastrar el control a una ventana de WPF. El marcado XAML se organiza en elementos que aparecen en un formato jerrquico. Los elementos se encierran entre corchetes angulares, y hay normalmente un elemento de apertura y cierre. Por ejemplo, puede tener un elemento Button simple que aparece del modo siguiente: <Button></Button>. Se describe normalmente cmo aparece un elemento mediante la definicin de atributos, como su ubicacin, alto y ancho. Los atributos de un elemento parecen propiedades de un objeto porque son descripciones del aspecto fsico o estado. Los atributos aparecen dentro de corchetes de apertura y cierre del elemento de apertura. Estn compuestos del nombre del atributo, el smbolo de asignacin (=) y el valor del atributo entre comillas. Puede especificar el alto, por ejemplo de un elemento Button del modo siguiente: <Button Height="23"></Button>. Al arrastrar los controles de WPF del Cuadro de herramientas al diseador, Visual Basic Express genera automticamente el marcado XAML para el control. Por ejemplo, al hacer doble clic en un control System.Windows.Controls.Button para agregarlo a una ventana de WPF, se genera un marcado XAML similar al siguiente. other Copiar

<Button Height="23" HorizontalAlignment="Left" Margin="10,10,0,0" Name="Button1" VerticalAlignment="Top" Width="75">Button</Button>


Observe que el elemento Button tiene el atributo Height establecido en "23" y el elemento HorizontalAlignment establecido en "Left". Hay tambin varios otros atributos que describen el elemento. Puede cambiar estos atributos modificando directamente los valores en el marcado XAML. (De manera predeterminada, estos atributos aparecen en color rojo.) Tambin puede cambiar las propiedades del control mediante la ventana Propiedades.

Intntelo.

Para crear una aplicacin WPF


1. 2. 3. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin WPF. En el cuadro Nombre, escriba VentanaWPF y, a continuacin, haga clic en Aceptar. Se crea un nuevo proyecto de Windows Presentation Foundation. Aparece una nueva ventana denominada Ventana1. Su marcado XAML se muestra en el editor XAML del entorno de desarrollo integrado (IDE) de Visual Basic y aparece del modo siguiente: other Copiar

<Window x:Class="Window1"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window1" Height="300" Width="300"> <Grid>

</Grid> </Window>
4. 5. Haga clic en Ventana1 para seleccionarlo. En el editor XAML, cambie el atributo Title del elemento Window de Window1 a WPF Application. El marcado XAML aparecer ahora del modo siguiente: other Copiar

<Window x:Class="Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="WPF Application" Height="300" Width="300"> <Grid>

</Grid> </Window>
El texto en la barra de ttulo de Ventana1 cambia a Aplicacin WPF. Pruebe a cambiar otros atributos de la ventana, como Width y Height. Cuando est listo, contine con el siguiente procedimiento.

Agregar controles a la ventana de WPF

En este procedimiento, agregar controles a su aplicacin. Para ello, debe hacer clic en el control del Cuadro de herramientas, que suele estar situado en el lado izquierdo del IDE de Visual Basic, y arrastrar a continuacin el control a la ventana de WPF. Debe establecer algunas propiedades para el control y, a continuacin, ajustar el marcado XAML para cambiar el texto y tamao del control.

Para agregar un control a la ventana de WPF


1. 2. 3. En el Cuadro de herramientas, arrastre un control TextBox al lado derecho superior de la ventana de WPF. Seleccione el control TextBox. En la ventana Propiedades, haga clic en la primera flecha (izquierda) de la propiedad HorizontalAlignment, como se muestra en la ilustracin siguiente. Propiedad HorizontalAlignment

As, TextBox se mueve del lado derecho de la ventana de WPF al lado izquierdo. 4. Establezca las siguientes propiedades para TextBox.

Propiedad
VerticalAlignment

Valor
Superior

Width

75

Height

26

5.

En el editor XAML, cambie el atributo Width del elemento TextBox a 140 y cambie el elemento Margin a 30, 56, 0, 0, como se muestra en el ejemplo siguiente. other Copiar

<TextBox Height="26" HorizontalAlignment="Left" Margin="30,56,0,0" Name="TextBox1" VerticalAlignment="Top" Width="140" />


El ancho y ubicacin de TextBox cambian tras escribir los nuevos valores. 6. 7. Agregue un control Button a la ventana de WPF, junto a TextBox. Cambie el texto entre las etiquetas de Button de apertura y cierre de Button a Submit, como se muestra en el ejemplo siguiente. other Copiar

<Button Height="23" HorizontalAlignment="Right" Margin="0,59,35,0" Name="Button1" VerticalAlignment="Top" Width="75">Submit</Button>


El texto del botn cambia despus de especificar el nuevo valor. 8. Presione F5 para ejecutar el programa. Aparece una ventana con el cuadro de texto y el botn que acaba de agregar. Observe que puede hacer clic en el botn y escribir en el cuadro de texto. Debe agregar controladores de eventos y, a continuacin, escribir cdigo que indique al equipo qu hacer cuando se haga clic en el botn.

Usar controles comunes de WPF


Visual Studio 2008 Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre algunos de los controles de Windows Presentation Foundation (WPF) comunes que estn disponibles en el Cuadro de herramientas al crear un proyecto de aplicacin de WPF. WPF permite crear interfaces de usuario visualmente mejoradas para sus aplicaciones. En las aplicaciones de WPF, se han mejorado incluso los controles tpicos que estamos acostumbrados a ver en las aplicaciones de formularios Windows Forms estndar. La manera ms fcil de agregar controles de WPF a una aplicacin es arrastrarlos del Cuadro de herramientas a la superficie de diseo. En su estado predeterminado, los controles son muy similares a los de las aplicaciones de formularios Windows Forms. Los controles de WPF admiten estilos y plantillas que permiten crear aplicaciones visualmente atractivas. Para modificar la apariencia de un control, puede cambiar sus propiedades en la ventana Propiedades. Tambin puede modificar su

apariencia agregndole estilos y atributos en el editor de XAML. Escribir XAML sin ayuda puede ser difcil, por lo que tal vez puede ser conveniente usar una aplicacin que lo genere automticamente, como Expression Blend. Para obtener ms informacin, vea Colaboracin con Expression Blend.

Intntelo!

Para agregar un control a la ventana de WPF


1. 2. 3. 4. 5. 6. 7. En el men Archivo, haga clic en Nuevo proyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin WPF. En el cuadro Nombre, escriba WPFControls y, a continuacin, haga clic en Aceptar. Se crea un nuevo proyecto de Windows Presentation Foundation. En el Cuadro de herramientas, arrastre un control TextBox al lado derecho superior de la ventana de WPF. Seleccione el control TextBox. Establezca las siguientes propiedades para el cuadro de texto en la ventana Propiedades.

Propiedad
VerticalAlignment

Valor
Superior

Width

75

Height

26

8. 9.

Agregue un control Button a la ventana de WPF, al lado del cuadro de texto. Cambie el texto entre las etiquetas de apertura y cierre de Button en el editor XAML de Button a Add, como se muestra en el ejemplo siguiente. other Copiar

<Button Height="23" HorizontalAlignment="Right" Margin="0,59,35,0" Name="Button1" VerticalAlignment="Top" Width="75">Add</Button>


El texto del botn cambia despus de escribir el nuevo valor. 10. Agregue un control ListBox a la ventana de WPF, debajo del cuadro de texto. 11. Haga doble clic en el botn para especificar el controlador de eventos predeterminado y agregue el cdigo siguiente: other

Copiar

If TextBox1.Text IsNot "" Then ListBox1.Items.Add(TextBox1.Text) TextBox1.Text = "" End If


12. Presione F5 para ejecutar el programa. Aparece una ventana con el cuadro de texto, el cuadro de lista y el botn que acaba de agregar. 13. Escriba un texto cualquiera en el cuadro de texto y, a continuacin, haga clic en el botn Agregar. Compruebe que el texto se agrega al cuadro de lista. 14. Agregue texto adicional al cuadro de lista.

Controles de WPF

En la tabla siguiente se muestran los controles de WPF ms comunes que se encuentran en la ficha Controles comunes del Cuadro de herramientas.

Nombre del control


System.Windows.Controls.Border

Descripcin
Muestra un borde alrededor del contenido.

System.Windows.Controls.Button

Permite a un usuario realizar una accin haciendo clic en un botn. El evento Buttonbase.Click se produce cuando se hace clic en un control Button.

System.Windows.Controls.CheckBox

Permite a un usuario seleccionar y desactivar una casilla para indicar un valor S/No o Verdadero/Falso.

System.Windows.Controls.ComboBox

Permite a un usuario seleccionar un elemento de una lista desplegable. La lista aparece cuando el usuario hace clic en una flecha desplegable.

System.Windows.Controls.Grid

Define un rea de cuadrcula flexible que consta de columnas y filas.

System.Windows.Controls.Image

Muestra una imagen.

System.Windows.Controls.Label

Muestra texto en un formulario. Proporciona compatibilidad con las teclas de acceso.

System.Windows.Controls.ListBox

Permite a un usuario seleccionar un elemento de una lista.

System.Windows.Controls.RadioButton Permite a un usuario elegir entre elementos mutuamente excluyentes. La seleccin de un botn de opcin es mutuamente excluyente con cualquier otro botn de opcin en el mismo contenedor.

System.Windows.Controls.StackPanel

Permite apilar vertical u horizontalmente los controles secundarios.

System.Windows.Control.TabControl

Permite organizar el contenido visual en forma de tabla.

System.Windows.Controls.TextBox

Muestra el texto sin formato y permite a los usuarios escribir texto.

Los controles adicionales disponibles en el Cuadro de herramientas incluyen lo siguiente:

Controles contenedor, como Canvas, DockPanel y Frame. Mens y barras de herramientas, como Menu, ToolBar y StatusBar. Controles de documento, como DocumentViewer y FlowDocumentPageViewer. Y ms

Crear controladores de eventos para los controles de WPF


Visual Studio 2008 Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre cmo crear un controlador de eventos para un control de WPF. Puede agregar el controlador de eventos predeterminado para muchos controles haciendo doble clic en el control en la vista Diseo. Tambin puede crear controladores de eventos para los controles que agrega a una aplicacin de Windows Presentation Foundation (WPF) utilizando una combinacin de XAML y cdigo de Visual Basic. En primer lugar, se define el evento y el nombre del mtodo que

administrar el evento en un atributo del control en el editor XAML. A continuacin, se puede agregar el cdigo para el controlador de eventos en el editor de cdigo.

Intntelo.

Para crear un controlador de eventos para un botn


1. 2. 3. Crear una aplicacin WPF en Visual Basic Express. Para obtener ms informacin, vea Cmo: Crear un nuevo proyecto de aplicacin de WPF. Arrastre un Botn desde el Cuadro de herramientas hasta la superficie de diseo de WPF y, a continuacin, seleccione el botn. Haga doble clic en el botn. Se crea el controlador de eventos Click y el cursor del mouse se coloca en el controlador de eventos en el editor de cdigo. 4. Agregue el cdigo siguiente al controlador de eventos: other Copiar

MsgBox("Event handler was created by double-clicking the button.")


5. 6. Arrastre otro Botn desde el Cuadro de herramientas hasta la superficie de diseo de WPF y, a continuacin, seleccione el botn. Agregue un atributo denominado Click al elemento Button en el editor XAML y establezca su valor en ButtonOKClicked. ste es el nombre que proporcionar al controlador de eventos en el cdigo. Por ejemplo, se puede escribir el atributo del siguiente modo: Click="ButtonOKClicked"

Nota:
Al crear un controlador de eventos haciendo doble clic en el control, el atributo no se agrega al marcado XAML. En su lugar, la clusula Handles se utiliza para enlazar el evento con el controlador de eventos.

7. 8.

Haga clic con el botn secundario en la superficie de diseo y seleccione Ver cdigo. Agregue el siguiente controlador de eventos a la clase Window1. other Copiar

Sub ButtonOKClicked(ByVal Sender As Object, _ ByVal e As RoutedEventArgs) Handles Button2.Click

End Sub
9. Agregue el cdigo siguiente al mtodo ButtonOKClicked. Este cdigo muestra un mensaje al hacer clic en el botn. other Copiar

MsgBox("Event handler was created manually.")


10. Presione F5 para ejecutar el programa. 11. Cuando la ventana aparezca, haga clic en el botn. 12. Compruebe que aparece el texto correcto en un cuadro de mensaje al hacer clic en cada botn, y, a continuacin, cierre la aplicacin.

Crear una aplicacin de dibujo con WPF


Visual Studio 2008 Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre cmo crear una aplicacin de Windows Presentation Foundation (WPF) que le permita dibujar imgenes. Crear una aplicacin de WPF es como crear una aplicacin de formularios Windows Forms: los controles del Cuadro de herramientas se arrastran a la superficie de diseo y, a continuacin, se escribe el cdigo para administrar los eventos de los controles. Para obtener una demostracin en vdeo, vea Video How to: Creating a Drawing Application by Using WPF.

Intntelo.

Para crear una aplicacin de WPF


1. En el men Archivo, haga clic en Nuevo proyecto. Aparecer el cuadro de dilogo Nuevo proyecto. Este cuadro de dilogo muestra la lista de los diversos tipos de aplicacin predeterminados que puede crear con Visual Basic Express. 2. 3. Seleccione Aplicacin WPF como el tipo de proyecto. Cambie el nombre de la aplicacin a Panel de entrada manuscrita y, a continuacin, haga clic en Aceptar. Visual Basic Express crea una nueva carpeta para el proyecto. La carpeta tiene el mismo nombre que el ttulo del proyecto. Visual Basic Express tambin muestra la nueva ventana de WPF, llamada Ventana1, en vista Diseo. Puede ir al editor de cdigo en cualquier momento si hace clic con el botn secundario en la superficie de diseo y hace clic en Ver cdigo. De

manera predeterminada, el editor XAML aparece bajo el diseador, pero la vista XAML puede mostrarse a pantalla completa si hace clic con el botn secundario en la superficie de diseo y selecciona Ver XAML.

Para disear la interfaz de usuario.


1. Si la ventana Propiedades no est visible, en el men Ver haga clic en Ventana Propiedades. Esta ventana muestra las propiedades del formulario o control actualmente seleccionado. Puede cambiar los valores de las propiedades existentes en esta ventana. Cambie el tamao de la ventana de WPF estableciendo la propiedad Height en 550 y la propiedad Width en 370 desde la ventana Propiedades. Cambie la propiedad de ttulo de la ventana de WPF a Panel de entrada manuscrita. Cambie la propiedad Background de la ventana de WPF al color marrn; para ello, haga clic en Brown en el cuadro desplegable y, a continuacin, presione ENTRAR.

2. 3. 4.

Nota:
Opcionalmente, puede modificar directamente el marcado XAML si agrega un atributo Background y establece su valor en Brown: Background="Brown"

5. 6.

Para abrir el Cuadro de herramientas, en el men Vista, haga clic en el Cuadro de herramientas. Haga clic con el botn secundario en el Cuadro de herramientas y, despus, haga clic en Elegir elementos. Se abrir el cuadro de dilogo Elegir elementos del cuadro de herramientas.

7.

En la ficha Componentes WPF del cuadro de dilogo Elegir elementos del cuadro de herramientas, desplcese hacia abajo hasta InkCanvas y seleccinelo para activar la casilla. 8. Haga clic en Aceptar para agregar el control InkCanvas al Cuadro de herramientas. 9. Arrastre un control InkCanvas del Cuadro de herramientas a la superficie de diseo. 10. Establezca las siguientes propiedades del control InkCanvas en la ventana Propiedades:

Propiedad
Width

Valor
Auto

Height

Auto

HorizontalAlignment

Expandir

VerticalAlignment

Expandir

Mrgenes

9, 9, 9, 68

11. Cambie el color del control InkCanvas a amarillo estableciendo su propiedad Background en LightYellow. El color de fondo del control InkCanvas aparecer como amarillo claro en tiempo de ejecucin. 12. Arrastre dos controles Button a la ventana de WPF y colquelos bajo el control InkCanvas. Coloque button1 a la izquierda y button2 a la derecha. 13. Seleccione button1 y cambie el marcado XAML en la vista XAML como se muestra en el marcado siguiente. Este marcado establece la propiedad Text en Clear. other Copiar

<Button Height="23" HorizontalAlignment="Left" Margin="85,0,0,24" Name="Button1" VerticalAlignment="Bottom" Width="75">Clear</Button>


14. Seleccione button2 y cambie el marcado XAML como se muestra en el marcado siguiente. Este marcado establece la propiedad Text en Close. other Copiar

<Button Height="23" HorizontalAlignment="Right" Margin="0,0,72,24" Name="Button2" VerticalAlignment="Bottom" Width="75">Close</Button>


La aplicacin WPF debera parecerse a la aplicacin Panel de entrada manuscrita de la ilustracin siguiente.

Aplicacin WPF Panel de entrada manuscrita

Para agregar cdigo a los controladores de eventos de los botones


1. Haga doble clic en Borrar y, a continuacin, agregue el cdigo siguiente al controlador de eventos Click generado: other Copiar

Me.InkCanvas1.Strokes.Clear()
2. 3. Vuelva a la vista Diseo; para ello, haga clic con el botn secundario en el editor de cdigo y seleccione Diseador. Haga doble clic en Cerrar y, a continuacin, agregue el cdigo siguiente al controlador de eventos Click generado: other Copiar

Me.Close()
4. 5. 6. Presione F5 para ejecutar el proyecto. Cuando la aplicacin se inicie, dibuje una imagen en el control InkCanvas. Si comete algn error, puede hacer clic en Borrar para volver a empezar. Haga clic en Cerrar para salir de la aplicacin.

Qu sali mal? Encontrar y corregir errores mediante depuracin


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 Al escribir un programa informtico, es normal que se produzcan errores. Es posible que se cometa un error tipogrfico, el programa se puede comportar no como lo esperaba o no se puede ejecutar en lo absoluto. Cuando hay un error en un programa, hay que buscarlo y corregirlo. La bsqueda y correccin de errores se denomina depuracin. En las siguientes lecciones, aprender varias tcnicas para depurar un programa Visual Basic.

En esta seccin
Encontrar errores: introduccin a la depuracin en Visual Basic Describe cmo depurar un programa y corregir los errores. Conozca sus errores: tres tipos de errores de programacin Describe tres tipos de errores que pueden producirse en un programa: errores de compilacin, en tiempo de ejecucin y lgicos. Encontrar y eliminar errores del compilador Describe cmo buscar y corregir los errores del compilador en un programa utilizando la ventana Lista de errores e IntelliSense. No funciona! Encontrar y eliminar errores en tiempo de ejecucin Describe cmo depurar un programa y corregir los errores en tiempo de ejecucin utilizando el cuadro de dilogo Ayudante de excepciones e IntelliSense. Qu? Esto no debiera haber ocurrido. Encontrar errores lgicos Describe cmo establecer puntos de interrupcin y recorrer el cdigo para buscar errores lgicos. Agregar notas a programas: utilizar comentarios Describe cmo crear comentarios en el cdigo de un programa y cmo usar los comentarios para la depuracin.

Encontrar errores: introduccin a la depuracin en Visual Basic


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre cmo corregir errores del programa mediante la depuracin. Por mucho cuidado que tenga al disear un programa o escribir cdigo, siempre pueden aparecer errores. En ocasiones los errores impedirn que se inicie el programa, unas veces harn que el programa deje de ejecutarse o se bloquee y otras se ejecutar pero no ofrecer los resultados esperados. Y, por supuesto, cuando los errores aparecen, querr encontrarlos y corregirlos. Los errores de un programa se conocen normalmente como errores y el proceso de encontrarlos y corregirlos se denomina depuracin. El proceso de depuracin es iterativo; es decir, se debe repetir una y otra vez. Por lo general, escribe cdigo, ejecuta el programa hasta que aparece un error, encuentra el error, lo corrige y, a continuacin, ejecuta el programa de nuevo. En la mayora de los casos, no necesita detener el programa para corregirlo. Puede corregir el cdigo donde apareci el error y seguir ejecutando el programa desde all; este proceso se conoce como Editar y continuar. La depuracin se realiza en el IDE (entorno de desarrollo integrado) de Visual Basic, que contiene varios comandos y ventanas especiales que ayudan a encontrar errores. Obtendr ms informacin en las lecciones siguientes.

Intntelo!

Nota:
En este ejemplo hay una excepcin. Las excepciones son objetos que se crean (y producen) cuando el programa detecta un error. Se crean distintos tipos de excepciones, dependiendo del tipo de error generado. Con los valores predeterminados del usuario, si se produce una excepcin durante la ejecucin del programa de Visual Basic, aparece un cuadro de dilogo que describe el error y ayuda

a corregirlo.

Para utilizar el proceso de editar y continuar


1. 2. 3. En el men Archivo, seleccione Nuevoproyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Edit y haga clic en Aceptar. Se abrir un nuevo proyecto de formularios Windows Forms. 4. 5. Haga doble clic en el formulario para abrir el Editor de cdigo. En el controlador del evento Form_Load, agregue el siguiente cdigo: VB Copiar

Dim number As Integer = 1 Dim numbers As String = "" MsgBox(numbers + 1)

6.

Presione F5 para ejecutar el programa. Se detiene el programa y aparece un cuadro de dilogo de excepciones con el mensaje "No se control InvalidCastException". La excepcin ha ocurrido porque hay un error tipogrfico en el cdigo. Se utiliz la variable equivocada: debera ser number, Integer, no numbers, que es una variable String. Observe que el programa todava est en ejecucin; est en el modo de interrupcin de depuracin. Con Editar y continuar, puede corregir el error sin necesidad de detener el programa (ni volver a ejecutarlo para comprobarlo).

7. 8.

En el Editor de cdigo, cambie numbers + 1 por number + 1. Presione F5 para continuar. Debe aparecer un cuadro de mensaje con el nmero 2.

Conozca sus errores: tres tipos de errores de programacin


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, conocer los diferentes tipos de errores que pueden aparecer al escribir un programa. Incluso los programadores ms experimentados cometen errores; y conocer cmo depurar una aplicacin y encontrar esos errores es una parte importante de la programacin. No obstante, antes de obtener informacin sobre el proceso de depuracin, conviene conocer los tipos de errores que deber buscar y corregir. Los errores de programacin pertenecen a tres categoras: errores de compilacin, errores en tiempo de ejecucin y errores lgicos. Las tcnicas para depurar cada uno de ellos se tratarn en las tres lecciones siguientes.

Errores de compilacin
Los errores de compilacin, tambin conocidos como errores del compilador, son errores que impiden que su programa se ejecute. Cuando presiona F5 para ejecutar un programa, Visual Basic compila el cdigo en un lenguaje binario que el equipo entiende. Si el compilador de Visual Basic se encuentra con cdigo que no entiende, emite un error de compilador. La mayora de los errores del compilador se deben a errores cometidos al escribir el cdigo. Por ejemplo, puede escribir mal una palabra clave, omitir alguna puntuacin necesaria o intentar utilizar una instruccin End If sin antes utilizar una instruccin If. Afortunadamente, el editor de cdigo de Visual Basic se dise para identificar estos errores antes de que se intente ejecutar el programa. Aprender a encontrar y corregir los errores de compilacin en la leccin siguiente, Encontrar y eliminar errores del compilador.

Errores en tiempo de ejecucin


Los errores en tiempo de ejecucin son errores que aparecen mientras se ejecuta su programa. Estos errores aparecen normalmente cuando su programa intenta una operacin que es imposible que se lleve a cabo. Un ejemplo de esto es la divisin por cero. Suponga que tiene la instruccin siguiente: Speed = Miles / Hours Si la variable Hours tiene un valor de 0, se produce un error en tiempo de ejecucin en la operacin de divisin. El programa se debe ejecutar para que se pueda detectar este error y si Hours contiene un valor vlido, no se producir el error.

Cuando aparece un error en tiempo de ejecucin, puede usar las herramientas de depuracin de Visual Basic para determinar la causa. Aprender a encontrar y corregir los errores en tiempo de ejecucin en la leccin No funciona! Encontrar y eliminar errores en tiempo de ejecucin.

Errores lgicos
Los errores lgicos son errores que impiden que su programa haga lo que estaba previsto. Su cdigo puede compilarse y ejecutarse sin errores, pero el resultado de una operacin puede generar un resultado no esperado. Por ejemplo, puede tener una variable llamada FirstName y establecida inicialmente en una cadena vaca. Despus en el programa, puede concatenar FirstName con otra variable denominada LastName para mostrar un nombre completo. Si olvida asignar un valor a FirstName, slo se mostrar el apellido, no el nombre completo como pretenda. Los errores lgicos son los ms difciles de detectar y corregir, pero Visual Basic tambin dispone de herramientas de depuracin que facilitan el trabajo. Aprender a encontrar y corregir los errores lgicos en Qu? Esto no debiera haber ocurrido. Encontrar errores lgicos.

Encontrar y eliminar errores del compilador


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a encontrar y corregir los errores del compilador. Como vimos en la leccin anterior, los errores del compilador aparecen cuando el compilador de Visual Basic se encuentra con cdigo irreconocible, generalmente porque se cometi algn error al escribir. Dado que los errores del compilador impiden que se ejecute un programa, deber encontrarlos y corregirlos, o depurarlos, antes de ejecutar el programa.

Encontrar y corregir errores del compilador

Encontrar los errores del compilador es bastante fcil, ya que el programa no se ejecuta hasta que se han corregido. Cuando presiona F5, si hay algn error del compilador, aparecer un cuadro de dilogo que indica "Errores al compilar. Desea continuar?". Si selecciona S, se ejecutar la ltima

versin sin errores del programa; si selecciona No, el programa se detendr y aparecer la ventana Lista de errores. La ventana Lista de errores muestra toda la informacin sobre el error, incluida su descripcin y ubicacin en el cdigo. Si hace doble clic en el error en la Lista de errores, se resaltar la lnea incorrecta del cdigo en el Editor de cdigo. Tambin puede presionar F1 para mostrar Ayuda y obtener ms informacin sobre el error y cmo corregirlo. El editor de cdigo de Visual Basic tambin puede ayudarle a encontrar y corregir los errores del compilador, incluso antes de que se intente ejecutar el programa. Mediante una caracterstica denominada IntelliSense, Visual Basic inspecciona el cdigo a medida que se escribe y si encuentra cdigo que producir un error del compilador, lo subraya con una lnea ondulada de color azul. Si mantiene presionado el mouse sobre esa lnea, se muestra un mensaje que describe el error. Si la ventana Lista de errores est visible, tambin mostrar los mensajes de error.

Intntelo

Para encontrar y corregir errores del compilador


1. 2. 3. En el men Archivo, seleccione Nuevo proyecto. En el panel Plantillas, en el cuadro de dilogo Nuevo proyecto, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba CompilerErrors y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. Haga doble clic en el formulario para abrir el Editor de cdigo. En el controlador de eventos Form_Load, agregue el siguiente cdigo. VB Copiar

End If

6.

Presione ENTRAR. Ver una lnea ondulada de color azul debajo de End If. Si mantiene presionado el mouse sobre la lnea, ver el mensaje "'End If' debe ir precedida por la instruccin 'If' " correspondiente.

7.

Cambie el cdigo para que tenga la siguiente apariencia. VB Copiar

If 1 < 2 Then

End If

Observe que ha desaparecido la lnea ondulada de color azul. 8. Agregue la nueva lnea de cdigo siguiente despus de la instruccin If... Then. VB Copiar

MgBox("Hello")

9.

Presione F5 para ejecutar el programa. Aparecer un cuadro de dilogo con el mensaje "Errores al compilar. Desea continuar y ejecutar la ltima versin generada correctamente?" 10. Haga clic en No. Se mostrar la ventana Lista de errores con el mensaje de error "No se ha declarado el 'nombre MgBox'". 11. Haga doble clic en el mensaje de error de la Lista de errores y cambie el cdigo por MsgBox("Hello"). 12. Presione F5 de nuevo. Ahora el programa debera ejecutarse y causar la aparicin de un cuadro de mensaje.

No funciona! Encontrar y eliminar errores en tiempo de ejecucin


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a depurar un programa y a corregir errores en tiempo de ejecucin. Como aprendi en su momento, los errores en tiempo de ejecucin se producen cuando el programa intenta realizar una operacin que es imposible finalizar. Cuando se produce un error en tiempo de ejecucin, el programa se detiene y aparece un mensaje de error; debe depurar el error y corregirlo para que el programa pueda continuar.

Encontrar y corregir errores en tiempo de ejecucin

La mayora de los errores en tiempo de ejecucin se producen porque se cometi un error en el cdigo; por ejemplo, olvid asignar un valor a una variable antes de utilizarla. Cuando se ejecute el programa y se descubra el error, el programa se detendr y el cuadro de dilogo Ayudante de excepciones se mostrar en la ventana Editor de cdigo. Cuando esto sucede, el programa est en modo de interrupcin, que es el modo en que se realiza la depuracin. El cuadro de dilogo Ayudante de excepciones contiene una descripcin del error, as como sugerencias para la solucin de problemas que indican la causa. Puede hacer clic en las sugerencias sobre solucin de problemas para mostrar los temas de Ayuda y obtener ms detalles. Es necesario corregir el error para que pueda continuar con el programa; para ello, debe inspeccionar el cdigo para encontrar la causa del error. Por ejemplo, si sospecha que se produjo un error porque una variable contiene el valor equivocado, estando todava en el modo de interrupcin, puede utilizar IntelliSense para ver el valor de la variable. Cuando se coloca el mouse sobre la variable en el Editor de cdigo, la informacin sobre herramientas muestra el valor de la variable. Si el valor no es lo que esperaba, compruebe en el cdigo anterior dnde se estableci el valor y despus arregle el cdigo y contine.

Intntelo

Para revisar el valor de una variable


1. 2. 3. En el men Archivo, seleccione Nuevo proyecto. En el panel Plantillas, en el cuadro de dilogo Nuevo proyecto, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba RunTimeErrors y haga clic en Aceptar. Se abrir un nuevo proyecto de formularios Windows Forms. 4. 5. Haga doble clic en el formulario para abrir el Editor de cdigo. En el controlador de eventos Form_Load, agregue el siguiente cdigo. VB Copiar

Dim miles As Integer = 0 Dim hours As Integer = 0 Dim speed As Integer = 0

VB

Copiar

miles = 55 speed = miles / hours MsgBox(CStr(speed) & " miles per hour")

6.

Presione F5 para ejecutar el programa. Aparece un cuadro de dilogo Ayudante de excepciones con el mensaje "No se control OverflowException". Una lnea de puntos que va del cuadro de dilogo a su archivo de cdigo seala la lnea de cdigo que produjo el error. Observe que la primera sugerencia sobre solucin de problemas del Ayudante de excepciones indica que debe asegurarse de no estar dividiendo por cero.

7. 8.

Mueva el mouse sobre la variable miles y mantngalo ah durante unos segundos. La informacin sobre herramientas que ver dice "miles 55". Ahora mueva el mouse sobre la variable hours; la informacin sobre herramientas debe decir "hours 0". Debido a que no se puede dividir por cero y el valor de hours es cero, ya ha encontrado la causa del error: no haber actualizado el valor de hours.

9.

Agregue la siguiente lnea de cdigo sobre la lnea miles = 55. VB Copiar

hours = 2

10. Haga clic en la flecha amarilla situada en el margen izquierdo del cdigo y arrstrela hasta la lnea hours = 2. Esto permite que el programa contine desde esa lnea en lugar de continuar desde la lnea que contiene el error. Para que se reconozca la solucin del error es necesario ejecutar la nueva lnea de cdigo recin agregada. 11. Presione F5 para que el programa contine. Aparece un cuadro de dilogo que muestra "28 miles per hour".

Informacin detallada: qu ocurrira si... Comprobar cdigo en la ventana Inmediato


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a evaluar y ejecutar un cdigo utilizando la ventana Inmediato. En la leccin anterior, aprendi cmo corregir errores en tiempo de ejecucin utilizando el Ayudante de excepciones. Sin embargo, a veces es posible que no est claro cmo corregir un error y se desee probar una posible correccin sin cambiar el cdigo. Una ventana de depuracin especial, la ventana Inmediato, permite hacer eso y ms.

La ventana Inmediato

Cuando el programa est en modo de interrupcin, se puede utilizar la ventana Inmediato para ejecutar fragmentos de cdigo o evaluar variables y expresiones. Por ejemplo, si aparece un error en tiempo de ejecucin debido a una variable vaca, puede comprobar el valor de la variable. Puede utilizar tambin la ventana Inmediato para asignar un valor a esa variable y comprobar cmo se ejecuta el resto del programa.

Sugerencia:
Cuando ejecuta el programa en modo de depuracin, puede poner el programa en modo de interrupcin en cualquier momento, seleccionando Interrumpir del men Depurar.

Para ejecutar el cdigo en la Ventana Inmediato escrbalo como lo hara en el Editor de cdigo y presione ENTRAR. Para evaluar una variable o expresin, escriba un signo de interrogacin seguido por la variable o expresin que desea evaluar y presione ENTRAR, el resultado se mostrar en la siguiente lnea.

Intntelo!

Para probar el cdigo en la ventana Inmediato


1. 2. 3. En el men Archivo, seleccione Nuevo proyecto. En el panel Plantillas, en el cuadro de dilogo Nuevo proyecto, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Immediate y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. 6. En el Cuadro de herramientas, arrastre dos controles TextBox y un control Button al formulario. Haga doble clic en el botn para abrir el Editor de cdigo. En el controlador de eventos Button_Click, agregue el siguiente cdigo. VB Copiar

Dim miles As Integer = 0 Dim hours As Integer = 0 Dim speed As Integer = 0

VB Copiar

miles = CInt(Textbox1.Text) hours = CInt(Textbox2.Text) speed = miles / hours MsgBox(CStr(speed) & " miles per hour")

7. 8. 9.

Presione F5 para ejecutar el programa. Escriba 100 en el primer cuadro de texto y, a continuacin, escriba 0 en el segundo cuadro de texto. Haga clic en Button1. El programa se detendr y aparecer el cuadro de dilogo Ayudante de excepciones con el mensaje "No se control OverflowException". En la ventana Inmediato en la parte inferior del IDE, escriba ?miles y presione ENTRAR. El valor 100 debe aparecer en la lnea siguiente.

Sugerencia:
Puede abrir en cualquier momento la ventana Inmediato eligiendo Ventanas, Inmediato en el men Depurar.

10. Escriba ?hours y presione ENTRAR. El valor 0 debe aparecer en la lnea siguiente. 11. Escriba hours = 4 y presione ENTRAR. Escriba ?hours y presione ENTRAR. Observe que el valor de hours es ahora 4, el valor que especific en la lnea anterior. Puede cambiar el valor de hours en la ventana Inmediato sin cambiar el cdigo del programa. 12. Presione F5 para continuar. Se mostrar un cuadro de mensaje con el resultado.

Sugerencia:
Para evitar que se produzca este error en tiempo de ejecucin, agregue un controlador de errores que compruebe que hay un nmero vlido en el bloque Try y muestre un mensaje al usuario en el bloque Catch. Para obtener ms informacin sobre controladores de errores, vea Qu hacer cuando algo sale mal: control de errores.

Qu? Esto no debiera haber ocurrido. Encontrar errores lgicos


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a encontrar errores lgicos en el programa. En lecciones anteriores, aprendi a encontrar y corregir errores del compilador y errores en tiempo de ejecucin. El tercer tipo de error de programacin, los errores lgicos, puede ser el ms difcil de detectar. Con los errores lgicos no se obtiene ninguna advertencia, se ejecutar el programa pero

proporcionar resultados incorrectos. Es necesario repasar el cdigo y determinar la razn del problema. Afortunadamente, las herramientas de depuracin de Visual Basic pueden ayudar. Dos tcnicas de depuracin, que establecen puntos de interrupcin e instrucciones paso a paso a travs del cdigo, permiten inspeccionar el cdigo lnea por lnea mientras se ejecuta para encontrar el error. Se puede establecer un punto de interrupcin en el Editor de cdigo para cualquier lnea ejecutable de cdigo. Cuando se ejecuta el programa, los puntos de interrupcin fuerzan que se detenga y el programa entra en el modo de interrupcin cuando llega a esa lnea de cdigo. Puede obtener la informacin que desee sobre el estado del programa en ese momento. Puede comprobar el valor de cualquier variable, comprobar expresiones en la ventana Inmediato o realizar cambios en el cdigo con Editar y continuar. Cuando est en modo de interrupcin, puede recorrer el cdigo, ejecutando lnea por lnea para ver cmo funciona. Al presionar la tecla F8, se ejecutar la lnea de cdigo actual y se detendr en la lnea siguiente. Puede inspeccionar los valores de variables para ver cmo cambian de una lnea a la siguiente. Si la lnea de cdigo actual llama a una funcin o procedimiento Sub en otra parte del cdigo, cuando presiona F8, la ejecucin se desplazar a ese procedimiento. Una vez que se haya ejecutado ese procedimiento, el programa volver a la lnea siguiente a la que llam al procedimiento. Si no desea recorrer un procedimiento, puede presionar MAYS+F8 para saltarlo.

Intntelo

Para observar un error lgico


1. 2. 3. En el men Archivo, elija Nuevo proyecto. En el panel Plantillas, en el cuadro de dilogo Nuevo proyecto, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba LogicErrors y haga clic en Aceptar. Se abre un nuevo proyecto de formularios Windows Forms. 4. 5. 6. Desde el Cuadro de herramientas, arrastre dos controles TextBox y un control Button hacia el formulario. Haga doble clic en Button1 para abrir el Editor de cdigo. En el controlador de eventos Button1_Click, agregue el siguiente cdigo. VB Copiar

Dim minutes As Integer = CInt(Textbox1.Text) Dim miles As Double = CDbl(Textbox2.Text) Dim hours As Double = 0 hours = minutes / 60

MsgBox("Average speed " & GetMPH(hours, miles))

7.

Debajo de la lnea End Sub, agregue la siguiente funcin. VB Copiar

Function GetMPH(ByVal miles As Double, ByVal hours As Double) _ As String GetMPH = CStr(miles / hours) End Function

8.

Presione F5 para ejecutar el programa. En el primer cuadro de texto, escriba 10 (para representar 10 minutos) y en el segundo cuadro de texto, escriba 5 (para representar las millas) y, a continuacin, haga clic en Button1. Aparecer un cuadro con el mensaje "Average speed 0.03333334" (velocidad media 0,03333334) ; no obstante, si recorre 5 millas en diez minutos, la respuesta correcta seran 30 mph. Mantenga abierto el proyecto: en el siguiente procedimiento aprender cmo encontrar el error lgico.

Encontrar errores lgicos

En el ltimo ejemplo, algo est obviamente mal con la lgica del programa. Segn el resultado, viaja menos de una milla por hora, no treinta millas por hora como espera, pero dnde est el error? En el siguiente procedimiento se establecer un punto de interrupcin y se examinar el cdigo para encontrar el error.

Intntelo

Para establecer un punto de interrupcin y recorrer el cdigo


1. En el Editor de cdigo, busque la lnea hours = minutes / 60 y haga clic en el margen izquierdo.

Aparecer un punto rojo en el margen y el cdigo resaltado en rojo, lo que representa un punto de interrupcin. 2. Presione F5 para ejecutar el programa nuevamente. En el primer cuadro de texto, escriba 10 y en el segundo cuadro de texto, escriba 5. Haga clic en Button1. El programa se detendr cuando llegue al punto de interrupcin. La lnea hours = minutes / 60 aparecer resaltada en amarillo. Inspeccione los valores de las variables manteniendo el mouse sobre ellos; el valor de hours debe ser 0 y el valor de minutes debe ser 10. 3. Presione F8 para ejecutar la lnea hours = minutes / 60 y pasar a la siguiente lnea. Inspeccione los valores de las variables de la lnea MsgBox("Average speed " & GetMPH(hours, miles)), el valor de hours debe ser ahora 0.166666672 y el valor de miles debe ser 5.0. 4. Presione F8 de nuevo para ejecutar la lnea actual. Observe que la ejecucin baja a la lnea Function GetMPH. Inspeccione los valores de las variables en esta lnea; observar que el valor de miles es ahora 0.166666672 y el de hours es 5.0, lo contrario de lo que eran en la lnea anterior. Ha encontrado el error. Mantenga abierto el proyecto: en el siguiente procedimiento aprender a corregir el error lgico.

Corregir errores lgicos

En el procedimiento anterior, los valores para las variables miles y hours cambiaron de lugar. Puede identificar la causa? Si examina la lnea MsgBox("Average speed " & GetMPH(hours, miles)), ver que a la funcin GetMPH se pasan dos argumentos, hours y miles, en ese orden. Si examina la declaracin de funcin Function GetMPH(ByVal miles As Double, ByVal hours As Double)..., observar que los argumentos se muestran como miles primero y como hours despus. Se produjo un error en la lgica porque los argumentos se pasaron en el orden equivocado, produciendo un clculo incorrecto. Si los argumentos hubieran sido de tipos diferentes, habra visto un error en tiempo de ejecucin, pero como los argumentos eran del mismo tipo, no se produjo el error. Fue un error simple, pero el error resultante fue difcil de encontrar. En el siguiente procedimiento se establecer un punto de interrupcin y se recorrer el cdigo para encontrar el error.

Intntelo

Para corregir el error lgico


1. En el Editor de cdigo, cambie la lnea MsgBox("Average speed " & GetMPH(hours, miles)) para que se lea de la siguiente manera: VB Copiar

MsgBox("Average speed " & GetMPH(miles, hours))

2. 3.

Haga clic en el punto rojo en el margen izquierdo para borrar el punto de interrupcin. Presione F5 para ejecutar el programa. En el primer cuadro de texto, escriba 10 y en el segundo cuadro de texto, escriba 5. Haga clic en Button1. Esta vez el cuadro de mensaje debe mostrar el resultado correcto, "Average speed 30" (velocidad media 30). Puede parecer que se corrigi el programa, pero hay otro error lgico aun ms difcil de encontrar. Si desea probar y encontrarlo, mantenga el proyecto abierto; lo usar de nuevo en la leccin Otro error: todava hay algo que no va bien.

Otro error: todava hay algo que no va bien


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, aprender a encontrar un error lgico que slo se produce en situaciones determinadas. En la leccin anterior, Qu? Esto no debiera haber ocurrido. Encontrar errores lgicos, aprendi a encontrar y corregir un error de lgica. En el cdigo de ejemplo de esa leccin, an existe un error oculto: uno que es ms difcil de encontrar porque slo se produce en situaciones determinadas.

Probar un programa

Como desarrollador, se encuentra en desventaja cuando debe probar el programa para ver si se comporta segn lo deseado. Sabe cmo debe funcionar, de modo que es improbable que se cometa un error que pueda revelar un error lgico. Sin embargo, un usuario que no est familiarizado con el programa puede y har cosas en las que no ha pensado. Por ejemplo, en un programa que calcula millas por hora dividiendo el nmero de millas recorridas por el nmero de horas que demor el viaje, qu pasa si el usuario escribe cero para las horas o las millas? Probmoslo y vea.

Intntelo

Para probar el programa


1. Abra el proyecto LogicErrors que se cre en la leccin anterior, Qu? Esto no debiera haber ocurrido. Encontrar errores lgicos.

Nota:
Si no finaliz o no guard el proyecto anterior, deber regresar y finalizarlo antes de poder continuar.

2.

Presione F5 para ejecutar el programa. En el primer cuadro de texto, escriba 0 (para representar minutos) y en el segundo escriba 5 (para representar millas) y, a continuacin, haga clic en Button1. Se muestra un cuadro de mensaje con el mensaje "Velocidad media infinito." Mantenga abierto el proyecto: en el siguiente procedimiento aprender a encontrar el error lgico.

5 dividido por 0 = Infinito?

En el procedimiento anterior, es posible que "Infinito" no sea lo que se esperaba, pero es matemticamente correcto: 0 cabe en 5 un nmero infinito de veces. Sin embargo, ste no es el resultado que se desea que los usuarios del programa vean. Puede pensar en una forma de evitar esto? Podra pensar en agregar un controlador de errores, un procedimiento descrito en la leccin Qu hacer cuando algo sale mal: control de errores. Sin embargo, en este caso no funcionara porque el resultado "Infinito" no es un error, nicamente no es lo que desea. Puesto que no es til mostrar una velocidad de cero, una manera de corregir el problema es probar un valor de cero y advertir al usuario que debe escribir un nmero mayor. Mientras se realiza esto, tambin se puede evitar que el usuario escriba nmeros negativos, puesto que los nmeros negativos tambin pueden generar un resultado falso.

En el siguiente procedimiento, se modificar el cdigo en el controlador de eventos Button1_Click para llamar slo a la funcin GetMPH si los valores son mayores que cero.

Intntelo

Para corregir el error


1. En el Editor de cdigo, cambie el cdigo en el controlador de eventos Button1_Click de la siguiente manera: VB Copiar

Dim minutes As Integer = CInt(Textbox1.Text) Dim miles As Double = CDbl(Textbox2.Text) Dim hours As Double = 0 If minutes <= 0 Or miles <= 0 Then MsgBox("Please enter a number greater than zero") Else hours = minutes / 60 MsgBox("Average speed " & GetMPH(miles, hours)) End If

2.

Presione F5 para ejecutar el programa nuevamente. En el primer cuadro de texto, escriba 0, y en el segundo, escriba 5. A continuacin, haga clic en Button1. Aparecer el cuadro de mensaje indicndole que especifique un nmero mayor que 0. Intntelo probando el programa con otras combinaciones de nmeros hasta que est seguro de que se ha corregido el error.

Agregar notas a programas: utilizar comentarios


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre cmo crear comentarios en el cdigo de sus programas. El cdigo que forma un programa puede ser difcil de leer y entender, sobre todo si el usuario no es la persona que lo escribi originalmente. Al utilizar comentarios, puede crear notas para s mismo o para otros usuarios del cdigo. Los comentarios son entradas de texto del editor de cdigo que el compilador de Visual Basic omite cuando se ejecuta el programa. Por tanto, puede escribir una nota que explique lo que hace una seccin determinada del programa, o bien un aviso para finalizar las tareas de programacin incompletas. El comentario se crea iniciando una lnea con el carcter '. El ejemplo siguiente muestra cmo crear un comentario. VB Copiar

' This is a comment. WOW!

Tambin puede agregar comentarios al final de las lneas, as como usar el carcter '. Este procedimiento suele realizar para proporcionar comentarios sobre lneas individuales de cdigo, como se ve en el ejemplo siguiente. VB Copiar

MsgBox("Hello World!") ' This line causes a message box to appear.

Al igual que con los comentarios de una nica lnea, el programa omite todo lo que vaya despus del carcter ' de esa lnea.

Utilizar comentarios para depuracin

Otro uso comn de los comentarios es evitar temporalmente que una lnea de cdigo se ejecute mientras depura su programa. Por ejemplo, suponga que tena una lnea que mostraba un cuadro de mensaje. VB Copiar

MsgBox("Hello World!")

Si quiere ejecutar el programa sin mostrar esa lnea, pero no desea eliminarla permanentemente, utilice el carcter del comentario (') para ocultarla temporalmente de su programa, tal y como se muestra a continuacin. VB Copiar

' MsgBox("Hello World!")

Como todo lo que va despus del carcter ' se omite, el programa se ejecutar sin ejecutar esa lnea. Puede quitar el carcter ' despus y se mostrar el cuadro de mensaje.

Intntelo!

Para insertar comentarios


1. 2. 3. En el men Archivo, elija Nuevoproyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Comments y, a continuacin, haga clic en Aceptar. Se abrir un nuevo proyecto de formularios Windows Forms. 4. 5. Haga doble clic en el formulario para abrir el Editor de cdigo. En el controlador del evento Form1_Load, escriba el siguiente cdigo. VB Copiar

' This code will cause two message boxes to appear MsgBox("This is Message Box 1") ' Display Message Box 1

MsgBox("This is Message Box 2") ' Display Message Box 2

6.

Presione F5 para ejecutar el programa. El programa se inicia y se muestran los dos cuadros de mensaje de uno en uno.

7. 8.

En el men Depurar, elija Detener depuracin para finalizar el programa. En el Editor de cdigo, agregue un carcter de comentario (') a la primera lnea del cuadro de mensaje, para que se lea lo siguiente. VB Copiar

' MsgBox("This is MessageBox 1") ' Ignore Message Box 1

9.

Presione F5 para ejecutar el programa. Observe que esta vez el programa omite la primera lnea del cuadro de mensaje y slo se muestra el segundo cuadro de mensaje.

Agregar notas a programas: utilizar comentarios


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 En esta leccin, obtendr informacin sobre cmo crear comentarios en el cdigo de sus programas. El cdigo que forma un programa puede ser difcil de leer y entender, sobre todo si el usuario no es la persona que lo escribi originalmente. Al utilizar comentarios, puede crear notas para s mismo o para otros usuarios del cdigo. Los comentarios son entradas de texto del editor de cdigo que el compilador de Visual Basic omite cuando se ejecuta el programa. Por tanto, puede escribir una nota que explique lo que hace una seccin determinada del programa, o bien un aviso para finalizar las tareas de programacin incompletas.

El comentario se crea iniciando una lnea con el carcter '. El ejemplo siguiente muestra cmo crear un comentario. VB Copiar

' This is a comment. WOW!

Tambin puede agregar comentarios al final de las lneas, as como usar el carcter '. Este procedimiento suele realizar para proporcionar comentarios sobre lneas individuales de cdigo, como se ve en el ejemplo siguiente. VB Copiar

MsgBox("Hello World!") ' This line causes a message box to appear.

Al igual que con los comentarios de una nica lnea, el programa omite todo lo que vaya despus del carcter ' de esa lnea.

Utilizar comentarios para depuracin

Otro uso comn de los comentarios es evitar temporalmente que una lnea de cdigo se ejecute mientras depura su programa. Por ejemplo, suponga que tena una lnea que mostraba un cuadro de mensaje. VB Copiar

MsgBox("Hello World!")

Si quiere ejecutar el programa sin mostrar esa lnea, pero no desea eliminarla permanentemente, utilice el carcter del comentario (') para ocultarla temporalmente de su programa, tal y como se muestra a continuacin. VB Copiar

' MsgBox("Hello World!")

Como todo lo que va despus del carcter ' se omite, el programa se ejecutar sin ejecutar esa lnea. Puede quitar el carcter ' despus y se mostrar el cuadro de mensaje.

Intntelo!

Para insertar comentarios


1. 2. 3. En el men Archivo, elija Nuevoproyecto. En el cuadro de dilogo Nuevo proyecto, en el panel Plantillas, haga clic en Aplicacin para Windows. En el cuadro Nombre, escriba Comments y, a continuacin, haga clic en Aceptar. Se abrir un nuevo proyecto de formularios Windows Forms. 4. 5. Haga doble clic en el formulario para abrir el Editor de cdigo. En el controlador del evento Form1_Load, escriba el siguiente cdigo. VB Copiar

' This code will cause two message boxes to appear MsgBox("This is Message Box 1") ' Display Message Box 1 MsgBox("This is Message Box 2") ' Display Message Box 2

6.

Presione F5 para ejecutar el programa. El programa se inicia y se muestran los dos cuadros de mensaje de uno en uno.

7. 8.

En el men Depurar, elija Detener depuracin para finalizar el programa. En el Editor de cdigo, agregue un carcter de comentario (') a la primera lnea del cuadro de mensaje, para que se lea lo siguiente. VB Copiar

' MsgBox("This is MessageBox 1") ' Ignore Message Box 1

9.

Presione F5 para ejecutar el programa. Observe que esta vez el programa omite la primera lnea del cuadro de mensaje y slo se muestra el segundo cuadro de mensaje.

Administrar registros: utilizar datos en un programa


Visual Studio 2008 Otras versiones

Actualizacin: noviembre 2007 La mayora de los programas utiliza los datos de una forma u otra. Por ejemplo, en una leccin anterior, especific datos en forma de nmeros; esos datos se utilizaron en un clculo con el resultado devuelto en un cuadro de mensajes. En programas muy simples, los datos se representan como campos dentro del mismo programa. Sin embargo, en los programas ms complejos, los datos se almacenan en una estructura independiente del programa, denominada base de datos. En este conjunto de lecciones, aprender a crear una base de datos y a utilizarla para mostrar y actualizar datos de los programas.

En esta seccin
Almacenar y obtener acceso a datos Explica cmo utilizar una base de datos para almacenar datos y tener acceso a ellos. Crear la primera base de datos Describe cmo crear una base de datos con Visual Database Tools en Visual Basic. Obtener la informacin necesaria: conectarse a una base de datos existente Describe cmo conectar un programa a una base de datos existente. Mostrar informacin al usuario: mostrar datos en la interfaz de usuario

Explica cmo crear una interfaz de usuario bsica para ver los datos de una base de datos local. Agregar o modificar registros: actualizar datos Muestra cmo crear un formulario de entrada de datos para actualizar los datos de una base de datos local. Mostrar datos relacionados Explica cmo agregar datos de una tabla y datos de una tabla relacionada a una aplicacin de formularios Windows Forms. Crear clases de LINQ to SQL usando el Diseador relacional de objetos Muestra cmo usar el Diseador relacional de objetos para crear clases LINQ to SQL y, a continuacin, enlazar los datos a controles en un formulario Windows Forms. Usar LINQ para enlazar datos a controles Explica cmo escribir una consulta LINQ y enlazar los resultados a un control en un formulario Windows Forms. Incluir XML directamente en el cdigo: usar literales XML Muestra cmo usar literales XML.

Tutorial 1: Crear un visor de imagen


Visual Studio 2010 En este tutorial, compilar un programa que carga una imagen de un archivo y la muestra en una ventana. Aprender a arrastrar controles como botones y cuadros de imagen en el formulario, establecer sus propiedades y utilizar los contenedores para cambiar el tamao del formulario de manera fluida. Tambin empezar a escribir cdigo. Aprender a:

Cree un nuevo proyecto. Probar (depurar) una aplicacin. Agregar controles bsicos, como casillas y botones, a un formulario. Colocar controles en un formulario mediante los diseos. Agregar los cuadros de dilogo Abrir archivo y Color a un formulario. Escribir cdigo mediante IntelliSense y fragmentos de cdigo. Escribir mtodos de control de eventos.

Cuando termine, el programa se parecer al de la ilustracin siguiente. Imagen que crear en este tutorial

Nota
En este tutorial, se trata tanto Visual C# como Visual Basic, por lo que deber centrarse en la informacin especfica del lenguaje de programacin que use.

Temas relacionados
Ttulo Descripcin

Paso 1: Crear un proyecto de aplicacin de Windows Forms

Empezar a crear un proyecto de aplicacin de Windows Forms. Ejecutar el programa de aplicacin de Windows Forms que se cre en el paso anterior.

Paso 2: Ejecutar el programa

Paso 3: Establecer las propiedades del formulario

Cambiar el aspecto del formulario mediante la ventana Propiedades. Agregar un control TableLayoutPanel al formulario.

Paso 4: Disear un formulario con un control TableLayoutPanel Paso 5: Agregar controles al formulario

Agregar controles, como PictureBox y CheckBox, al formulario. Agregar botones al formulario.

Paso 6: Asignar un nombre a los controles de botn

Cambiar el nombre de los botones por otros ms significativos. Agregar un componente OpenFileDialog y un componente ColorDialog al formulario. Escribir cdigo mediante la herramienta IntelliSense.

Paso 7: Agregar componentes de dilogo al formulario

Paso 8: Escribir cdigo para el controlador de eventos del botn Mostrar una imagen Paso 9: Revisar, comentar y probar el cdigo

Revisar y probar el cdigo. Agregar comentarios segn sea necesario. Escribir cdigo para hacer que funcionen otros botones y una casilla mediante IntelliSense. Ejecutar el programa y establecer el color de fondo. Probar con otras caractersticas, como cambiar colores, fuentes y bordes.

Paso 10: Crear botones adicionales y una casilla

Paso 11: Ejecutar el programa y probar otras caractersticas

Paso 1: Crear un proyecto de aplicacin de Windows Forms


Visual Studio 2010 El primer paso para crear un visor de imagen es crear un proyecto de aplicacin de Windows Forms.

Para crear un proyecto de aplicacin de Windows Forms


1. 2. 3. 4. En el men Archivo, haga clic en Nuevo proyecto. Si no usa Visual Studio Express, primero debe seleccionar un lenguaje. En la lista Plantillas instaladas, seleccione C# o Visual Basic. Haga clic en el icono Aplicacin de Windows Forms, especifique el nombre PictureViewer y haga clic en Aceptar. Visual Studio crea automticamente la solucin. Haga clic en Guardar todo en el men Archivo, o bien haga clic en el botn Guardar todo de la barra de herramientas, que aparece como sigue. Botn de la barra de herramientas Guardar todo

Nota
Visual Studio guarda el proyecto en la carpeta de proyectos. El entorno de desarrollo integrado (IDE) rellena automticamente el nombre de la carpeta y del proyecto. Si utiliza Visual Studio Express, deber completar los pasos 5-7. Para las versiones de Visual Studio que no son Express, el proyecto se guarda al crearlo por primera vez, de modo que los pasos 5-7 no son necesarios.

5. 6. 7.

Asegrese de que el proyecto se guarda en una carpeta que pertenezca a la carpeta Mis documentos. Compruebe que est activada la casilla Crear directorio para la solucin. Haga clic en Guardar.

Nota
Al crear el proyecto, el IDE de Visual Studio crea automticamente varios archivos y los coloca en una carpeta. Puede explorar esos archivos en la ventana del Explorador de soluciones. Al crear el proyecto por primera vez, los archivos se guardan en una carpeta temporal. Cuando se hace clic en el botn Guardar todo se ordena al IDE que los copie en una carpeta permanente (que suele estar contenida en la capeta Mis documentos).

8.

Seguramente habr notado que las palabras solucin y proyecto tienen significados diferentes, que se explicarn ms adelante en este tutorial. 9. La siguiente imagen muestra el aspecto que debe tener la ventana del IDE. 10. Ventana del IDE

11.

12. Si la pantalla no se parece la imagen anterior, haga clic en Restablecer diseo de la ventana en el men Ventana. Si falta cualquiera de las ventanas, haga clic en Ventana Propiedades o Explorador de soluciones en el men Vista. Si hay abierta alguna ventana de ms, haga clic en el botn Cerrar (x) de la parte superior derecha. 13. Fjese en la imagen. Desde la esquina superior izquierda y en sentido contrario a las agujas del reloj, la imagen muestra: Ventana principal: es donde se realiza la mayora del trabajo. Esta ventana se utiliza para trabajar con formularios y editar el cdigo. En este momento, muestra un formulario en el Editor de formularios. En la parte superior de la ventana, hay dos pestaas: Pgina principal y Form1.cs [Design]. (En Visual Basic, es .vb en lugar de .cs.) Ventana del Explorador de soluciones: es donde aparecen todos los archivos de la solucin. Al hacer clic en un archivo, la informacin mostrada en la ventana Propiedades cambia. Si hace doble clic en un archivo de cdigo (que finaliza en .cs para Visual C# y en .vb para Visual Basic), se abre el archivo de cdigo o un diseador para l. Ventana Propiedades: es donde se cambian las propiedades de los elementos seleccionados en las otras ventanas.

Nota
Observe que la lnea superior de la ventana del Explorador de soluciones muestra Solucin 'PictureViewer' (1 proyecto). El IDE ha creado una solucin automticamente. Una solucin puede contener ms de un proyecto. De momento, vamos a trabajar con soluciones que contienen un solo proyecto.

Paso 2: Ejecutar el programa


Visual Studio 2010 Al crear una solucin, en realidad compil un programa que se ejecuta. Todava no hace gran cosa; se limita a mostrar una ventana vaca que muestra Form1 en la barra de ttulo. Pero se ejecuta, como vamos a comprobar a continuacin.

Para ejecutar el programa


1. Presione la tecla F5 o haga clic el botn de la barra de herramientas Iniciar depuracin, que aparece como sigue. Botn de la barra de herramientas Iniciar depuracin

2.

El IDE ejecuta el programa y aparece una ventana. En la siguiente imagen se muestra el programa que ha compilado. El programa se est ejecutando y pronto lo ampliaremos. Programa de aplicacin de Windows Forms en ejecucin

3.

Regrese al IDE y examine la nueva barra de herramientas. Barra de herramientas de depuracin

4.

Haga clic en el botn Detener depuracin cuadrado, o bien haga clic en Detener depuracin en el men Depuracin. El programa dejar de ejecutarse y se cerrar la ventana. Tambin puede cerrar simplemente la ventana abierta para detener la depuracin.

Nota

Cuando se ejecuta un programa desde el IDE, se denomina depuracin porque se suele hacer para encontrar y corregir errores. Se trata de un programa autntico y se puede ejecutar exactamente igual que cualquier otro.

Paso 3: Establecer las propiedades del formulario


Visual Studio 2010 A continuacin, se utiliza la ventana Propiedades para cambiar la apariencia del formulario.

Para establecer las propiedades del formulario


1. 2. Asegrese de que est en el Diseador de Windows Forms. En el IDE, haga clic en la pestaa Form1.cs [Design] (o en la pestaa Form1.vb [Design] de Visual Basic). Haga clic en cualquier parte del formulario para seleccionarlo. Examine la ventana Propiedades, que ahora debera mostrar las propiedades del formulario. Los formularios tienen varias propiedades. Por ejemplo, puede establecer el color del primero plano y del fondo, el texto de ttulo que aparece en la parte superior del formulario, el tamao del formulario y otras propiedades.

Nota
Si la ventana Propiedades no aparece, detenga el programa haciendo clic en el botn Detener depuracin cuadrado (o simplemente cierre la ventana).

3.

Una vez seleccionado el formulario, desplcese hasta la parte inferior de la ventana Propiedades y busque la propiedad Text. Haga clic en Text, escriba Visor de imgenes y presione ENTRAR. Ahora, el formulario debera tener el texto Visor de imgenes en la barra de ttulo y la ventana Propiedades se debera parecer a la siguiente. Ventana Propiedades

Nota
Las propiedades se pueden ordenar en vistas por categoras o alfabtica. Puede alternar entre estas dos vistas utilizando los botones de la ventana Propiedades. En este tutorial, resulta ms fcil encontrar las propiedades en la vista alfabtica.

4.

Vuelva al Diseador de Windows Forms. Haga clic en el controlador de arrastre inferior derecho del formulario, que es el cuadradito blanco que aparece en el vrtice inferior derecho del formulario y tiene el siguiente aspecto. Controlador de arrastre

Arrstrelo para cambiar el tamao del formulario de modo que resulte ms ancho y un poco ms alto. 5. Fjese en la ventana Propiedades y observe que la propiedad Size ha cambiado. La propiedad Size cambia cada vez que se cambia el tamao del formulario. Pruebe a arrastrar el formulario para cambiar su tamao a unas medidas aproximadas de 550, 350, que deberan funcionar bien para este proyecto.

6.

Ejecute el programa de nuevo. Presione la tecla F5 o haga clic el botn de la barra de herramientas Iniciar depuracin, que aparece como sigue. Botn de la barra de herramientas Iniciar depuracin

Exactamente igual que antes, el IDE compila y ejecuta el programa, y aparece una ventana. 7. Antes de ir al paso siguiente, detenga el programa, porque el IDE no le permitir cambiarlo mientras est en ejecucin.

Paso 4: Disear un formulario con un control TableLayoutPanel


Visual Studio 2010 En este paso, agregar un control TableLayoutPanel al formulario.

Para disear el formulario con un control TableLayoutPanel


1. Vaya al Diseador de Windows Forms. Fjese en el lado izquierdo del formulario y busque la pestaa Cuadro de herramientas. Site el puntero del mouse en la pestaa Cuadro de herramientas. Aparecer el Cuadro de herramientas. (Si lo prefiere, en el men Ver, haga clic en Cuadro de herramientas.) Haga clic en el signo ms situado junto al grupo Contenedores para abrirlo, como se muestra en la siguiente imagen. Grupo Contenedores

2.

3.

Puede agregar controles como botones, casillas y etiquetas al formulario. Haga doble clic en el control TableLayoutPanel del Cuadro de herramientas. Al hacerlo, el IDE agrega un control TableLayoutPanel al formulario, como se muestra en la siguiente imagen. Control TableLayoutPanel

Nota
Si, despus de agregar el control TableLayoutPanel, aparece una ventana dentro del formulario con el ttulo Tareas de TableLayoutPanel, haga clic en cualquier parte del formulario para cerrarla. Aprenderemos ms cosas sobre esta ventana ms adelante en el tutorial.

Nota

Observe que el Cuadro de herramientas se expande para abarcar el formulario cuando se hace clic en su pestaa, y se cierra cuando se hace clic fuera de l. Se trata de la caracterstica Ocultar automticamente del IDE. Puede activarla o desactivarla para cualquiera de las ventanas, haciendo clic en el icono del pin de la esquina superior derecha de la ventana, para alternar entre ocultarla automticamente y bloquearla en su lugar. El icono del pin tiene este aspecto.

Icono del pin

4.

Asegrese de que TableLayoutPanel est seleccionado, haciendo clic en l. Puede comprobar qu control est seleccionado examinando la lista desplegable de la parte superior de la ventana Propiedades, como se muestra en la siguiente imagen. Ventana Propiedades que muestra el control TableLayoutPanel

5.

El selector de controles es una lista desplegable que figura en la parte superior de la ventana Propiedades. En este ejemplo, muestra que un control denominado tableLayoutPanel1 est seleccionado. Puede seleccionar los controles haciendo clic en ellos en el Diseador de Windows Forms o eligindolos en el selector de control. Ahora que TableLayoutPanel est seleccionado, busque la propiedad Dock y haga clic en Dock, que debera estar establecida en None. Observe que aparece una flecha de lista desplegable al lado del valor. Haga clic en la flecha y, a continuacin, seleccione el botn Fill (el botn grande del centro), como se muestra en la siguiente imagen. Ventana Propiedades con Fill seleccionado

6.

Despus de establecer la propiedad Dock de TableLayoutPanel en Fill, el panel rellena el formulario completo. Si vuelve a cambiar el tamao del formulario, TableLayoutPanel permanecer acoplado y cambiar de tamao para ajustarse al formulario.

Nota
TableLayoutPanel funciona exactamente igual que una tabla de Microsoft Office Word: tiene filas y columnas, y una celda individual puede abarcar varias filas y columnas. Cada celda puede contener un control (como un botn, una casilla o una etiqueta). Este control TableLayoutPanel va a contener un control PictureBox que abarcar completamente su fila superior, un control CheckBox en la celda inferior izquierda, y cuatro controles Button en la celda inferior derecha.

Nota
Aunque hemos dicho que cada celda puede contener un solo control, la celda inferior derecha tiene cuatro controles Button. Esto es porque se puede colocar un control en una celda que contiene otros controles. Este tipo de control se denomina contenedor, y TableLayoutPanel es un contenedor. Aprenderemos ms cosas sobre ello ms adelante en este tutorial.

7.

Actualmente, TableLayoutPanel tiene dos filas del mismo tamao y dos columnas del mismo tamao. Tenemos que cambiar su tamao de modo que la fila superior y la columna derecha sean mucho mayores. En el Diseador de Windows Forms, seleccione TableLayoutPanel. En la esquina superior derecha, hay un botoncito triangular de color negro, con el siguiente aspecto. Botn triangular

Este botn indica que el control tiene tareas que le ayudan a establecer sus propiedades automticamente. 8. Haga clic en el tringulo para mostrar la lista de tareas del control, como se muestra en la siguiente imagen. Tareas de TableLayoutPanel

9.

Haga clic en la tarea Editar filas y columnas para abrir la ventana Estilos de columna y fila. Haga clic en Column1 y establezca su tamao en el 15 por ciento; para ello, asegrese de que el botn Porcentaje y escriba 15 en el cuadro Porcentaje. (Se trata de un control NumericUpDown, que utilizar en un tutorial posterior.) Haga clic en Column2 y establzcala en el 85 por ciento. No haga clic todava en el botn Aceptar, porque la ventana se cerrar. (Si lo hace, puede volver a abrirla mediante la lista de tareas.) 10. En la lista desplegable Mostrar de la parte superior de la ventana, haga clic en Filas. Establezca Row1 en el 90 por ciento y Row2 en el 10 por ciento. 11. Haga clic en Aceptar. TableLayoutPanel debera tener ahora una fila superior grande, una fila inferior pequea, una columna izquierda pequea y una columna derecha grande. Puede cambiar el tamao de las filas y columnas de TableLayoutPanel arrastrando sus bordes.

Paso 5: Agregar controles al formulario


Visual Studio 2010 En este paso, se agregan controles, como un control PictureBox y un control CheckBox, al formulario. A continuacin, se agregan botones al formulario.

Para agregar controles al formulario


1. 2. Vaya al Cuadro de herramientas y expanda el grupo Controles comunes. Se muestran los controles ms comunes que suelen aparecer en los formularios. Haga doble clic en el control PictureBox. El IDE agrega un control PictureBox al formulario. Dado que TableLayoutPanel est acoplado de modo que rellene el formulario, el IDE agrega el control PictureBox a la primera celda vaca. Haga clic en el tringulo negro del nuevo control PictureBox para abrir su lista de tareas, como se muestra en la siguiente imagen.

3.

Tareas de PictureBox

Nota
Si agrega accidentalmente un tipo equivocado de control a TableLayoutPanel, puede eliminarlo. Haga clic con el botn secundario en el control y seleccione Eliminar en el men. Tambin puede seleccionar Deshacer en el men Edicin para quitar controles del formulario.

4.

5.

6.

Haga clic en el vnculo Acoplar en contenedor principal. Se establece automticamente la propiedad Dock de PictureBox en Fill. Para verlo, haga clic en el control PictureBox para seleccionarlo, vaya a la ventana Propiedades y asegrese de que la propiedad Dock est establecida en Fill. Haga que PictureBox abarque ambas columnas cambiando su propiedad ColumnSpan. Seleccione el control PictureBox y establezca su propiedad ColumnSpan en 2. Adems, cuando el PictureBox est vaco, se debe mostrar un marco vaco. Establezca su propiedad BorderStyle en Fixed3D. Agregue el control CheckBox al formulario. Haga doble clic en el elemento CheckBox del Cuadro de herramientas para que el IDE agregue un nuevo control CheckBox a la siguiente celda libre de la tabla. Como el control PictureBox ocupa las dos primeras celdas, el control CheckBox se agrega a la celda inferior izquierda. Seleccione el nuevo control CheckBox y establezca su propiedad Text en Stretch, como se muestra en la siguiente imagen. Control TextBox con la propiedad Stretch

7.

Entre al grupo Contenedores del Cuadro de herramientas (donde obtuvo el control TableLayoutPanel) y haga doble clic en el elemento FlowLayoutPanel para agregar un nuevo control a la ltima celda del control PictureBox. A continuacin, acplelo en el contenedor primario (bien eligiendo Acoplar en contenedor principal en la lista de tareas o bien estableciendo su propiedad Dock en Fill.)

Nota
FlowLayoutPanel es un contenedor que organiza otros controles en filas ordenadas. Al cambiar el tamao de FlowLayoutPanel, coloca todos los controles que contiene en una sola fila, siempre que tenga espacio para ello. De lo contrario, los organiza en lneas, uno encima de otro. Vamos a utilizar un control FlowLayoutPanel para contener cuatro botones.

Para agregar botones


1. Seleccione el control FlowLayoutPanel que acaba de agregar. Vaya a Controles comunes en el Cuadro de herramientas y haga doble clic en el icono Button para agregar un botn denominado button1 a FlowLayoutPanel. Repita el proceso para agregar otro botn. El IDE determina que ya hay un botn denominado button1, de modo que denomina button2 al siguiente botn.

Nota
En Visual Basic, los nombres de los botones llevan mayscula inicial, as que button1 ser Button1, button2 ser Button2, etc.

2.

Normalmente, se agregan los dems botones mediante el Cuadro de herramientas. Esta vez, haga clic en button2 y seleccione Copiar en el men Edicin (o presione Ctrl+C). En el men Edicin, haga clic en Pegar (o presione Ctrl+V) para pegar una copia del botn. Vuelva a pegarlo otra vez. El IDE ha agregado button3 y button4.

Nota
Puede copiar y pegar cualquier control. El IDE da nombre y coloca los nuevos controles de una manera lgica. Si se pega un control en un contenedor, el IDE elige el siguiente espacio lgico para colocarlo.

3.

4.

Seleccione el primer botn y establezca su propiedad Text en Mostrar una imagen. Luego, establezca las propiedades Text de los otros tres botones siguientes en Borrar la imagen, Establecer el color de fondo y Cerrar. El paso siguiente consiste en dimensionar los botones y organizarlos de modo que estn alineados a la izquierda del panel. Seleccione el control FlowLayoutPanel y fjese en su propiedad FlowDirection. Cmbiela de modo que quede establecida en RightToLeft. En

cuanto lo haga, los botones deberan alinearse a la derecha de la celda, en orden inverso de modo que el botn Mostrar una imagen quede a la derecha.

Nota
Si los botones siguen en orden incorrecto, puede arrastrarlos alrededor de FlowLayoutPanel para reorganizarlos en cualquier orden. Puede hacer clic en uno de los botones y arrastrarlo a la izquierda o la derecha.

5.

Haga clic en el botn Cerrar para seleccionarlo. Mantenga presionada la tecla CTRL y haga clic en los otros tres botones, para que todos estn seleccionados. Mientras todos los botones estn seleccionados, vaya a la ventana Propiedades y desplcese hacia arriba hasta la propiedad AutoSize. Esta propiedad indica al botn que cambie el tamao automticamente para ajustarse al texto que contiene. Establzcala en true. Ahora, los botones deberan tener el tamao y orden correctos. (Si los cuatro botones estn seleccionados, puede cambiar las cuatro propiedades AutoSize al mismo tiempo.) En la siguiente imagen se muestran los cuatro botones. Visor de imgenes con cuatro botones

6.

Ahora, ejecute de nuevo el programa para ver el formulario que acaba de disear. Al hacer clic en los botones y la casilla todava no sucede nada, pero funcionarn pronto.

Paso 6: Asignar un nombre a los controles de botn


Visual Studio 2010 Hay solo un control PictureBox en el formulario. Al agregarlo, el IDE lo denomin automticamente pictureBox1. Solamente hay una casilla, denominada checkBox1. Pronto, escribir cdigo, y ese cdigo har referencia a CheckBox y PictureBox. Como no hay ms que un ejemplar de cada control, entender lo que significan los trminos pictureBox1 o checkBox1 cuando los vea en su cdigo.

Nota

En Visual Basic, la primera letra del nombre de un control se pone en mayscula de forma predeterminada, de modo que los nombres son PictureBox1, CheckBox1, etc.

Hay cuatro botones en el formulario, que el IDE ha denominado button1, button2, button3 y button4. Solo con mirar los nombres actuales no sabemos cul es el botn Cerrar ni cul es el botn Mostrar una imagen. Por ello, resulta til dar nombres a los controles de botn.

Para dar un nombre a los controles de botn


1. Haga clic en el botn Cerrar. (Si todava estn seleccionados todos los botones, presione la tecla ESC para cancelar la seleccin.) Desplcese en la ventana Propiedades hasta que vea la propiedad (Name). (La propiedad (Name) se encuentra cerca de la parte superior cuando las propiedades estn por orden alfabtico.) Cambie el nombre a closeButton, como se muestra en la siguiente imagen. Ventana Propiedades con el nombre closeButton

Nota
Si intenta cambiar el nombre del botn por BotnCerrar, con un espacio entre las palabras Botn y Cerrar, el IDE muestra el mensaje de error: "El valor de la propiedad no es vlido". En los nombres de los controles no se permiten espacios (ni algunos otros caracteres).

2.

Cambie el nombre de los otros tres botones a backgroundButton, clearButton y showButton. Puede comprobar los nombres haciendo clic en la lista desplegable de seleccin de controles en la ventana Propiedades. Aparecern los nuevos nombres de los botones.

3.

Haga doble clic en el botn Mostrar una imagen en el Diseador de Windows Forms. Al hacerlo, el IDE abre una nueva pestaa en la ventana principal denominada pestaa Form1.cs, como se muestra en la siguiente imagen. Pestaa Form1.cs con cdigo de Visual C#

4.

Cntrese en esta parte del cdigo. C# VB Copiar

Private Sub showButton_Click() Handles showButton.Click

End Sub

Se trata de un mtodo denominado showButton_Click(). El IDE lo agreg al hacer clic en el botn showButton. Este mtodo contiene cdigo que se ejecuta cuando se hace clic en el botn Mostrar una imagen.

Nota
En este tutorial, el cdigo de Visual Basic que se genera automticamente se ha simplificado quitando todo lo que hay entre los parntesis (). Siempre que esto sucede, se puede quitar el mismo cdigo. El programa funcionar en ambos casos. En el resto de los tutoriales, se simplifica el cdigo generado automticamente siempre que sea posible.

5.

6.

Vaya a la pestaa del diseador (pestaa Form1.cs [Design] en Visual C# o Form1.vb [Design] en Visual Basic) y haga doble clic en el botn Borrar la imagen. Repita el procedimiento para los dos ltimos botones. Cada vez, el IDE agrega un nuevo mtodo al cdigo del formulario. Haga doble clic en el control CheckBox en el Diseador de Windows Forms, para que el IDE agregue un mtodo checkBox1_CheckedChanged() ms. Se llama a este mtodo cada vez que el usuario activa o desactiva la casilla.

Nota
Cuando se trabaja en un programa, a menudo se utilizan alternativamente el editor de cdigo y el Diseador de Windows Forms. El IDE facilita la navegacin en el proyecto. El Explorador de soluciones se utiliza para abrir el Diseador de Windows Forms haciendo doble clic en Form1.cs en Visual C# o en Form1.vb en Visual Basic.

7. 8. 9. 10.

A continuacin se muestra el nuevo cdigo que aparece en el editor de cdigo. C# VB Copiar

11. 12. Private Sub clearButton_Click() Handles clearButton.Click 13. 14. End Sub 15. 16. Private Sub backgroundButton_Click() Handles backgroundButton.Click 17. 18. End Sub 19. 20. Private Sub closeButton_Click() Handles closeButton.Click 21. 22. End Sub 23. 24. Private Sub CheckBox1_CheckedChanged() Handles CheckBox1.CheckedChanged 25. 26. End Sub 27. 28.

Nota

Los cinco mtodos que ha agregado se denominan controladores de eventos, porque el programa los llama cada vez que se produce un evento (por ejemplo, cuando un usuario hace clic en un botn o activa una casilla). Al hacer doble clic en un control en el IDE, este agrega un mtodo de control de eventos para ese control. Por ejemplo, cuando se hace doble clic en un botn, el IDE agrega un controlador para este evento Click (al que se llamar cada vez que el usuario haga clic en el botn). Cuando se hace doble clic en una casilla, el IDE agrega un controlador para el evento CheckedChanged correspondiente (al que se llamar cada vez que el usuario active o desactive la casilla). Despus de agregar un controlador de eventos para un control, puede volver en cualquier momento a l desde el Diseador de Windows Forms haciendo doble clic en el control.

Nota
Los nombres son importantes al compilar programas. Los mtodos (incluso los controladores de eventos) pueden tener cualquier nombre que se desee. Al agregar un controlador de eventos con el IDE, este elige un nombre basado en el nombre del control y en el evento que se controla. Por ejemplo, el evento Click para un botn denominado showButton se denomina mtodo de control de eventos showButton_Click(). Adems, se suelen agregar parntesis de apertura y cierre () despus del nombre de mtodo para dejar claro que se trata de un mtodo.

Paso 7: Agregar componentes de dilogo al formulario


Visual Studio 2010 En preparacin para la configuracin de los cuadros de dilogo Abrir archivo y Color (para elegir un color de fondo), en este paso se agrega un componente OpenFileDialog y un componente ColorDialog al formulario. En algunos sentidos, un componente es como un control. Se utiliza el Cuadro de herramientas para agregar un componente al formulario y se establecen sus propiedades mediante la ventana Propiedades. Sin embargo, a diferencia de un control, al agregar un componente al formulario no se agrega un elemento visible que el usuario puede ver. En cambio, se proporcionan determinados comportamientos que se pueden desencadenar mediante cdigo. Un componente es lo que abre un cuadro de dilogo Abrir archivo.

Para agregar componentes de cuadro de dilogo al formulario


1. Vaya al Diseador de Windows Forms y abra el grupo Cuadros de dilogo en el Cuadro de herramientas.

Nota
El grupo Cuadros de dilogo del Cuadro de herramientas tiene componentes que abren automticamente muchos cuadros de dilogo de gran utilidad y que se pueden utilizar para abrir y guardar archivos, examinar carpetas y elegir fuentes o colores. En este proyecto se utilizan dos componentes de cuadro de dilogo: OpenFileDialog y ColorDialog.

2.

Para agregar un componente denominado a openFileDialog1 al formulario, haga doble clic en OpenFileDialog. Para agregar un componente denominado colorDialog1 al formulario, haga doble clic en ColorDialog en el Cuadro de herramientas. (Este se utiliza en el siguiente paso del tutorial.) Debera aparecer un cuadro gris en la parte inferior del Diseador de Windows Forms, con un icono para cada uno de los dos componentes de cuadro de dilogo agregados, como se muestra en la siguiente imagen. Componentes de cuadro de dilogo

3.

Vaya al Diseador de Windows Forms y haga clic en el icono openFileDialog1 en el cuadro gris de la parte inferior del diseador. Establezca dos propiedades: Establezca la propiedad Filter en lo siguiente (puede copiarlo y pegarlo): Archivos JPEG (*.jpg)|*.jpg|Archivos PNG (*.png)|*.png|Archivos BMP (*.bmp)|*.bmp|Todos los archivos (*.*)|*.* Establezca la propiedad Title en lo siguiente: Seleccionar un archivo de imagen

Nota
Para ver un ejemplo del cuadro de dilogo Abrir archivo en una aplicacin diferente, abra el Bloc de notas o Paint y haga clic en Abrir en el men Archivo. Observe que hay una lista desplegable de tipo de archivo en la parte inferior. Acabamos de utilizar la propiedad Filter del componente OpenFileDialog para configurarla. Observe tambin que las propiedades Title y Filter estn en negrita en la ventana Propiedades. El IDE lo hace para mostrarle todas las propiedades que han cambiado respecto de sus valores predeterminados.

Paso 8: Escribir cdigo para el controlador de eventos del botn Mostrar una imagen
Visual Studio 2010 En este paso, conseguiremos que botn Mostrar una imagen funciona as:

Cuando un usuario hace clic en ese botn, el programa abre un cuadro de dilogo Abrir archivo. Si un usuario elige un archivo de imagen, el programa muestra esa imagen en el control PictureBox.

El IDE incluye una eficaz herramienta denominada IntelliSense que ayuda a escribir cdigo. Cuando se escribe cdigo, el IDE abre un cuadro con sugerencias para completar las palabras parciales que se escriben. Intenta determinar lo que se desea hacer a continuacin y salta automticamente al ltimo elemento que se elige en la lista. Puede utilizar las flechas arriba o abajo para moverse por la lista o bien continuar escribiendo letras para reducir las opciones propuestas. Cuando vea la opcin que desea, presione la tecla TAB para seleccionarla. Otra opcin es pasar por alto las sugerencias, si no las necesita.

Para escribir cdigo para el controlador de eventos de botn Mostrar una imagen
1. Vaya al Diseador de Windows Forms y haga doble clic en el botn Mostrar una imagen. El IDE va inmediatamente al diseador de cdigo y mueve su cursor de modo para situarlo dentro del mtodo showButton_Click() que agreg previamente. Escriba una i en la lnea vaca entre las dos llaves { }. (En Visual Basic, escriba en la lnea vaca entre Private Sub y End Sub.) Se abre una ventana IntelliSense, como se muestra en la siguiente imagen. IntelliSense con cdigo de Visual C#

2.

3.

La ventana IntelliSense debe mostrar resaltada la palabra if. (De lo contrario, escriba una f minscula, y lo har.) Observe que la informacin sobre herramientas amarilla que se encuentra al lado de la ventana IntelliSense muestra Fragmento de cdigo para instruccin if. (En Visual Basic, la informacin sobre herramientas dice tambin que se trata de un fragmento de cdigo, pero con una redaccin ligeramente diferente.) Este es el fragmento de cdigo que vamos a utilizar. Presione la tecla TAB para insertar if en el cdigo. A continuacin, presione de nuevo la tecla TAB para utilizar el fragmento de cdigo if. (Si ha hecho clic en alguna otra parte y ha desaparecido la ventana IntelliSense, borre la i con la tecla de retroceso y vuelva a escribirla; se volver a abrir la ventana IntelliSense.)

Cdigo en Visual C#

4.

A continuacin, utilice IntelliSense para escribir ms cdigo y abrir un cuadro de dilogo Abrir archivo. Si el usuario ha hecho clic en el botn Aceptar, el control PictureBox cargar el archivo seleccionado por el usuario. En los siguientes pasos se muestra cmo escribir el cdigo. Aunque los pasos son muchos, solamente habr que presionar unas cuantas teclas: a. Comience con el texto seleccionado true del fragmento de cdigo. Escriba op para sobrescribirlo. (En Visual Basic, empieza con mayscula inicial, de modo que deber escribir Op.) b. Se abre la ventana IntelliSense y muestra openFileDialog1. Presione TAB para seleccionarlo. (En Visual Basic, empieza con mayscula inicial, de modo que aparecer OpenFileDialog1. Asegrese de que OpenFileDialog1 est seleccionado.) c. Escriba un punto (.) (En ingls se denomina period o dot.) Dado que escribi un punto justo despus de openFileDialog1, se abre una ventana IntelliSense, que contiene todas las propiedades y los mtodos de componente de OpenFileDialog. Se trata de las mismas propiedades que aparecen en la ventana Propiedades al hacer clic en este componente en el Diseador de Windows Forms. Hay tambin mtodos que pueden ordenar al componente que realice acciones (como abrir un cuadro de dilogo).

Nota
La ventana IntelliSense puede mostrar propiedades y mtodos. Para determinar lo que est mostrando, fjese en el icono de la izquierda. Se muestra una imagen de un bloque junto a cada mtodo y una imagen de una mano junto a cada propiedad. Adems, aparece un icono de rayo junto a cada evento. Estas imgenes se muestran como sigue.

d. e. f. g. h. i. j.

Icono de mtodo

Icono de propiedad

Icono de evento

Empiece a escribir ShowDialog (el uso de maysculas o minsculas no es significativo en IntelliSense). El mtodo ShowDialog() mostrar el cuadro de dilogo Abrir archivo. Cuando la ventana haya resaltado ShowDialog, presione la tecla TAB.

k.

Cuando se utiliza un mtodo con un control o un componente (lo que se denomina llamar a un mtodo), es preciso agregar parntesis. As pues, especifique los parntesis de apertura y cierre: ()

Nota
Los mtodos constituyen una parte importante de cualquier programa. En este tutorial se han mostrado varias maneras de utilizarlos. Se puede llamar al mtodo de un componente para ordenarle que haga algo, por ejemplo, como cuando llam al mtodo ShowDialog() del componente OpenFileDialog. Puede crear sus propios mtodos para que los programas realicen acciones, como el que estamos construyendo ahora que se denomina mtodo showButton_Click(), que abre un cuadro de dilogo y una imagen cuando un usuario hace clic en un botn.

l.

Para Visual C#, agregue un espacio y, a continuacin, agregue dos signos igual (==). Para Visual Basic, agregue un espacio y, a continuacin, utilice un solo signo igual (=). (Visual C# y Visual Basic utilizan distintos operadores de igualdad.) m. Agregue otro espacio. En cuanto haga, se abrir otra ventana IntelliSense. Empiece a escribir DialogResult y presione la tecla TAB para agregarlo.

Nota
Cuando se escribe cdigo para llamar a un mtodo, a veces devuelve un valor. En este caso, el mtodo ShowDialog() del componente OpenFileDialog devuelve un valor DialogResult. DialogResult es un valor especial que le indica lo que ha sucedido en un cuadro de dilogo. Un componente OpenFileDialog puede dar lugar a que el usuario haga clic en Aceptar o en Cancelar, de modo que el mtodo ShowDialog() devuelva DialogResult.OK o DialogResult.Cancel.

n.

Escriba un punto para abrir la ventana IntelliSense del valor DialogResult. Escriba la letra O y presione la tecla TAB para insertar OK.

Nota
Deber quedar completa la primera lnea de cdigo. Para Visual C#, debera ser la siguiente. if (openFileDialog1.ShowDialog() == DialogResult.OK) Para Visual Basic, debera ser la siguiente. If OpenFileDialog1.ShowDialog() = DialogResult.OK Then

o.

Ahora, agregue otra lnea de cdigo ms. Puede escribirla (o copiar y pegar), pero puede resultar interesante utilizar IntelliSense para agregarla. Cuanto ms se

familiarice con IntelliSense, ms rpidamente podr escribir su propio cdigo. El mtodo showButton_Click() final tendr el siguiente aspecto. C# VB Copiar

Private Sub showButton_Click() Handles showButton.Click

If OpenFileDialog1.ShowDialog() = DialogResult.OK Then PictureBox1.Load(OpenFileDialog1.FileName) End If

End Sub

Paso 9: Revisar, comentar y probar el cdigo


Visual Studio 2010 Antes de agregar un comentario al cdigo y probarlo, dedique un tiempo a revisar los conceptos del cdigo, porque los utilizar con frecuencia:

Cuando hizo doble clic en el botn Mostrar una imagen en el Diseador de Windows Forms, el IDE agreg automticamente un mtodo al cdigo del programa. Los mtodos permiten organizar el cdigo: son la manera de agrupar las partes del cdigo. Casi siempre, un mtodo realiza una cantidad reducida de acciones en un orden concreto; por ejemplo, el mtodo showButton_Click() muestra un cuadro de dilogo y, a continuacin, carga una imagen. Un mtodo se compone de instrucciones. Podemos considerar que un mtodo es una manera de empaquetar instrucciones juntas. Cuando se ejecuta un mtodo, o se le llama, se ejecutan las instrucciones que contiene en orden, una tras otra, empezando por la primera. A continuacin, se muestra un ejemplo de una instruccin. C# Copiar

pictureBox1.Load(openFileDialog1.FileName); pictureBox1.Load(openFileDialog1.FileName)

Las instrucciones son lo que permite que el programa haga cosas.En Visual C#, una instruccin finaliza siempre en un signo de punto y coma.En Visual Basic, el final de una lnea es el final de una instruccin.(No se necesita indicar el signo de punto y coma en Visual Basic.) La instruccin anterior ordena al control PictureBox que cargue el archivo que el usuario seleccion con el componente OpenFileDialog. A continuacin, se agrega un comentario al cdigo. Un comentario es una nota que no cambia la forma de comportarse del programa. Hace que resulte ms fcil entender qu hace el cdigo. En Visual C#, se utilizan dos barras diagonales (//) para marcar una lnea como comentario. En Visual Basic, se utiliza una comilla sencilla (') para marcar una lnea como comentario. Despus de agregar un comentario, se prueba el programa. Acaba de compilar algo que funciona y, aunque todava no est terminado, ya es capaz de cargar una imagen.

Para agregar comentarios


1. Agregue lo siguiente. C# VB Copiar

Private Sub showButton_Click() Handles showButton.Click

' Show the Open File dialog. If the user clicks OK, load the ' picture that the user chose. If OpenFileDialog1.ShowDialog() = DialogResult.OK Then PictureBox1.Load(OpenFileDialog1.FileName) End If

End Sub

Nota
El controlador de eventos Click del botn showButton ya est completado y funciona. Ha empezado a escribir cdigo, comenzando por una instruccin if. Una instruccin if es la manera de ordenar al programa: "Compruebe esto y, si se cumple, realice estas acciones". En este caso, se ordena al

programa que abra el cuadro de dilogo Abrir archivo y, si el usuario selecciona un archivo y hace clic en el botn Aceptar, ese archivo se carga en PictureBox.

Nota
El IDE se ha creado para facilitar la tarea de escribir cdigo. Los fragmentos de cdigo constituyen una manera de conseguirlo. Un fragmento de cdigo es un acceso directo que se expande para crear un bloque pequeo de cdigo. Puede ver todos los fragmentos de cdigo seleccionando Administrador de fragmentos de cdigo en el men Herramientas. El fragmento de cdigo if se encuentra en Modelos de cdigo, en la subcarpeta Condicionales y bucles. Este administrador se puede utilizar para examinar los fragmentos de cdigo existentes o agregar los suyos propios. Para activar un fragmento de cdigo al escribir cdigo, escrbalo y presione la tecla TAB. Muchos fragmentos de cdigo aparecen en la ventana IntelliSense, motivo por el cual la tecla TAB se presiona dos veces: la primera, para seleccionar el fragmento de cdigo en la ventana IntelliSense y, la segunda, para ordenar al IDE que lo utilice. (IntelliSense admite el fragmento de cdigo if, pero no el fragmento de cdigo ifelse.)

2.

Antes de ejecutar el programa, gurdelo haciendo clic en el botn de la barra de herramientas Guardar todo, que se muestra a continuacin. Botn Guardar todo

Como alternativa, puede hacer clic en Guardar todo en el men Archivo. El procedimiento recomendado consiste en guardar desde el principio y a menudo. Mientras se ejecuta, el programa debera parecerse a la siguiente imagen. Visor de imgenes

Para probar el programa


1. 2. Presione la tecla F5 o haga clic en el botn Iniciar depuracin de la barra de herramientas. Haga clic en el botn Mostrar una imagen para ejecutar el cdigo que acaba de escribir. Primero, el programa abre un cuadro de dilogo Abrir archivo. Compruebe que los filtros aparecen en la lista desplegable Tipo de archivo en la parte inferior del cuadro de dilogo. A continuacin, navegue hasta una imagen y brala. Normalmente, encontrar imgenes de ejemplo que se distribuyen con el sistema operativo Windows en la carpeta Mis documentos, dentro de la carpeta Mis imgenes\Sample Pictures. Cargue una imagen y esta aparecer en el control PictureBox. A continuacin, intente cambiar el tamao del formulario. Como el control PictureBox est acoplado dentro de un control TableLayoutPanel, que a su vez est acoplado en el formulario, el ancho del rea de imagen se ajustar al ancho del formulario y el alto ocupar el 90 por ciento superior del formulario. Por este motivo hemos utilizado los contenedores TableLayoutPanel y FlowLayoutPanel: mantienen el tamao del formulario correcto cuando el usuario lo modifica.

3.

Paso 10: Crear botones adicionales y una casilla


Visual Studio 2010 Ahora, est listo para completar los otros cuatro mtodos. Podra copiar y pegar este cdigo, pero si desea aprender lo mximo con este tutorial, escriba el cdigo y utilice IntelliSense.

Nota
El procedimiento recomendado es comentar siempre el cdigo. Los comentarios son informacin que leern otras personas y merece la pena dedicar tiempo a hacer que el cdigo resulte fcil de entender. El programa pasa por alto todo lo que hay en una lnea de comentario. En Visual C#, para marcar una lnea como comentario se escriben dos barras diagonales (//) al principio. En Visual Basic, se utiliza para ello una comilla sencilla (').

Para crear botones adicionales y una casilla

Agregue el cdigo siguiente: C# VB Copiar

Private Sub clearButton_Click() Handles clearButton.Click ' Clear the picture. PictureBox1.Image = Nothing End Sub

Private Sub backgroundButton_Click() Handles backgroundButton.Click ' Show the color dialog box. If the user clicks OK, change the ' PictureBox control's background to the color the user chose. If ColorDialog1.ShowDialog() = DialogResult.OK Then PictureBox1.BackColor = ColorDialog1.Color End If End Sub

Private Sub closeButton_Click() Handles closeButton.Click ' Close the form. Close() End Sub

Private Sub CheckBox1_CheckedChanged() Handles CheckBox1.CheckedChanged ' If the user selects the Stretch check box, change ' the PictureBox's SizeMode property to "Stretch". If the user ' clears the check box, change it to "Normal". If CheckBox1.Checked Then

PictureBox1.SizeMode = PictureBoxSizeMode.StretchImage Else PictureBox1.SizeMode = PictureBoxSizeMode.Normal End If End Sub

Paso 11: Ejecutar el programa y probar otras caractersticas


Visual Studio 2010 El programa est finalizado y listo para ejecutarse. Puede ejecutarlo y establecer el color de fondo. Para aprender ms, intente mejorar el programa cambiando el color del formulario, personalizando los botones y la casilla, y cambiando las propiedades del formulario.

Para ejecutar el programa y establecer el color de fondo


1. 2. Presione F5 o haga clic en el botn Iniciar depuracin de la barra de herramientas. Antes de abrir una imagen, haga clic en el botn Establecer el color de fondo. Se abrir el cuadro de dilogo Color. Cuadro de dilogo Color

3.

Seleccione un color para establecer el color de fondo de PictureBox. Fjese con atencin en el mtodo backgroundButton_Click() para entender cmo funciona.

Nota
Puede cargar una imagen de Internet pegando su direccin URL en el cuadro de dilogo Abrir archivo. Intente encontrar una imagen con un fondo transparente, para que se vea el color de fondo.

4.

Haga clic en el botn Borrar la imagen para asegurarse de que se borra. A continuacin, salga del programa haciendo clic en el botn Cerrar.

Para probar otras caractersticas



Cambie el color del formulario y de los botones mediante la propiedad BackColor. Personalice sus botones y la casilla mediante las propiedades Font y ForeColor. Cambie las propiedades FormBorderStyle y ControlBox del formulario. Utilice las propiedades AcceptButton y CancelButton del formulario para que se haga clic automticamente en los botones cuando el usuario presione las teclas ENTRAR o ESC. Haga que el programa abra el cuadro de dilogo Abrir archivo cuando el usuario presione ENTRAR y lo cierre cuando el usuario presione ESC.

Tutorial 2: Crear un laberinto


Visual Studio 2010 En este tutorial, se compila un juego de laberinto, donde el usuario tiene que mover el puntero del mouse desde la salida hasta la meta sin tocar ninguno de los muros. Aprender a:

Disear un formulario mediante un contenedor Panel. Construir un laberinto mediante controles Label. Escribir cdigo para mostrar un cuadro de mensaje. Configurar controladores de eventos para los eventos del mouse. Reproducir sonidos en el programa. Organizar el cdigo mediante clases.

As funcionar el laberinto: el puntero del mouse se sita al principio en la esquina superior izquierda del laberinto. El usuario navega por el laberinto, con cuidado de no tocar ninguno de los muros con el puntero. Si el puntero toca alguno de los muros, vuelve automticamente hasta la salida. Pero si el puntero llega a la etiqueta Meta al final del laberinto, aparece un mensaje de felicitacin y el juego finaliza. Cuando termine, el programa se parecer al de la ilustracin siguiente. Juego que crear en este tutorial

Nota
En este tutorial, se trata tanto Visual C# como Visual Basic, por lo que deber centrarse en la informacin especfica del lenguaje de programacin que use.

Ttulo
Paso 1: Crear un proyecto y agregar un panel al formulario Paso 2: Compilar el laberinto mediante etiquetas Paso 3: Finalizar el juego

Descripcin
Para empezar, cree el proyecto y agregue un contenedor Panel. Construya un laberinto agregando numerosos controles Label al formulario. Haga que el juego del laberinto finalice haciendo que funcione la etiqueta Meta.

Paso 4: Agregar un mtodo para reiniciar el juego Paso 5: Agregar un controlador de eventos MouseEnter para cada muro

Escriba su propio mtodo para reiniciar el juego del laberinto. Agregue un controlador de eventos para devolver el puntero del mouse del usuario a la salida si el puntero toca algn muro.

Paso 6: Agregar un SoundPlayer Paso 7: Agregar cdigo al formulario para reproducir sonidos

Empiece a agregar sonido al juego del laberinto. Llame a cada mtodo SoundPlayer's Play() a fin de reproducir el sonido en el momento adecuado.

Paso 8: Ejecutar el programa y probar otras caractersticas

Ejecute el programa y prubelo. Pruebe con otras caractersticas, como cambiar sonidos y colores.

Paso 1: Crear un proyecto y agregar un panel al formulario


Visual Studio 2010 El primer paso para crear un juego de laberinto es crear el proyecto y agregar un contenedor Panel al formulario.

Para crear un proyecto y agregar un contenedor Panel


1. 2. 3. 4. En el men Archivo, haga clic en Nuevo proyecto. Si no usa Visual Studio Express, primero debe seleccionar un lenguaje. En la lista Plantillas instaladas, seleccione C# o Visual Basic. Haga clic en el icono Aplicacin de Windows Forms y, a continuacin, escriba el nombre Laberinto. Establezca las propiedades del formulario. a. Cambie el tamao del formulario utilizando el puntero para arrastrar la esquina inferior derecha. Observe la esquina inferior derecha del entorno de desarrollo integrado (IDE). El tamao del formulario aparece en la barra de estado. Siga arrastrando hasta que el formulario tenga 650 pxeles de ancho y de alto. Puede construir un laberinto menor o mayor, as que puede crear el formulario con el tamao que desee. Tamao en la barra de estado

b. c. d.

Cuando el formulario tenga el tamao adecuado, establezca la propiedad Text en Laberinto. Para que el usuario no pueda cambiar el tamao del formulario, establezca la propiedad FormBorderStyle en Fixed3D. Deshabilite el botn Maximizar de la barra de ttulo del formulario estableciendo la propiedad MaximizeBox en False.

Ahora tiene un formulario de tamao fijo, que el usuario no puede maximizar.

Nota
Cuando se crea un formulario nuevo, de manera predeterminada est configurado de modo que el usuario pueda cambiar el tamao de dos maneras: el usuario puede arrastrar los lados o las esquinas del formulario, o hacer clic el botn Maximizar para maximizar el formulario. Para asegurarse de que un usuario no pueda cambiar el tamao del formulario, deshabilite estas dos opciones. Establecer la propiedad FormBorderStyle en cualquiera de los estilos fijos evita que el usuario cambie su tamao, pero todava hacer clic en el botn Maximizar. Por ello, tambin hay que deshabilitar la propiedad MaximizeBox.

Luego, es preciso crear la pista de juegos, donde se construir el laberinto. Para ello, utilice un control Panel. Un panel es un tipo de control contenedor que permite disponer un grupo de controles. A diferencia de algunos de los otros contenedores (como el contenedor TableLayoutPanel y el contenedor FlowLayoutPanel), un panel no reorganiza los controles

que contiene. Esto le ofrece libertad para colocar los controles donde desee, pero un panel no resulta til cuando el usuario cambia el tamao de la ventana (al contrario que con los controles TableLayoutPanel o FlowLayoutPanel). 5. Vaya al grupo Contenedores del Cuadro de herramientas y haga doble clic en Panel para agregar un panel al formulario. Cuando el panel est seleccionado, debera aparecer un icono de desplazamiento en su esquina superior izquierda, como se muestra a continuacin. Icono de desplazamiento

6.

Arrastre el panel hasta que se encuentre muy cerca de la esquina superior izquierda del formulario. Al arrastrarlo, observar una caracterstica muy til del IDE: en cuanto el panel se encuentre a una distancia determinada de la parte superior o del borde izquierdo del formulario, se coloca automticamente en su lugar y una lnea de separacin azul entre el borde del panel y el borde del formulario. Puede utilizar esto para alinear fcilmente el panel de modo que todos sus bordes estn exactamente a la misma distancia de los bordes del formulario. En cuanto vea las lneas de separacin azules superior e izquierda, suelte el botn del mouse para colocar el panel en su lugar. Las lneas de separacin aparecen como sigue. Lneas de separacin azules

Arrastre el controlador de arrastre inferior derecho hasta que el panel se coloque en su lugar respecto de los bordes derecho e inferior. 7. 8. Como desea que el usuario vea el permetro del laberinto, es preciso que tenga un borde visible. Seleccione el panel y establezca su propiedad BorderStyle en Fixed3D. Guarde el proyecto haciendo clic en el botn Guardar todo de la barra de herramientas, que se muestra a continuacin. Botn Guardar todo

9.

Para ejecutar el programa, presione F5 o haga clic en el botn de Iniciar depuracin de la barra de herramientas, que se muestra a continuacin.

Botn de la barra de herramientas Iniciar depuracin

Al ejecutarse, el formulario se debera parecer la siguiente imagen. Formulario de laberinto inicial

10. Antes de seguir al prximo paso del tutorial, detenga el programa cerrando el formulario o haciendo clic en el botn Detener depuracin de la barra de herramientas Depuracin. (Mientras el programa est en ejecucin, el IDE permanece en modo de solo lectura.)

Paso 2: Compilar el laberinto mediante etiquetas


Visual Studio 2010 Ahora es el momento de construir el laberinto. Para construir el laberinto, se agregan muchos controles Label al formulario. Normalmente, una etiqueta se utiliza para mostrar texto. Sin embargo, en este proyecto las utilizaremos para dibujar rectngulos coloreados en el formulario, que sern los muros del laberinto.

Para construir el laberinto mediante etiquetas


1. 2. En el Diseador de Windows Forms, vaya al grupo Controles comunes en el Cuadro de herramientas y haga doble clic en Label para que el IDE agregue una etiqueta al formulario. Establezca varias propiedades para que la etiqueta se convierta en un rectngulo, cuyo tamao pueda modificar: Establezca la propiedad AutoSize en False. Establezca la propiedad BackColor en cualquier color que le guste. (Para este tutorial, se ha seleccionado RoyalBlue en la pestaa Color web). Cambie la propiedad Text para que est vaca, seleccionando el texto label1 y eliminndolo. Etiqueta convertida en un rectngulo relleno

El control Label debera ser ahora un rectngulo relleno.

Nota
Esto puede parecer inusual porque un control Label est diseado para utilizarse como una etiqueta. En este caso, utilizamos la etiqueta como bloque de dibujo, porque funciona. Una parte importante de la programacin consiste en reconocer cundo una herramienta del cuadro de herramientas (o, en este caso, del Cuadro de herramientas del IDE) funciona para la tarea que se desea realizar, aunque no se haya diseado originalmente para ello.

3.

4.

Ahora, puede ser creativo al construir el laberinto. Para copiar la etiqueta, seleccinela y haga clic en Copiar en el men Edicin (o presione Ctrl+C). A continuacin, pguela varias veces. Seleccione Pegar en el men Edicin (o presione Ctrl+V). As deberan crearse los muros horizontales del laberinto. Tome uno de los muros y arrstrelo para que quede alto y estrecho. Cpielo y pguelo varias veces para crear los muros verticales. Arrastre las etiquetas por el panel y cree el laberinto. No deje demasiado estrechos los pasadizos, pues resultara demasiado difcil jugar. Deja espacio adicional en la esquina superior izquierda, porque es donde el jugador empieza a recorrer el laberinto.

Nota
Como recordar, el tamao del formulario aparece en la barra de estado del IDE al cambiar su tamao. El IDE hace lo mismo al cambiar el tamao de las etiquetas o de cualquier otro control. Si lo desea, puede utilizar esta caracterstica para asegurarse de que todos los muros del laberinto tienen el mismo ancho. Las barras de alineacin del IDE que utiliz para colocar el panel tambin resultan tiles para colocar los muros del laberinto. Tambin puede utilizar las teclas de direccin del teclado para ajustar con precisin la posicin del control que est seleccionado actualmente. En la siguiente imagen se muestra el tamao en la barra de estado.

5.

Tamao en la barra de estado

6.

7.

8. 9.

Despus de disear el laberinto, vaya al grupo Controles comunes del Cuadro de herramientas y haga doble clic en Label una vez ms. Utilice la lnea (Name) de la ventana Propiedades para denominarla finishLabel y cambie su propiedad Text a Meta. Arrastre la nueva etiqueta Meta al final del laberinto. Este es el objetivo que usuario debe alcanzar. Cierre el proyecto y ejecute el programa de nuevo. A continuacin se muestra un ejemplo de un formulario de laberinto finalizado. (Su laberinto tendr un aspecto diferente.) Formulario de laberinto finalizado

Paso 3: Finalizar el juego


Visual Studio 2010

Para que el juego finalice, hay que hacer que funcione la etiqueta Meta. Para ello, se agrega un controlador de eventos para el evento MouseEnter de la etiqueta.

Nota
Si ha completado el tutorial 1: Crear un visor de imagen, ya sabe qu son los controladores de eventos. La mayora de los controles tienen muchos eventos diferentes que pueden generar. En el visor de imagen se utilizan el evento Click del control Button y el evento CheckChanged del control CheckBox. En este tutorial, se utiliza el evento MouseEnter del control Label, que se genera cada vez que el puntero del mouse entra en el control. El control Label tiene ms de cuatro docenas de eventos. La mayora de ellos tiene nombres intuitivos, como DoubleClick, Resize y TextChanged. Ms adelante en este tutorial se proporciona una lista de nombres de evento.

Para finalizar el juego


1. Seleccione el control finishLabel y, a continuacin, haga clic en el icono Evento en la parte superior de la ventana Propiedades, que representa un rayo. Al hacer clic en l, aparecen los eventos del control en lugar de sus propiedades. Puede volver a la lista de propiedades haciendo clic en el icono de propiedad. Por ahora, mantenga la ventana Propiedades como est, de modo que muestre todos los eventos del control finishLabel. Desplcese hacia abajo hasta el evento MouseEnter. Los iconos y el evento MouseEnter aparecen como sigue. Icono de evento

Icono de propiedad

Evento MouseEnter

2.

Haga doble clic en el palabra MouseEnter. Despus de hacerlo, el IDE agrega automticamente un mtodo de control de eventos al formulario y muestra el editor de cdigo, como sigue. C# VB Copiar

Private Sub finishLabel_MouseEnter() Handles finishLabel.MouseEnter

End Sub

Este mtodo de control de eventos se ejecuta cada vez que el puntero del mouse entra en la etiqueta. 3. Queremos que el programa abra un cuadro de mensaje que felicite al usuario y que, a continuacin, se cierre el programa. Para ello, se agregan lneas de cdigo (con un comentario), como sigue. C# VB

Copiar

Private Sub finishLabel_MouseEnter() Handles finishLabel.MouseEnter

' Show a congratulatory MessageBox, then close the form. MessageBox.Show("Congratulations!") Close() End Sub

Nota
El mtodo finishLabel_MouseEnter() tiene dos instrucciones. La primera instruccin consiste en llamar a un mtodo denominado Show(), que abre un cuadro de mensaje que contiene cualquier texto que haya escrito entre los parntesis.

4.

Puede obtener ms informacin sobre lo que sucede utilizando el IDE para explorar el cdigo. Coloque el puntero del mouse de modo que se encuentre encima de la palabra MessageBox. Debera aparecer la siguiente informacin sobre herramientas. Tooltip

Nota
El IDE muestra que hay una clase denominada System.Windows.Forms.MessageBox, y que el mtodo Show() al que ha llamado se encuentra dentro de esa clase. No se requieren conocimientos completos para que el cuadro de mensaje funcione, pero la informacin adicional puede resultar til. Con respecto a la segunda instruccin, cada formulario tiene un mtodo integrado denominado Close() que hace que el formulario se cierre. Algunos programas tienen varias ventanas entre las que el usuario puede alternar. Cuando se trabaja en un programa de ese tipo, este cierra la ventana activa pero en ejecucin el resto del programa. (Por ejemplo, si tiene varios documentos de Microsoft Office Word abiertos al mismo tiempo, al cerrar una ventana de documento se cierra ese

documento, pero Office Word permanece abierto.) Sin embargo, en un programa como este, donde hay una sola ventana, al cerrarla se deja de ejecutar el programa; por consiguiente, al cerrar el formulario, se cierra el programa.

5.

Guarde y ejecute el programa. Mueva el puntero del mouse sobre la etiqueta Meta. Debera abrir el mensaje y, a continuacin, cerrar el programa.

Paso 4: Agregar un mtodo para reiniciar el juego


Visual Studio 2010 Hemos visto cmo el IDE puede agregar automticamente un mtodo de control de eventos al programa. Tambin se pueden escribir mtodos y agregarlos al cdigo. Muchos programadores dedican gran parte de su tiempo a agregar sus propios mtodos.

Nota
Escribir sus propios mtodos es til cuando hay un conjunto de instrucciones que se tienen que ejecutar muchas veces, en lugares diferentes. Esto sucede con frecuencia cuando se escriben programas. Por ejemplo, para crear este programa de laberinto, queremos que el programa site automticamente el puntero del mouse en la esquina superior izquierda del panel cada vez que se inicie. Cuando el usuario mueve el puntero y toca un muro, el programa tiene que volver a colocar el puntero en la salida. Cuando el usuario saca el puntero de la pista de juegos y vuelve a situarlo en ella, el programa tiene que volver a colocar el puntero en la salida. El puntero se puede colocar en la salida con tres lneas de cdigo. Pero ahorraremos tiempo si evitamos escribir esas mismas tres lneas de cdigo en distintos lugares del programa. Si colocamos esas tres lneas de cdigo en un mtodo (por ejemplo, un mtodo denominado MoveToStart()) solo tendremos que escribirlas una vez. A continuacin, bastar con llamar al mtodo MoveToStart() cada vez que haya que devolver el puntero a la esquina superior izquierda del panel.

Para agregar un mtodo para reiniciar el juego


1. 2. Vaya al cdigo de formulario. Para ello, haga clic con el botn secundario en Form1.cs en el Explorador de soluciones y seleccione Ver cdigo en el men. Deber aparecer el mtodo finishLabel_MouseEnter() que agreg. Justo debajo de ese mtodo, agregue un nuevo mtodo MoveToStart(). C# VB

Copiar

Private Sub MoveToStart() Dim startingPoint = Panel1.Location startingPoint.Offset(10, 10) Cursor.Position = PointToScreen(startingPoint) End Sub

3.

Hay un tipo especial de comentario que puede agregar encima de cualquier mtodo, y el IDE puede ayudarle a agregarlo. Site el cursor en la lnea que est encima del nuevo mtodo. En Visual C#, agregue tres marcas de barra diagonal (///). En Visual Basic, agregue tres comillas sencillas ('''). El IDE incluye automticamente el siguiente texto. C# VB Copiar

''' <summary> ''' ''' </summary> ''' <remarks></remarks> Private Sub MoveToStart() Dim startingPoint = Panel1.Location startingPoint.Offset(10, 10) Cursor.Position = PointToScreen(startingPoint) End Sub

4.

En la lnea situada entre las dos etiquetas summary, escriba el siguiente comentario. (Despus de presionar ENTRAR, el IDE agrega automticamente una nueva lnea con tres

marcas de barra diagonal (///) o tres comillas sencillas ('''), dependiendo del lenguaje de programacin, de modo que pueda continuar su comentario.) C# VB Copiar

''' <summary> ''' Move the pointer to a point 10 pixels down and to the right ''' of the starting point in the upper-left corner of the maze. ''' </summary>

Nota
Acaba de agregar un comentario XML. Como recordar, el IDE le ha mostrado informacin en una informacin sobre herramientas al detener el cursor sobre la palabra MessageBox. El IDE rellena automticamente la informacin sobre herramientas de los mtodos. Cualquier cosa que escriba en un comentario XML aparecer en la informacin sobre herramientas del IDE, as como en la ventana IntelliSense. Cuando un programa tiene muchos mtodos, puede resultar de gran utilidad. Adems, si coloca un muro a 10 pxeles de distancia de los bordes superior e izquierdo de la esquina superior izquierda del panel, puede cambiar (10, 10) en el cdigo. Experimente con distintos nmeros hasta que encuentre una salida para el puntero que sea adecuada para el laberinto.

5.

Despus de agregar el mtodo, hay que llamarlo. Dado que queremos que el programa mueva el puntero a la salida en cuanto el programa se inicie, se debe llamar al mtodo tan pronto como se inicia el formulario. Para Visual C#, busque el siguiente mtodo en el cdigo del formulario. C# Copiar

public Form1() { InitializeComponent();

Para Visual Basic, agregue este mtodo al cdigo del formulario. Antes del mtodo finishLabel_MouseEnter, escriba el siguiente cdigo. VB Copiar

Public Sub New()

Al presionar la tecla ENTRAR para pasar a la lnea siguiente, IntelliSense debera hacer que apareciese el siguiente cdigo para completar el mtodo. VB Copiar

Public Sub New() ' This call is required by Windows Forms Designer. InitializeComponent() ' Add any initialization after the InitializeComponent() call. End Sub

Se trata de un mtodo especial denominado constructor. Se ejecuta una vez, al crear el formulario. En este momento, lo nico que hace es llamar al mtodo InitializeComponent(). Vamos a agregarle una lnea para llamar al nuevo mtodo MoveToStart() que acaba de escribir. Antes de continuar, piense qu se debe agregar al programa para que llame al mtodo MoveToStart() inmediatamente despus de llamar al mtodo InitializeComponent().

Nota

El mtodo InitializeComponent() del constructor del formulario es un mtodo escrito por el IDE. Agrega todos los controles y componentes al formulario y configura sus propiedades. Cada vez que se cambia cualquiera de las propiedades del formulario o sus controles, el IDE modifica ese mtodo. Puede examinarlo abriendo el archivo Form1.Designer.cs en el Explorador de soluciones. No es preciso editar el contenido del mtodo InitializeComponent(). El IDE se encarga de ello basndose en el formulario que ha creado en la Vista de diseo.

6.

Agregue una llamada al mtodo MoveToStart() inmediatamente despus de que llame al mtodo InitializeComponent(). El cdigo del formulario debe ser como el siguiente. C# VB Copiar

Public Class Form1

Public Sub New() ' This call is required by Windows Forms Designer. InitializeComponent() ' Add any initialization after the InitializeComponent() call. MoveToStart() End Sub

Private Sub finishLabel_MouseEnter() Handles finishLabel.MouseEnter ' Show a congratulatory MessageBox, then close the form. MessageBox.Show("Congratulations!") Close() End Sub

''' <summary> ''' Move the mouse pointer to a point 10 pixels down and to the right

''' of the starting point in the upper-left corner of the maze. ''' </summary> ''' <remarks></remarks> Private Sub MoveToStart() Dim startingPoint = Panel1.Location startingPoint.Offset(10, 10) Cursor.Position = PointToScreen(startingPoint) End Sub

End Class

Fjese en la llamada al mtodo MoveToStart() que aparece debajo de InitializeComponent(). Si est programando en Visual C#, recuerde finalizar esa lnea con un signo de punto y coma (;); de lo contrario, el programa no se compilar. 7. Ahora, guarde el programa y ejectelo. En cuanto el programa se inicie, el puntero debera situarse automticamente ligeramente por debajo y a la derecha de la esquina superior izquierda del panel.

Paso 5: Agregar un controlador de eventos MouseEnter para cada muro


Visual Studio 2010 El juego del laberinto sera ms divertido y supondra un reto mayor si enviase el puntero del mouse del usuario al principio cada vez que tocase un muro. Antes de seguir leyendo, piense en cmo lo hara.

Para agregar un controlador de eventos MouseEnter para cada muro


1. 2. Vaya al Diseador de Windows Forms y haga clic en cualquiera de los muros recin agregados. Vaya a la ventana Propiedades y haga clic en el icono Evento para mostrar los eventos de ese muro. Desplcese hacia abajo hasta el evento MouseEnter. En lugar de hacer doble clic en l, escriba el texto wall_MouseEnter y, a continuacin, presione ENTRAR. El icono Evento y la ventana Propiedades aparecen con el siguiente aspecto. Icono de evento

Ventana Propiedades con el evento MouseEnter

Nota
Al escribir directamente el nombre de evento en la tabla de eventos en la ventana Propiedades, se le ordena al IDE que cree un controlador de eventos con ese nombre y lo conecte al evento del control. A menudo, es preferible que el IDE elija los nombres de los eventos, porque los nombres son lgicos y el uso de nombres facilita a los dems la lectura y comprensin de su cdigo. Cuando el IDE elige un nombre para un controlador de eventos, utiliza el nombre del control y el nombre del evento. En este caso, no hemos modificado los nombres predeterminados de los muros, que son label4, label18, label25, etc. As pues, al hacer clic en un muro denominado label12, el IDE habra dado al controlador de eventos el nombre label12_MouseEnter. Al escribir el nombre wall_MouseEnter, estamos eligiendo un nombre ms aplicable. Esto resulta especialmente importante cuando se utiliza un mismo controlador de eventos para varios controles, que es lo que haremos ms adelante en este tutorial.

3.

Despus de presionar ENTRAR, el IDE agrega un nuevo controlador de eventos y lo conecta al evento MouseEnter de ese muro. El cdigo recin agregado debera aparecer en el editor de cdigo como sigue. En Visual Basic, puede que la etiqueta concreta no sea Label8, como se muestra en el cdigo. C# VB

Copiar

Private Sub wall_MouseEnter() Handles Label8.MouseEnter

End Sub

4.

A continuacin, agregue una llamada a su mtodo MoveToStart(), junto con un comentario que lo explique. Para empezar, vaya al mtodo y agregue la instruccin MoveToStart(). Se abre una ventana IntelliSense y aparece lo siguiente. Ventana IntelliSense

Cuando agregamos, antes, el mtodo MoveToStart(), el IDE lo agreg a la ventana IntelliSense. El comentario XML que agregamos aparece en la informacin sobre herramientas. Esto resulta til cuando se escriben programas con gran cantidad de mtodos. 5. Presione la tecla TAB para ordenar a IntelliSense que complete el nombre del mtodo. Si est escribiendo el cdigo en Visual C#, recuerde agregar el signo de punto y coma (;) al final de la instruccin. A continuacin, agregue un comentario encima de la instruccin. El cdigo debe tener un aspecto parecido al siguiente. En Visual Basic, puede que la etiqueta concreta no sea Label8, como se muestra en el cdigo. C# VB

Copiar

Private Sub wall_MouseEnter() Handles Label8.MouseEnter ' When the mouse pointer hits a wall or enters the panel, ' call the MoveToStart() method. MoveToStart() End Sub

6.

Guarde y ejecute el programa. Mueva el puntero del mouse por encima del muro al que ha conectado el controlador de eventos. (Si no recuerda cul eligi, mueva el puntero del mouse sobre cada muro hasta que encuentre el apropiado.) En cuanto lo toque, debera devolver el puntero del mouse al principio. Luego, hay que hacer lo mismo para el resto de los muros. Puede escribir el mismo controlador de eventos MouseEnter para cada uno de ellos. Sin embargo, sera un proceso largo, que dara lugar a varias lneas del mismo cdigo en el programa y sera difcil de cambiar. El IDE proporciona una manera ms fcil de conectar el mismo controlador de eventos a todos los muros.

7. 8. 9.

Vaya al Diseador de Windows Forms y haga clic en Seleccionar todo en el men Edicin. Mantenga presionada la tecla CTRL y, a continuacin, haga clic en la etiqueta Finish para borrar la seleccin. Deberan quedar seleccionados todos los muros y el panel. Ahora, vaya a la tabla de eventos de la ventana Propiedades. Desplcese hacia abajo hasta el evento MouseEnter y haga clic en el cuadro de edicin situado a su lado. Debera ver una flecha de lista desplegable. Al hacer clic en la flecha, aparece una lista de todos los controladores de eventos del programa que puede elegir para este evento. En este caso, debera aparecer el controlador de eventos finishLabel_MouseEnter que agreg anteriormente, as como el controlador wall_MouseEnter que acaba de escribir, como se muestra en la siguiente imagen. Evento MouseEnter con controladores de eventos

10. Seleccione wall_MouseEnter. (Si selecciona el controlador de eventos equivocado o agrega uno nuevo accidentalmente, puede seleccionar todos los muros y el panel otra vez y, a continuacin, elegir el mtodo correcto.) 11. Ahora, el juego del laberinto debera resultar ms divertido. Pruebe a guardarlo y ejecutarlo. Si su puntero toca un muro o usted lo saca del laberinto y vuelve a entrar en l, el programa debera cambiar de posicin automticamente el puntero y situarlo al principio del laberinto.

Paso 6: Agregar un SoundPlayer


Visual Studio 2010 A continuacin, vamos a agregar sonido al juego del laberinto. Debe sonar un sonido cuando el usuario toque un muro y el programa lo enve de regreso a la salida, y otro sonido distinto cuando el usuario gane. En este paso, agregar el sonido que sonar cuando el puntero del mouse toque un muro. Aunque puede parecer complicado, solo se necesitan unas lneas de cdigo.

Para agregar un SoundPlayer que haga ruido


1. Para empezar, agregue un control SoundPlayer al cdigo del formulario, justo antes del constructor. C# VB Copiar

Public Class Form1

' This SoundPlayer plays a sound whenever the player hits a wall. Dim startSoundPlayer = New System.Media.SoundPlayer("C:\Windows\Media\chord.wav")

Public Sub New() ' This call is required by Windows Forms Designer. InitializeComponent() ' Add any initialization after the InitializeComponent() call. MoveToStart() End Sub

Nota
La primera lnea (public partial class Form1 : Form) ha aparecido ya varias veces. Es importante, porque incluye la palabra clave de clase. La palabra clave de clase aparece muchas veces, porque una clase es un bloque de creacin bsico de cualquier programa.

2.

Anteriormente, ha situado el puntero del mouse sobre la palabra MessageBox de la instruccin MessageBox.Show("Congratulations!");, para que el IDE abriese una informacin sobre herramientas. Hgalo de nuevo, pero fjese con ms atencin en la primera lnea, que se muestra a continuacin. Tooltip

Nota
La palabra clave de clase aparece en la primera lnea. Aparece con frecuencia porque el cdigo est organizado en clases, como sigue: el programa tiene clases, cada clase tiene mtodos y cada mtodo tiene instrucciones. Hay numerosas clases integradas, como MessageBox. La clase MessageBox tiene un mtodo denominado Show(). Cuando se le llama, ejecuta instrucciones que abren un cuadro de mensaje. Tambin ha trabajado con las clases Button, Panel y Label. Al establecer sus

propiedades, trabaj con otro aspecto de las clases: una clase puede tener propiedades adems de mtodos. Al establecer esas propiedades, podemos hacer que la clase ejecute instrucciones que cambian el comportamiento.

Como habr supuesto, SoundPlayer es una clase que reproduce un sonido. Al crear un SoundPlayer con la palabra clave new, este carga un sonido de un archivo, que puede reproducir mediante su mtodo Play(). Vamos a utilizar este SoundPlayer para reproducir el sonido Chord de Windows cuando el jugador inicie un nuevo juego, o cuando el puntero toque un muro y el jugador tenga que volver a empezar. (Por eso se denomina startSoundPlayer.) 3. Si desea utilizar otros sonidos diferentes, reemplace la ruta de acceso que figura entre las comillas de la nueva instruccin (C:\Windows\Media\chord.wav) por la ruta de acceso del archivo de sonido que desea utilizar. Al compilar un formulario en el Diseador de Windows Forms, utiliza el IDE para ayudarle a crear su propia clase, en este caso, una clase denominada Form1. Cuando agreg esa lnea de cdigo encima del constructor, agreg un nuevo SoundPlayer al formulario, exactamente igual que antes haba agregado un botn o una etiqueta. La instruccin se encuentra fuera de los mtodos, para que ms de un mtodo pueda tener acceso al SoundPlayer. Por ese motivo, ha tenido que colocar la nueva instruccin dentro del cdigo del formulario pero fuera de sus mtodos. Lo hemos denominado startSoundPlayer, de la misma manera que hemos denominado finishLabel uno de los controles Label. Despus de agregar la instruccin para crear un nuevo SoundPlayer y denominarlo startSoundPlayer, aparece en la ventana IntelliSense, exactamente igual que las etiquetas, los botones y otros controles. Puede que parezca complicado, pero es similar a lo que hemos hecho previamente en el IDE. Por ejemplo, cuando utilizamos el Cuadro de herramientas del IDE para agregar un botn o una etiqueta al formulario, el IDE agrega automticamente lneas de cdigo que se utilizan para crear un nuevo botn o una nueva etiqueta. Ahora har lo mismo, salvo que esta vez crear un SoundPlayer. (El segundo SoundPlayer se crea en el paso siguiente del tutorial.)

Paso 7: Agregar cdigo al formulario para reproducir sonidos


Visual Studio 2010 Ahora, est listo para agregar un segundo SoundPlayer y, a continuacin, agregar un mtodo para llamar a cada uno de ellos.

Para reproducir sonidos


1. Para empezar, agregue un segundo SoundPlayer para reproducir el sonido Tada de Windows. Su juego reproducir este sonido cuando el jugador alcance la etiqueta Meta. C# VB

Copiar

Public Class Form1

' This SoundPlayer plays a sound whenever the player hits a wall. Dim startSoundPlayer = New System.Media.SoundPlayer("C:\Windows\Media\chord.wav")

' This SoundPlayer plays a sound when the player finishes the game. Dim finishSoundPlayer = New System.Media.SoundPlayer("C:\Windows\Media\tada.wav")

Public Sub New() ' This call is required by Windows Forms Designer. InitializeComponent() ' Add any initialization after the InitializeComponent() call. MoveToStart() End Sub

2.

Ahora, los dos elementos SoundPlayer se han agregado al formulario. Agregue un mtodo Play() para llamar a SoundPlayer y reproducir el sonido en el momento adecuado. El sonido debe reproducirse cuando el usuario toque un muro. As pues, agregue la instruccin startSoundPlayer.Play(); al mtodo MoveToStart(). Recuerde actualizar el comentario. El mtodo final tendr el siguiente aspecto. C# VB Copiar

''' <summary>

''' Play a sound, then move the mouse pointer to a point 10 pixels down and to ''' the right of the starting point in the upper-left corner of the maze. ''' </summary> ''' <remarks></remarks> Private Sub MoveToStart() startSoundPlayer.Play() Dim startingPoint = Panel1.Location startingPoint.Offset(10, 10) Cursor.Position = PointToScreen(startingPoint) End Sub

3.

Agregue la instruccin finishSoundPlayer.Play(); al controlador de eventos MouseEnter de la etiqueta Meta. Recuerde actualizar el comentario, porque va a cambiar el cdigo, como sigue. C# VB Copiar

Private Sub finishLabel_MouseEnter() Handles finishLabel.MouseEnter ' Play a sound, show a congratulatory MessageBox, then close the form. finishSoundPlayer.Play() MessageBox.Show("Congratulations!") Close() End Sub

Paso 8: Ejecutar el programa y probar otras caractersticas


Visual Studio 2010 El programa est finalizado y listo para ejecutarse. Lo puede ejecutar y probar. Para aprender ms, intente cambiar los colores y sonidos.

Para ejecutar el programa


1. 2. 3. 4. Guarde el programa y, a continuacin, incielo. Asegrese de que el puntero del mouse est situado al principio del laberinto. Mueva el puntero del mouse por todo el laberinto. Toque un muro y asegrese de que suena un sonido y el puntero se enva de regreso a la salida. Saque el puntero del mouse del laberinto. A continuacin, vuelva a colocarlo en el panel y compruebe que el programa lo enva de nuevo a la salida.

Nota
Al realizar las pruebas, hay que asegurarse de que todos los elementos del programa funcionan. Es preciso estar seguro de que el controlador de eventos MouseEnter de la etiqueta Meta reproduce el sonido Tada, abre un cuadro de mensaje de felicitacin y cierra el juego. Para no tener que recorrer todo el laberinto, puede desactivar temporalmente el controlador de eventos MouseEnter del panel. De ese modo, podr sacar el puntero del mouse del laberinto y colocarlo en la etiqueta Meta sin que el programa devuelva el cursor a la salida.

5. 6.

7.

Seleccione el panel y, a continuacin, vaya a la tabla de eventos de la ventana Propiedades. Desplcese hacia abajo hasta el evento MouseEnter y seleccione su nombre. Presione SUPR para eliminar el nombre de controlador de eventos y, a continuacin, presione ENTRAR. El IDE desconecta automticamente el controlador de eventos del panel. Los muros siguen estando conectados, pero ahora puede sacar el mouse del laberinto para llegar a la etiqueta Meta situada en la parte inferior. Guarde y ejecute el programa, y asegrese de que la etiqueta Meta reproduce el sonido, muestra el cuadro de mensaje y cierra el juego. Cuando est seguro de que todo funciona, habilite el controlador de eventos MouseEnter del panel; para ello, seleccinelo, vaya a la tabla de eventos de la ventana Propiedades, desplcese hacia abajo hasta la lnea MouseEnter y seleccione wall_MouseEnter en la lista desplegable.

Para probar otras caractersticas



Reemplace los sonidos del juego por sonidos que le gusten ms. Configrelo de modo que el juego reproduzca un sonido nicamente cuando el puntero del mouse toque un muro, pero no cuando se inicie el programa. En lugar de cerrar el programa cuando el jugador gane, haga que el puntero regrese a la salida. Cambie algunos de los colores de los muros y haga que el juego reproduzca sonidos distintos segn el color de los muros.

Tutorial 3: Crear una prueba matemtica


Visual Studio 2010 En este tutorial, se compila un juego de prueba matemtica en que el jugador debe responder a cuatro problemas aritmticos aleatorios en un tiempo especificado. Aprender a:

Generar nmeros aleatorios mediante la clase Random. Desencadenar eventos mediante un control Timer. Controlar el flujo del programa mediante instrucciones if else. Realizar operaciones aritmticas bsicas.

Cuando termine, el programa se parecer al de la ilustracin siguiente. Juego que crear en este tutorial

Nota
En este tutorial, se trata tanto Visual C# como Visual Basic, por lo que deber centrarse en la informacin especfica del lenguaje de programacin que use.

Temas relacionados
Ttulo
Paso 1: Crear un proyecto y agregar etiquetas al formulario

Descripcin
Comience por crear el proyecto, cambiar las propiedades y agregar controles Label. Cree un problema de suma que genera nmeros aleatorios mediante la clase Random. Agregue un temporizador de cuenta atrs para poder limitar el tiempo de la prueba.

Paso 2: Crear un problema de suma aleatoria

Paso 3: Agregar un temporizador de cuenta atrs

Paso 4: Agregar el mtodo CheckTheAnswer()

Agregue un mtodo para comprobar si las respuestas son correctas.

Paso 5: Agregar controladores de eventos Agregue controladores de eventos para facilitar el uso del Enter para los controles programa. NumericUpDown Paso 6: Agregar un problema de resta Agregue un problema de resta que genere nmeros aleatorios. Compruebe que las respuestas son correctas y utilice el temporizador. Paso 7: Agregar problemas de multiplicacin y divisin Agregue problemas de multiplicacin y divisin que generan nmeros aleatorios. Compruebe que las respuestas son correctas y utilice el temporizador. Paso 8: Probar otras caractersticas Pruebe con otras caractersticas, como cambiar colores y agregar sugerencias.

Paso 1: Crear un proyecto y agregar etiquetas al formulario


Visual Studio 2010 El primer paso para crear una prueba matemtica es crear el proyecto y agregar etiquetas al formulario.

Para crear un proyecto y agregar etiquetas al formulario


1. 2. 3. 4. En el men Archivo, haga clic en Nuevo proyecto. Si no usa Visual Studio Express, primero debe seleccionar un lenguaje. En la lista Plantillas instaladas, seleccione C# o Visual Basic. Haga clic en el icono Aplicacin de Windows Forms y, a continuacin, escriba el nombre Prueba matemtica. Establezca las propiedades del formulario. a. Cambie la propiedad Text del formulario a Prueba matemtica. b. Cambie el tamao a 500 pxeles de ancho por 400 pxeles de alto mediante la propiedad Size o arrastre el mouse hasta que vea el tamao correcto en la esquina inferior izquierda del entorno de desarrollo integrado (IDE). c. Para evitar que los usuarios cambien el tamao del formulario, cambie la propiedad FormBorderStyle a Fixed3D y establezca la propiedad MaximizeBox en False. Arrastre un control Label desde el cuadro de herramientas y, a continuacin, establezca sus propiedades:

5.

a.

b. c. d. e. f. g.

Cambie la propiedad (Name) propiedad a timeLabel. Esta etiqueta aparece como un cuadro en la esquina superior derecha del formulario, que muestra la cuenta atrs en segundos de la prueba. Cambie la propiedad AutoSize a False para poder modificar personalmente las dimensiones del cuadro. Cambie la propiedad BorderStyle a FixedSingle para dibujar una lnea alrededor del cuadro. Establezca la propiedad Size en 200, 30. Arrastre la etiqueta hacia la esquina superior derecha del formulario hasta que aparezcan las lneas azules de separacin. Borre la propiedad Text haciendo clic en Text en la ventana Propiedades y presionando la tecla RETROCESO. Cambie el tamao de fuente a 15,75. Haga clic en el signo ms que aparece junto a la propiedad Font en la ventana Propiedades, que muestra varias propiedades, incluida la propiedad Size, como se muestra en la siguiente imagen. Ventana Propiedades con el tamao de fuente

6.

7.

8.

A continuacin, arrastre otro control Label desde el Cuadro de herramientas y establezca sus propiedades: a. Cambie el tamao de fuente a 15,75. b. Establezca la propiedad Text en Tiempo restante. c. Arrstrelo para alinearlo a la izquierda de la etiqueta timeLabel. Ahora, agregue los controles para el problema de suma. Arrastre un control Label desde el cuadro de herramientas y, a continuacin, establezca sus propiedades: a. Establezca la propiedad Text en ? (signo de interrogacin). b. Establezca la propiedad AutoSize en False. c. Establezca la propiedad Size en 60, 50. d. Cambie el tamao de fuente a 18. e. Cambie la propiedad TextAlign a MiddleCenter. f. Cambie la propiedad Location a 75, 75 para colocarlo en el formulario. g. Cambie la propiedad (Name) propiedad a plusLeftLabel. Seleccione la etiqueta plusLeftLabel y cpiela. (Presione Ctrl+C o bien seleccione Copiar en el men Edicin.) A continuacin, realice las acciones siguientes: a. Pguelo tres veces. (Presione Ctrl+V, o bien seleccione Pegar en el men Edicin.)

9.

Organice las tres nuevas etiquetas para que los cuadros estn en fila a la derecha de la etiqueta plusLeftLabel, utilizando las lneas de separacin para separarlas y alinearlas. c. Cambie la propiedad Text de la segunda etiqueta a + (signo ms). d. Cambie la propiedad (Name) de la tercera etiqueta a plusRightLabel. e. Cambie la propiedad Text de la cuarta etiqueta a = (signo igual). Arrastre un control NumericUpDown desde el Cuadro de herramientas y, a continuacin, haga lo siguiente: a. Cambie el tamao de fuente a 18 y, a continuacin, estrchelo para que el ancho sea 100. b. Arrstrelo hasta que se alinee con los controles Label del problema de suma. c. Cambie la propiedad (Name) a suma. (Aprenderemos ms cosas acerca del control NumericUpDown ms adelante.) Ahora, la prueba tiene una primera fila, como se muestra en la siguiente imagen. Primera fila de la prueba matemtica

b.

10. Seleccione los cinco controles del problema de suma (los cuatro controles Label y el control NumericUpDown) y cpielos. A continuacin, realice las acciones siguientes: a. Pegue los controles, con lo que se deberan agregar cinco nuevos controles al formulario. b. Los controles deberan seguir estando seleccionados, de modo que pueda hacer clic en uno de ellos y arrastrarlos a su lugar para que queden alineados debajo de los controles de suma. Utilice las lneas de separacin para proporcionar una distancia suficiente entre las dos filas. c. Cambie la propiedad Text de la segunda etiqueta a - (signo menos). d. Cambie el nombre de la primera etiqueta del signo de interrogacin a minusLeftLabel. e. Cambie el nombre de la segunda etiqueta de signo de interrogacin a minusRightLabel. f. Cambie el nombre del control NumericUpDown a diferencia. 11. Pegue los cinco controlan dos veces ms y, a continuacin, haga lo siguiente: a. Para la tercera fila, cambie el nombre de la primera etiqueta a timesLeftLabel, cambie la propiedad Text de la segunda etiqueta a (signo de multiplicacin), cambie el nombre de la tercera etiqueta a timesRightLabel y cambie el nombre del control NumericUpDown a producto. b. Para la cuarta fila, cambie el nombre de la primera etiqueta a dividedLeftLabel, cambie la propiedad Text de la segunda etiqueta a (signo de divisin), cambie el nombre de la tercera etiqueta a dividedRightLabel y cambie el nombre del control NumericUpDown a cociente.

Nota
Puede copiar el signo de multiplicacin y el signo de divisin de este tutorial y pegarlos en el IDE.

12. Se necesita un control ms en el formulario: un botn para iniciar la prueba. Arrastre un control Button desde el Cuadro de herramientas y, a continuacin, establezca sus propiedades: a. Establezca la propiedad (Name) en startButton. b. Establezca la propiedad Text en Iniciar la prueba. c. Establezca el tamao de fuente en 14. d. Establezca la propiedad AutoSize en True, para que el tamao del botn se ajuste automticamente al texto. e. Arrastre el botn hasta la parte inferior del formulario y muvalo para que quede centrado. 13. Por ltimo, haga clic en el control startButton y, a continuacin, haga lo siguiente: a. Establezca la propiedad TabIndex en 1. b. Haga clic en el control NumericUpDown de suma. c. Establezca la propiedad TabIndex en 2. d. Establezca los dems controles NumericUpDown: establezca la propiedad TabIndex del control de diferencia en 3, la propiedad TabIndex del control de producto en 4, y la propiedad TabIndex del control de cociente en 5. Ahora, el formulario debera tener un aspecto similar a la siguiente imagen. Formulario de prueba matemtica inicial

Nota
La finalidad de la propiedad TabIndex es establecer el orden de los controles cuando el usuario presiona la tecla TAB. Abra cualquier cuadro de dilogo (por ejemplo, en el men Archivo, seleccione Abrir) y presione la tecla TAB varias veces. Observe cmo se mueve el cursor de un

control a otro cada vez que se presiona la tecla TAB. Al disear este formulario originalmente, un programador decidi el orden.

14. Para ver cmo funciona la propiedad TabIndex, guarde el programa, ejectelo y, a continuacin, presione la tecla TAB varias veces.

Paso 2: Crear un problema de suma aleatoria


Visual Studio 2010 La prueba necesita problemas de matemticas. Si la prueba repite los mismos problemas, no supone ningn reto. Por ello, es interesante incluir nmeros aleatorios. Agregue un mtodo denominado StartTheQuiz() que rellena los problemas e inicia el temporizador de cuenta atrs. Para este paso, agregaremos un problema de suma aleatoria. Los dems problemas de matemticas y el temporizador de cuenta atrs se agregan en pasos posteriores de este tutorial. En el tutorial 2, hemos creado varios elementos SoundPlayer para un juego de laberinto. Para la prueba matemtica hacemos lo mismo, salvo que en lugar de la clase SoundPlayer, utilizaremos la clase Random.

Para crear un problema de suma aleatoria


1. Cree un objeto Random utilizando una instruccin new como la siguiente. C# VB Copiar

Public Class Form1

' Create a Random object to generate random numbers. Dim randomizer As New Random

Ahora, hemos agregado un objeto Random al formulario y lo hemos denominado randomizer.

Nota

En el tutorial del laberinto, creamos dos componentes SoundPlayer mediante la instruccin new. Esto hace algo similar. La nica diferencia es que, al contrario que SoundPlayer, Random no es un componente ni un control, de modo que no podemos llamarlo as. Se denomina objeto. Probablemente habr odo la palabra objeto antes. Obtendr ms informacin sobre lo que significa en los prximos tutoriales. De momento, todo lo que necesita saber es que cuando el programa utiliza una instruccin new para crear botones, etiquetas, paneles, elementos OpenFileDialog, ColorDialog, SoundPlayer o Random, e incluso formularios, el elemento que se crea se denomina objeto. Los tutoriales posteriores muestran mucha ms informacin sobre cmo funcionan estos objetos.

2.

Ahora, al iniciar el formulario, crea un nuevo objeto Random y le da el nombre randomizer. Como con los elementos SoundPlayer, si entramos en un mtodo y comenzamos a escribir randomizer con un punto (.) a continuacin, se abre una ventana IntelliSense que muestra todos los mtodos del objeto Random a los que se puede llamar. El mtodo Next() se utiliza como se indica a continuacin. Mtodo Next

Cuando se llama a random.Next(50), se obtiene un nmero aleatorio que es menor que 50 (del 0 al 49). 3. Pronto compilaremos un mtodo para comprobar las respuestas, de modo que el programa tiene que recordar qu nmeros ha elegido para los problemas. Agregue un valor de tipo integer (denominado valor de tipo int en C# o Integer en Visual Basic) denominado addend1 y otro denominado addend2 al formulario (igual que agreg el objeto Random denominado randomizer), como sigue. C# VB Copiar

' Create a Random object to generate random numbers. Dim randomizer As New Random

' These Integers will store the numbers ' for the addition problem. Dim addend1 As Integer Dim addend2 As Integer

Nota
Un valor de tipo int (Integer) se utiliza para almacenar un valor numrico positivo o negativo. Puede contener cualquier nmero comprendido entre el -2147483648 y el 2147483647. Slo puede almacenar los nmeros enteros y no los decimales.

4.

Luego, agregue un mtodo denominado StartTheQuiz() que utiliza el mtodo Next() del objeto Random para elegir dos nmeros y colocarlos en las etiquetas. Gradualmente ir rellenando todos los problemas e iniciar el temporizador, as que debe agregar un comentario. Debe tener este aspecto: C# VB Copiar

''' <summary> ''' Start the quiz by filling in all of the problems ''' and starting the timer. ''' </summary> ''' <remarks></remarks> Public Sub StartTheQuiz() ' Fill in the addition problem.

addend1 = randomizer.Next(51) addend2 = randomizer.Next(51)

plusLeftLabel.Text = addend1.ToString plusRightLabel.Text = addend2.ToString

sum.Value = 0 End Sub

Nota
Recuerde que ha llamado a randomizer.Next(51). El motivo de utilizar 51 y no 50 es que los dos nmeros sumen una respuesta que est comprendida entre el 0 y el 100. Si pasa 50 al mtodo Next(), elegir un nmero del 0 al 49, de modo que mayor respuesta posible sera 98, y no 100. Despus de ejecutarse las dos primeras instrucciones del mtodo, cada uno de los dos valores de tipo int (Integer), addend1 y addend2, contiene un nmero aleatorio del 0 al 50.

Fijmonos con ms atencin en estas instrucciones. C# VB Copiar

plusLeftLabel.Text = addend1.ToString plusRightLabel.Text = addend2.ToString

Las instrucciones establecen las propiedades Text de las dos etiquetas plus, plusLeftLabel y plusRightLabel, para que muestren los dos nmeros aleatorios. Hay que utilizar el mtodo ToString() del valor int (Integer) para convertirlo en texto (en programacin, string, o cadena, significa texto), porque los controles Label nicamente muestran texto, y no nmeros.

5.

El botn de inicio debe iniciar la prueba. Para ello, vaya al Diseador de Windows Forms y haga doble clic en el botn, a fin de agregar un controlador de eventos Click. A continuacin, agregue las dos instrucciones siguientes. C# VB Copiar

Private Sub startButton_Click() Handles startButton.Click startButton.Enabled = False StartTheQuiz() End Sub

Ya sabe lo que hace la segunda instruccin: llama al nuevo mtodo StartTheQuiz(). La primera instruccin establece la propiedad Enabled del control startButton en False. Con ello se deshabilita el botn, de modo que el usuario no pueda hacer clic en l. De esta forma, el usuario puede hacer clic en el botn de inicio una sola vez. A continuacin, el botn aparece atenuado y no est disponible, y el usuario debe finalizar la prueba antes de que se agote el tiempo (o cerrar el programa). 6. Ahora, guarde y ejecute el programa. Haga clic en el botn de inicio. Debe aparecer un problema de suma aleatoria, como se muestra en la siguiente imagen. Problema de suma aleatoria

Paso 3: Agregar un temporizador de cuenta atrs


Visual Studio 2010 Como esta prueba tiene lmite de tiempo, vamos a agregar un temporizador de la cuenta atrs. Es preciso que el programa realice el seguimiento del nmero de segundos que quedan a medida que el juego progresa.

Para agregar un temporizador de cuenta atrs


1. Agregue un valor de tipo int (Integer) denominado timeLeft, como hemos hecho previamente. El cdigo debe tener un aspecto parecido al siguiente. C# VB Copiar

Public Class Form1

' Create a Random object to generate random numbers. Dim randomizer As New Random

' These Integers will store the numbers ' for the addition problem. Dim addend1 As Integer Dim addend2 As Integer

' This Integer will keep track of the time left. Dim timeLeft As Integer

2.

3.

Ahora, hay que agregar algo que cuente el tiempo de verdad, como un temporizador. Vaya al Diseador de Windows Forms y arrastre un control Timer del Cuadro de herramientas (en la categora Componentes) hasta el formulario. Aparecer en el rea gris de la parte inferior del Diseador de Windows Forms. Haga clic en el icono timer1 que acaba de agregar y establezca la propiedad Interval en 1000. Esto hace que el evento Tick se desencadene cada segundo. A continuacin, haga

doble clic en el icono para agregar el controlador de eventos Tick. El IDE cambiar al editor de cdigo y saltar al nuevo mtodo de control de eventos. Agregue las instrucciones siguientes. C# VB Copiar

Private Sub Timer1_Tick() Handles Timer1.Tick

If (timeLeft > 0) Then ' Display the new time left ' by updating the Time Left label. timeLeft = timeLeft - 1 timeLabel.Text = timeLeft & " seconds" Else ' If the user ran out of time, stop the timer, show ' a MessageBox, and fill in the answers. Timer1.Stop() timeLabel.Text = "Time's up!" MessageBox.Show("You didn't finish in time.", "Sorry") sum.Value = addend1 + addend2 startButton.Enabled = True End If

End Sub

Segn lo que hemos agregado, cada segundo el temporizador comprobar si se ha agotado el tiempo. Para ello, comprueba si el valor de tipo int (Integer) de timeLeft es mayor que 0. Si lo es, queda tiempo. En primer lugar, el temporizador resta 1 a timeLeft y, a continuacin, actualiza la propiedad Text del control timeLabel para mostrar al usuario cuntos segundos quedan.

Si no queda tiempo, el temporizador se detiene y cambia el texto del control timeLabel de modo que muestre que se agot el tiempo. Aparecer un cuadro de mensaje que indicar al usuario que la prueba ha finalizado. Se revela la respuesta. En este caso, se suman addend1 y addend2. La propiedad Enabled del control startButton se establece en true, para que botn vuelva a estar disponible. De ese modo, el usuario puede volver a empezar la prueba. Hemos agregado una instruccin if else, que es la manera de indicar a los programas que tomen decisiones. Una instruccin if else tiene el siguiente aspecto. VB Copiar

If (something your program will check) Then ' statements that will get executed ' if the thing that the program checked is true Else ' statements that will get executed ' if the thing that the program checked is NOT true End If
C# Copiar

if (something your program will check) { // statements that will get executed // if the thing that the program checked is true } else { // statements that will get executed // if the thing that the program checked is NOT true }
Vamos a fijarnos con ms atencin en la instruccin que hemos agregado en el bloque else, para mostrar la respuesta al problema de suma. C#

VB Copiar

sum.Value = addend1 + addend2

Como probablemente sabr, addend1 + addend2 suma los dos valores.La primera parte (sum.Value) utiliza la propiedad Value del control NumericUpDown para mostrar la respuesta correcta.La propiedad Value se utiliza de nuevo ms tarde, para comprobar las respuestas de la prueba. Un control NumericUpDown facilita al usuario la escritura de nmeros. Este es el motivo por el que se utiliza este control para las respuestas a los problemas de matemticas.Dado que todas las respuestas son nmeros del 0 al 100, se dejan las propiedades predeterminadas Minimum y Maximum establecidas en 0 y 100.Esto hace que el control nicamente permita al usuario escribir un nmero del 0 al 100.Como las respuestas solo pueden ser nmeros enteros, la propiedad DecimalPlaces se deja establecida en 0, lo que significa que el usuario no puede escribir decimales.(Si desea permitir que el usuario escriba 3,141 pero no 3,1415, podra establecer la propiedad DecimalPlaces en 3.) 4. Agregue tres lneas al final de mtodo StartTheQuiz(), de modo que el cdigo tenga este aspecto. C# VB Copiar

''' <summary> ''' Start the quiz by filling in all of the problems ''' and starting the timer. ''' </summary> ''' <remarks></remarks> Public Sub StartTheQuiz()

' Fill in the addition problem. addend1 = randomizer.Next(51)

addend2 = randomizer.Next(51) plusLeftLabel.Text = addend1.ToString plusRightLabel.Text = addend2.ToString sum.Value = 0

' Start the timer. timeLeft = 30 timeLabel.Text = "30 seconds" Timer1.Start()

End Sub

Ahora, al empezar la prueba, establece el valor de tipo int (Integer) de timeLeft en 30 y cambia la propiedad Text del control timeLabel a 30 segundos. A continuacin, llama al mtodo Start() del control Timer para iniciar la cuenta atrs. (Todava no comprueba la respuesta, esto viene despus.) 5. Guarde y ejecute el programa. Al hacer clic en el botn de inicio, el temporizador debera iniciar la cuenta atrs. Cuando se agota el tiempo, la prueba finaliza y se muestra la respuesta. En la siguiente imagen se muestra la prueba en marcha. Prueba matemtica en marcha

Paso 4: Agregar el mtodo CheckTheAnswer()


Visual Studio 2010 Es preciso que la prueba compruebe si el usuario responde correctamente. Afortunadamente, escribir mtodos que realizan un clculo simple, como el mtodo CheckTheAnswer(), no es difcil.

Nota
Para quienes estn realizando este tutorial en Visual Basic, cabe destacar que, como este mtodo devuelve un valor, en lugar de la palabra clave Sub usual debern utilizar la palabra clave Function. Realmente es as de sencillo: las subrutinas no devuelven valores, las funciones, s.

Para agregar el mtodo CheckTheAnswer()


1. Agregue el mtodo CheckTheAnswer(), que suma addend1 y addend2, y comprueba si la adicin es igual al valor del control NumericUpDown de suma. Si la suma es igual, el mtodo devuelve true; si no, devuelve false. El cdigo debe tener un aspecto parecido al siguiente. C# VB Copiar

''' <summary> ''' Check the answer to see if the user got everything right. ''' </summary> ''' <returns>True if the answer's correct, false otherwise.</returns> ''' <remarks></remarks> Public Function CheckTheAnswer() As Boolean

If addend1 + addend2 = sum.Value Then Return True Else Return False End If

End Function

El programa debe llamar a este mtodo para comprobar si el usuario respondi correctamente. Para ello, se agrega if else a la instruccin. La instruccin tiene un aspecto parecido al siguiente. C# VB Copiar

If CheckTheAnswer() Then ' statements that will get executed ' if the answer is correct ElseIf timeLeft > 0 Then ' statements that will get executed ' if there's still time left on the timer Else ' statements that will get executed if the timer ran out End If

2.

Luego, se modifica el controlador de eventos Tick del temporizador para comprobar la respuesta. El nuevo controlador de eventos con comprobacin de respuesta debera incluir lo siguiente. C# VB Copiar

Private Sub Timer1_Tick() Handles Timer1.Tick

If CheckTheAnswer() Then ' If the user got the answer right, stop the timer ' and show a MessageBox. Timer1.Stop() MessageBox.Show("You got all of the answers right!", "Congratulations!") startButton.Enabled = True ElseIf timeLeft > 0 Then ' Decrease the time left by one second and display ' the new time left by updating the Time Left label. timeLeft = timeLeft - 1 timeLabel.Text = timeLeft & " seconds" Else ' If the user ran out of time, stop the timer, show ' a MessageBox, and fill in the answers. Timer1.Stop() timeLabel.Text = "Time's up!" MessageBox.Show("You didn't finish in time.", "Sorry") sum.Value = addend1 + addend2 startButton.Enabled = True End If

End Sub

Ahora, si el controlador de eventos del temporizador detecta que el usuario respondi correctamente, detiene el temporizador, muestra un mensaje de felicitacin y hace que el botn de inicio vuelva a estar disponible. 3. Guarde y ejecute el programa. Inicie el juego y escriba la respuesta correcta al problema de suma.

Nota
Al escribir la respuesta, puede que observe algo extrao en el control NumericUpDown. Si empieza a escribir sin seleccionar toda la respuesta, el cero no desaparece y hay que eliminarlo manualmente. Corregiremos esto ms adelante en este tutorial.

4.

Al escribir la respuesta correcta, debe abrirse el cuadro de mensaje, detenerse el temporizador y volver a estar disponible el botn de inicio. Haga clic de nuevo en el botn de inicio para asegurarse de que suceda as.

Paso 5: Agregar controladores de eventos Enter para los controles NumericUpDown


Visual Studio 2010 Posiblemente se habr fijado en que al escribir nmeros en el control NumericUpDown sucede algo extrao. Para corregirlo, se agrega un controlador de eventos Enter.

Para ver el comportamiento del control NumericUpDown


1. 2. Ejecute el programa e inicie el juego. El control NumericUpDown de la suma debera tener un cursor parpadeante en su interior junto al nmero 0 (cero). Escriba 3: aparecer 30. Escriba 5: aparecer 350. Sin embargo, despus de un segundo cambiar a 100. Antes de corregir este problema, piense en lo que est sucediendo. Piense por qu el 0 no desapareci cuando escribi 3. Piense por qu 350 se ha cambiado por 100, y por qu se ha producido un retraso antes del cambio.

Nota
Aunque puede parecer un comportamiento extrao, hay una explicacin. Al hacer clic en el botn de inicio, la propiedad Enabled del botn est establecida en False; el botn aparece atenuado y no est disponible. El programa busca el control con el siguiente valor de TabIndex ms bajo, el control NumericUpDown de la suma, y cambia el foco a ese control. Cuando se presiona la tecla TAB para ir a un control NumericUpDown, el cursor se sita automticamente al principio del control; este es el motivo por el cual los nmeros que se escriben aparecen a la izquierda y no a la derecha. Cuando se escribe un nmero encima de la propiedad MaximumValue, que est establecida en 100, reemplaza el nmero escrito con el valor mximo.

Para agregar un controlador de eventos Enter para el control NumericUpDown


1. A fin de evitar este comportamiento extrao y facilitar el uso del programa, agregue un controlador para cada evento Enter de cada control NumericUpDown. Utilice la pgina Eventos del el cuadro de dilogo Propiedades para agregar un controlador de eventos Enter denominado answer_Enter para el control NumericUpDown de suma. Cuadro de dilogo Propiedades

El cdigo debe tener este aspecto. C# VB Copiar

Private Sub answer_Enter(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles sum.Enter

' Select the whole answer in the NumericUpDown control. Dim answerBox As NumericUpDown = TryCast(sender, NumericUpDown)

If answerBox IsNot Nothing Then Dim lengthOfAnswer As Integer = answerBox.Value.ToString().Length

answerBox.Select(0, lengthOfAnswer) End If

End Sub

Aunque inicialmente parezca complejo, resulta ms fcil de entender si se examina paso a paso. En primer lugar, fjese en la parte superior del mtodo: object sender en C# o sender As System.Object en Visual Basic. Esto significa que dentro del mtodo, cada vez que se utiliza sender, hace referencia al control NumericUpDown cuyo evento Enter se desencadena. As que, en la primera lnea del mtodo, se especifica que no se trata de un simple objeto, sino que es concretamente un control NumericUpDown. (Cada control NumericUpDown es un objeto, pero no todos los objetos son un control NumericUpDown.) En la lnea siguiente se comprueba si se ha llevado a cabo correctamente la conversin (de tipos) de answerBox: de un objeto a un control NumericUpDown. Si la conversin de tipos no ha sido correcta, su valor sera null (C#) o Nothing (Visual Basic). En la tercer lnea se busca la longitud de la respuesta que se muestra actualmente en el control NumericUpDown. En la cuarta lnea se ordena al control NumericUpDown que seleccione la respuesta. Ahora, cuando el usuario navega al control, desencadena este evento, lo que provoca que se seleccione la respuesta. En cuanto el usuario empieza a escribir, se borra la respuesta anterior y se reemplaza con la nueva. 2. Una vez que se haya implementado este controlador de eventos, vaya al Diseador de Windows Forms y seleccione el control NumericUpDown de diferencia. Vaya a la pgina Eventos del cuadro de dilogo Propiedades, desplcese hacia abajo hasta el evento Enter y seleccione el controlador de eventos que acaba de agregar. A continuacin, haga lo mismo para los controles NumericUpDown del producto y del cociente. Guarde y ejecute el programa. El comportamiento extrao ya no se debera producir.

3. 4.

Paso 6: Agregar un problema de resta


Visual Studio 2010 Para agregar un problema de resta, necesita:

Almacenar los valores de resta. Generar nmeros aleatorios para el problema (y asegurarse de que la respuesta est comprendida entre 0 y 100). Actualizar el mtodo que comprueba las respuestas para que compruebe tambin el nuevo problema de resta. Actualizar el controlador eventos Tick del temporizador para que rellene la respuesta correcta cuando se agote el tiempo.

Para agregar un problema de resta


1. En primer lugar, se necesita un lugar donde almacenar los valores, as que agregue dos valores de tipo int (Enteros) para el problema de resta al formulario. El nuevo cdigo aparece entre los enteros de suma y el entero del temporizador. El cdigo debe tener este aspecto. C# VB Copiar

Public Class Form1

' Create a Random object to generate random numbers. Dim randomizer As New Random

' These Integers will store the numbers ' for the addition problem. Dim addend1 As Integer Dim addend2 As Integer

' These Integers will store the numbers ' for the subtraction problem. Dim minuend As Integer Dim subtrahend As Integer

' This Integer will keep track of the time left. Dim timeLeft As Integer

Nota
Los nombres de los nuevos valores int (minuend y subtrahend, minuendo y sustraendo) no son

trminos de Visual C#, ni siquiera trminos de programacin. Se trata de los nombres utilizados tradicionalmente en aritmtica para el nmero que se resta (el substraendo) y el nmero del que se resta (el minuendo). La diferencia es el minuendo menos el sustraendo. Puede utilizar otros nombres, porque el programa no requiere nombres especficos para los valores de tipo int, los controles, los componentes o los mtodos. Hay algunas reglas (por ejemplo, los nombres no pueden comenzar con dgitos), pero en general, podra utilizar nombres como x1, x2, x3, x4, etc. Sin embargo, sera difcil leer el cdigo y casi imposible realizar el seguimiento de los problemas. Ms adelante en este tutorial utilizaremos los trminos tradicionales para la multiplicacin (multiplicand multiplier = product, multiplicando multiplicador = producto) y la divisin (dividend divisor = quotient, dividendo divisor = cociente).

2.

A continuacin, modifique el mtodo StartTheQuiz() para rellenar un problema de resta aleatorio. El nuevo cdigo aparece tras el comentario "Fill in the subtraction problem". El cdigo debe tener este aspecto. C# VB Copiar

''' <summary> ''' Start the quiz by filling in all of the problems ''' and starting the timer. ''' </summary> ''' <remarks></remarks> Public Sub StartTheQuiz()

' Fill in the addition problem. addend1 = randomizer.Next(51) addend2 = randomizer.Next(51) plusLeftLabel.Text = addend1.ToString plusRightLabel.Text = addend2.ToString sum.Value = 0

' Fill in the subtraction problem. minuend = randomizer.Next(1, 101) subtrahend = randomizer.Next(1, minuend) minusLeftLabel.Text = minuend.ToString minusRightLabel.Text = subtrahend.ToString difference.Value = 0

' Start the timer. timeLeft = 30 timeLabel.Text = "30 seconds" Timer1.Start()

End Sub

Este cdigo utiliza el mtodo Next() de la clase Random de una forma algo distinta. Al darle dos valores, elige al azar uno que sea mayor o igual que el primero y menor que el segundo. La siguiente lnea elige un nmero aleatorio del 1 al 100 y lo almacena en el minuendo. C# VB Copiar

minuend = randomizer.Next(1, 101)

Se puede llamar al mtodo Next() de la clase Random de varias formas. Cuando se puede llamar a un mtodo de ms de una manera, se denomina mtodo sobrecargado. Puede utilizar IntelliSense para explorar esta posibilidad. Fijmonos de nuevo en la informacin sobre herramientas de la ventana IntelliSense del mtodo Next(). Informacin sobre herramientas de la ventana IntelliSense

Observe que la informacin sobre herramientas muestra (+ 2 sobrecargas). Esto significa que hay dos formas ms de llamar al mtodo Next(). Al escribir el nuevo cdigo para el mtodo StartTheQuiz(), puede ver ms informacin. En cuanto escriba randomizer.Next(, aparecer la ventana IntelliSense. Presione las teclas de direccin ARRIBA y ABAJO para recorrer cclicamente las sobrecargas, como se muestra en la siguiente imagen. Sobrecargas en la ventana IntelliSense

La de la imagen anterior es la que deseamos utilizar, porque permite especificar un valor mnimo y mximo. 3. Modifique el mtodo CheckTheAnswer() para que compruebe si la respuesta de la resta es correcta. El cdigo debe tener este aspecto. C# VB Copiar

''' <summary> ''' Check the answer to see if the user got everything right. ''' </summary> ''' <returns>True if the answer's correct, false otherwise.</returns>

''' <remarks></remarks> Public Function CheckTheAnswer() As Boolean

If ((addend1 + addend2 = sum.Value) AndAlso (minuend - subtrahend = difference.Value)) Then Return True Else Return False End If

End Function

&& es el operador logical and de Visual C#. En Visual Basic, el operador equivalente es AndAlso. Equivale a decir, "Si addend1 ms addend2 es igual al valor de la suma NumericUpDown, y si el minuendo menos el sustraendo es igual al valor de la diferencia NumericUpDown". El mtodo CheckTheAnswer() devuelve true nicamente si el problema de suma es correcto y el problema de resta es correcto. 4. Cambie la ltima parte del controlador de evento Tick del temporizador de modo que rellene la respuesta correcta cuando se agote el tiempo. El cdigo debe tener este aspecto. C# VB Copiar

Else ' If the user ran out of time, stop the timer, show ' a MessageBox, and fill in the answers. Timer1.Stop() timeLabel.Text = "Time's up!" MessageBox.Show("You didn't finish in time.", "Sorry") sum.Value = addend1 + addend2 difference.Value = minuend - subtrahend

startButton.Enabled = True End If

5.

Guarde y ejecute el cdigo. Ahora, el programa deber incluir un problema de resta, como se muestra en la siguiente imagen. Cuestionario de matemticas con un problema de resta

Paso 7: Agregar problemas de multiplicacin y divisin


Visual Studio 2010 Antes de comenzar este procedimiento, piense en cmo agregar los problemas de multiplicacin y divisin. Piense en el paso inicial, que requiere almacenar valores.

Para agregar problemas de multiplicacin y divisin


1. Agregue cuatro valores de tipo int (Integer) al formulario. El cdigo debe tener este aspecto. C# VB Copiar

Public Class Form1

' Create a Random object to generate random numbers. Dim randomizer As New Random

' These Integers will store the numbers in the addition problem. Dim addend1 As Integer Dim addend2 As Integer

' These Integers will store the numbers for the subtraction problem. Dim minuend As Integer Dim subtrahend As Integer

' These Integers will store the numbers for the multiplication problem. Dim multiplicand As Integer Dim multiplier As Integer

' These Integers will store the numbers for the division problem. Dim dividend As Integer Dim divisor As Integer

' This Integer will keep track of the time left. Dim timeLeft As Integer

2.

Al igual que antes, modifique el mtodo StartTheQuiz() para rellenar problemas de multiplicaciones y divisiones aleatorias. El cdigo debe tener este aspecto. C# VB

Copiar

''' <summary> ''' Start the quiz by filling in all of the problems ''' and starting the timer. ''' </summary> ''' <remarks></remarks> Public Sub StartTheQuiz()

' Fill in the addition problem. addend1 = randomizer.Next(51) addend2 = randomizer.Next(51) plusLeftLabel.Text = addend1.ToString plusRightLabel.Text = addend2.ToString sum.Value = 0

' Fill in the subtraction problem. minuend = randomizer.Next(1, 101) subtrahend = randomizer.Next(1, minuend) minusLeftLabel.Text = minuend.ToString minusRightLabel.Text = subtrahend.ToString difference.Value = 0

' Fill in the multiplication problem. multiplicand = randomizer.Next(2, 11) multiplier = randomizer.Next(2, 11) timesLeftLabel.Text = multiplicand.ToString timesRightLabel.Text = multiplier.ToString product.Value = 0

' Fill in the division problem. divisor = randomizer.Next(2, 11) Dim temporaryQuotient As Integer = randomizer.Next(2, 11) dividend = divisor * temporaryQuotient dividedLeftLabel.Text = dividend.ToString dividedRightLabel.Text = divisor.ToString quotient.Value = 0

' Start the timer. timeLeft = 30 timeLabel.Text = "30 seconds" Timer1.Start()

End Sub

3.

Modifique el mtodo CheckTheAnswer() para que tambin compruebe los problemas de divisin y multiplicacin. El cdigo debe tener este aspecto. C# VB Copiar

''' <summary> ''' Check the answer to see if the user got everything right. ''' </summary> ''' <returns>True if the answer's correct, false otherwise.</returns> ''' <remarks></remarks> Public Function CheckTheAnswer() As Boolean

If ((addend1 + addend2 = sum.Value) AndAlso (minuend - subtrahend = difference.Value) AndAlso (multiplicand * multiplier = product.Value) AndAlso (dividend / divisor = quotient.Value)) Then Return True Else Return False End If

End Function

Nota
Dado que no hay ninguna manera simple de escribir el signo de multiplicacin () y el signo de divisin () mediante el teclado, Visual C# y Visual Basic utilizan el asterisco (*) para la multiplicacin y la barra diagonal (/) para la divisin.

4.

Cambie la ltima parte del controlador de evento Tick del temporizador de modo que rellene la respuesta correcta cuando se agote el tiempo. El cdigo debe tener este aspecto. C# VB Copiar

Else ' If the user ran out of time, stop the timer, show ' a MessageBox, and fill in the answers. Timer1.Stop() timeLabel.Text = "Time's up!" MessageBox.Show("You didn't finish in time.", "Sorry") sum.Value = addend1 + addend2 difference.Value = minuend - subtrahend

product.Value = multiplicand * multiplier quotient.Value = dividend / divisor startButton.Enabled = True End If

5.

Guarde y ejecute el programa. Ahora, hay que responder a cuatro problemas para completar la prueba, como se muestra en la siguiente imagen. Prueba matemtica con cuatro problemas

Paso 8: Probar otras caractersticas


Visual Studio 2010 Piense en cmo el programa crea un problema de divisin aleatoria. Piense por qu el programa no crea un problema en que la respuesta sea una fraccin. Para aprender ms, intente cambiar el color del control timeLabel y proporcionar al usuario alguna sugerencia.

Para probar otras caractersticas

Cambie el color del control timeLabel a rojo cuando al usuario no le queden ms que cinco segundos, estableciendo su control BackColor (timeLabel.BackColor = Color.Red;). Restablezca el color cuando la prueba haya terminado. Proporcione al usuario una sugerencia reproduciendo un sonido cuando especifique una respuesta correcta en uno de los controles NumericUpDown. (Tendr que escribir un controlador de eventos para el evento ValueChanged de cada control, que se desencadena cada vez que el usuario cambia el valor del control.)

Tutorial 4: Crear un juego de formar parejas


Visual Studio 2010 En este tutorial, compilar un juego de formar parejas en el que el jugador debe buscar las coincidencias entre pares de iconos ocultos. Aprender a:

Usar un objeto List para contener objetos. Usar un bucle foreach en Visual C# o un bucle For Each en Visual Basic. Realizar el seguimiento del estado de un formulario mediante variables de referencia. Compilar un controlador de eventos que se pueda usar con varios objetos. Hacer que un temporizador se active una vez despus de iniciarse.

Cuando termine, el programa se parecer al de la ilustracin siguiente. Juego que crear en este tutorial

Nota
En este tutorial, se trata tanto Visual C# como Visual Basic, por lo que deber centrarse en la informacin especfica del lenguaje de programacin que use.

Temas relacionados
Ttulo
Paso 1: Crear un proyecto y agregar una tabla a un formulario Paso 2: Agregar un objeto aleatorio y una lista de iconos Agregar un objeto Random y un objeto List, para crear una lista de iconos. Asignar los iconos aleatoriamente a los controles Label.

Descripcin
El primer paso es crear el proyecto y agregar un control TableLayoutPanel.

Paso 3: Asignar un icono aleatorio a cada etiqueta

Agregar un controlador de eventos Click que cambiar el color de la controlador de eventos Click a etiqueta en la que se haga clic. cada etiqueta Paso 4: Agregar un Paso 5: Agregar referencias a etiquetas Agregar variables de referencia para realizar el seguimiento de las etiquetas en las que se hace clic. Agregar un temporizador al formulario.

Paso 6: Agregar un temporizador Paso 7: Mantener visibles los pares

Mantendr los pares de iconos visibles si se selecciona una pareja coincidente. Agregar un mtodo CheckForWinner() para comprobar si el jugador gan.

Paso 8: Agregar un mtodo para comprobar si el jugador gan Paso 9: Probar otras caractersticas

Probar otras caractersticas, como cambiar los iconos y colores, agregar una cuadrcula y agregar sonidos. Intentar aumentar el tamao del tablero y ajustar el temporizador.

Paso 1: Crear un proyecto y agregar una tabla a un formulario


Visual Studio 2010 El primer paso para crear un juego de formar parejas es crear el proyecto y agregar una tabla al formulario.

Para crear un proyecto y agregar una tabla al formulario


1. 2. 3. 4. En el men Archivo, haga clic en Nuevo proyecto. Si no usa Visual Studio Express, primero debe seleccionar un lenguaje. En la lista Plantillas instaladas, seleccione C# o Visual Basic. Haga clic en el icono Aplicacin de Windows Forms y, a continuacin, escriba el nombre MatchingGame. Establezca las propiedades del formulario. a. Cambie la propiedad Text del formulario a Matching Game. b. Cambie el tamao a 550 pxeles de ancho por 550 pxeles de alto mediante la propiedad Size o arrastre el mouse hasta que vea el tamao correcto en la esquina inferior izquierda del entorno de desarrollo integrado (IDE). Arrastre un control TableLayoutPanel desde el cuadro de herramientas y, a continuacin, establezca sus propiedades:

5.

a. b.

c. d. e.

Establezca la propiedad BackColor en CornflowerBlue. (Seleccione la pestaa Web en el selector de colores para ver los nombres de los colores). Establezca la propiedad Dock en Fill; para ello, haga clic en el botn de lista desplegable situado al lado de la propiedad y haga clic en el botn grande del medio. Haga clic en el botn del tringulo situado en la esquina superior derecha de TableLayoutPanel para mostrar el men de tareas. Haga clic dos veces Agregar fila para agregar dos filas ms y, a continuacin, haga clic dos veces en Agregar columna para agregar dos columnas ms. Haga clic en Editar filas y columnas para abrir la ventana Estilos de columna y fila. Seleccione cada una de las columnas, haga clic en el botn Porcentaje y establezca el ancho de cada columna en el 25 por ciento del ancho total. A continuacin, seleccione Filas en la lista desplegable de la parte superior de la ventana y establezca el alto de cada fila en el 25 por ciento. Haga clic en el botn Aceptar.

Ahora, su control TableLayoutPanel debera tener diecisis celdas cuadradas del mismo tamao. 6. Asegrese de que el control TableLayoutPanel est seleccionado en el editor de formularios. Con l seleccionado, abra el cuadro de herramientas y haga doble clic en Etiqueta para agregar un control Label al cuadrado superior izquierdo. Ahora, el control Label debera estar seleccionado en el IDE. Establezca sus propiedades: a. Establezca la propiedad BackColor en CornflowerBlue. b. Establezca la propiedad AutoSize en False. c. Establezca la propiedad Dock en Fill. d. Establezca la propiedad TextAlign en MiddleCenter haciendo clic en el botn de lista desplegable que se encuentra al lado de la propiedad y haciendo clic, a continuacin, en el botn central. e. Haga clic en la propiedad Font. Debera aparecer un botn de puntos suspensivos. f. Haga clic en el botn de puntos suspensivos y establezca la fuente en Webdings 72 point Bold. g. Establezca la propiedad Text en la letra c. La celda superior izquierda de TableLayoutPanel debera contener un cuadro negro grande centrado sobre un fondo azul.

Nota
La fuente Webdings es una fuente de iconos que se distribuye con el sistema operativo Microsoft Windows. En el juego de formar parejas, el jugador necesita encontrar la correspondencia entre pares de iconos, de modo que se usa esta fuente para mostrar los iconos que deben coincidir. En lugar de colocar c en la propiedad Text, pruebe a escribir letras diferentes para ver qu iconos se muestran. Un signo de exclamacin es una araa, una N mayscula es un ojo y una coma es una guindilla.

7.

Seleccione el control Label y cpielo. (Presione Ctrl+C o, en el men Edicin, haga clic en Copiar). A continuacin, pguelo. (Presione Ctrl+V o, en el men Edicin, haga clic en Pegar). Aparecer otra etiqueta en la segunda celda de TableLayoutPanel. Vuelva a pegar el

control; aparecer otra etiqueta en la tercera celda. Siga pegando los controles Label hasta que se llenen todas las celdas.

Nota
Si pega demasiadas veces, el IDE agrega una nueva fila a TableLayoutPanel para que haya espacio para agregar el nuevo control Label. La accin se puede deshacer. Para quitar la nueva celda, presione Ctrl+Z o, en el men Edicin, haga clic en Deshacer.

8. Ya tiene diseado el formulario. Debera tener este aspecto: 9. Formulario inicial del juego de formar parejas 10.

Paso 2: Agregar un objeto aleatorio y una lista de iconos


Visual Studio 2010 Es preciso utilizar dos instrucciones new para crear dos objetos y agregarlos al formulario. El primero es un objeto Random como el usado en el juego de la prueba de matemticas. El segundo es nuevo: un objeto List.

Para agregar un objeto Random y una lista de iconos


1. Antes de agregar el siguiente cdigo para crear la lista, tenga en cuenta su funcionamiento. C# VB Copiar

Public Class Form1

' Use this Random object to choose random icons for the squares Dim random As New Random

' Each of these letters is an interesting icon ' in the Webdings font, ' and each icon appears twice in this list Dim temporaryArray() As String = {"!", "!", "N", "N", ",", ",", "k", "k", _ "b", "b", "v", "v", "w", "w", "z", "z"} Dim icons As List(Of String) = temporaryArray.ToList()

2.

3.

Pase al editor de cdigo haciendo clic con el botn secundario en Form1.cs en el Explorador de soluciones y haciendo clic a continuacin en Ver cdigo en el men. Comience por escribir el cdigo mostrado en el paso anterior. Al escribir cdigo de Visual C#, asegrese de que coloca el cdigo despus de la llave de apertura y justo despus de la declaracin de clase (public partial class Form1 : Form). Al escribir cdigo de Visual Basic, coloque el cdigo justo despus de la declaracin de clase (Public Class Form1). Al agregar el objeto List, observe atentamente la ventana IntelliSense que se abre. El siguiente es un ejemplo de Visual C#. Aparecer texto similar si agrega una lista en Visual Basic. Ventana IntelliSense

Nota
Es ms sencillo comprender el cdigo si se examina en secciones pequeas. Sus programas pueden utilizar objetos List para hacer el seguimiento de muchos elementos. Una lista puede contener nmeros, valores true/false, texto u otros objetos. Se puede tener un objeto List que contiene otros objetos List. Los elementos en una lista se llaman elementos y cada lista solo contiene elementos de un tipo. As que una lista de nmeros solo puede contener nmeros; no se puede agregar texto. Tampoco se pueden agregar nmeros a una lista de valores true/false

Nota
Cuando crea un objeto List mediante una instruccin new, necesita indicar lo que desea que contenga. Por eso la informacin sobre herramientas de la parte superior de la ventana IntelliSense muestra el tipo de elementos de la lista. Adems, eso es lo que significa List<string> (en Visual C#) y List(Of String) (en Visual Basic): es un objeto List que contiene cadenas. Una cadena es lo que su programa utiliza para almacenar texto, que es lo que la informacin sobre herramientas de la parte derecha de la ventana IntelliSense le indica.

4.

En Visual Basic se debe crear primero una matriz temporal, pero en Visual C#, la lista se puede crear con una instruccin. Esto es porque Visual C# tiene inicializadores de coleccin. En Visual Basic 2010, puede utilizar un inicializador de coleccin. Sin embargo, por compatibilidad con la versin anterior de Visual Basic, recomendamos utilizar el cdigo anterior.

Nota
Al utilizar un inicializador de coleccin con una instruccin new, una vez creado el nuevo objeto List, el programa lo rellena con lo que haya entre las llaves. En este caso, se obtiene una lista de cadenas denominadas iconos; la lista se inicializar para que contenga diecisis cadenas. Cada una de esas cadenas es una letra nica y todas corresponden a los iconos que se mostrarn en las etiquetas. As que el juego tendr un par de signos de exclamacin, un par de letras N en mayscula, un par de comas, etc. El objeto List tendr diecisis cadenas en total, una por cada celda de la TableLayoutPanel.

Nota
En Visual Basic, se obtiene el mismo resultado, pero las cadenas se colocan primero en una matriz temporal, que se convierte despus en un objeto List. Una matriz es similar a una lista, salvo que las matrices se crean con un tamao fijo. Las listas pueden reducir y crecer segn sea necesario, algo

que es importante en este programa.

Paso 3: Asignar un icono aleatorio a cada etiqueta


Visual Studio 2010 Si el juego siempre oculta los mismos iconos en las mismas ubicaciones, no supone ningn reto. Debe asignar los iconos de forma aleatoria a los controles Label del formulario. Con este objetivo, se agrega un mtodo AssignIconsToSquares().

Para asignar un icono aleatorio a cada etiqueta


1. Antes de agregar el siguiente cdigo, considere cmo funciona el mtodo. Hay una nueva palabra clave: foreach en Visual C# y For Each en Visual Basic. (Una de las lneas est comentada intencionadamente; se explica al final de este procedimiento). C# VB Copiar

''' <summary> ''' Assign each icon from the list of icons to a random square ''' </summary> ''' <remarks></remarks> Private Sub AssignIconsToSquares()

' The TableLayoutPanel has 16 labels, ' and the icon list has 16 icons, ' so an icon is pulled at random from the list ' and added to each label For Each control In TableLayoutPanel1.Controls Dim iconLabel As Label = TryCast(control, Label) If iconLabel IsNot Nothing Then Dim randomNumber As Integer = random.Next(icons.Count) iconLabel.Text = icons.ElementAt(randomNumber)

' iconLabel.ForeColor = iconLabel.BackColor icons.RemoveAt(randomNumber) End If Next

End Sub

2.

Agregue el mtodo AssignIconsToSquares() tal como se indica en el paso anterior. Basta con que lo coloque debajo del cdigo que agreg en Paso 2: Agregar un objeto aleatorio y una lista de iconos. Hay una novedad en el mtodo AssignIconsToSquares(): un bucle foreach en Visual C# y For Each en Visual Basic. Un bucle foreach se usa siempre que se desea realizar la misma accin una y otra vez. En este caso, desea ejecutar las mismas instrucciones para cada etiqueta de TableLayoutPanel, tal y como se observa en el siguiente cdigo. C# VB Copiar

For Each control In TableLayoutPanel1.Controls ' The statements you want to execute ' for each label go here ' The statements use iconLabel to access ' each label's properties and methods Next

Nota
Se usan los nombres iconLabel y control porque son descriptivos. Sin embargo, podra reemplazarlos con cualquier nombre sin que ello repercutiese en el funcionamiento (siempre y cuando se cambiase

el nombre en cada instruccin incluida entre llaves).

El mtodo AssignIconsToSquares() recorre cada control Label de TableLayoutPanel y ejecuta las mismas instrucciones para cada uno de ellos. Esas instrucciones extraen un icono aleatorio de la lista que se agreg en Paso 2: Agregar un objeto aleatorio y una lista de iconos. (Por eso incluy dos iconos de cada en la lista, para que hubiera un par de iconos asignado a los controles Label aleatorios.) 3. Necesita llamar al mtodo AssignIconsToSquares() en cuanto se inicie el programa. Si escribe cdigo de Visual C#, agregue una instruccin bajo la llamada al mtodo InitializeComponent() en el constructor Form1, de modo que el formulario llame a su nuevo mtodo para prepararse antes de mostrarse. C# Copiar

public Form1() { InitializeComponent();

AssignIconsToSquares(); }

Para Visual Basic, primero agregue el constructor y, a continuacin, agregue al constructor la llamada al mtodo. Antes del mtodo AssignIconsToSquares() que acaba de crear, empiece escribiendo el cdigo Public Sub New(). Al presionar la tecla ENTRAR para pasar a la lnea siguiente, IntelliSense debera hacer que apareciese el siguiente cdigo para completar el constructor. VB Copiar

Public Sub New() ' This call is required by Windows Form Designer InitializeComponent() ' Add any initialization after the InitializeComponent() call

End Sub
Agregue la llamada al mtodo AssignIconsToSquares() de modo que el constructor sea similar al siguiente. VB Copiar

Public Sub New() ' This call is required by Windows Form Designer InitializeComponent() ' Add any initialization after the InitializeComponent() call AssignIconsToSquares() End Sub

4. 5.

Guarde el programa y ejectelo. Ahora, debera mostrar un formulario con iconos aleatorios asignados a cada etiqueta. Cierre el programa y, a continuacin, ejectelo de nuevo. Ahora hay iconos diferentes asignados a cada etiqueta, como se muestra en la siguiente ilustracin. Juego de formar parejas con iconos aleatorios

6.

Ahora detenga el programa y quite los comentarios de la lnea de cdigo dentro del bucle foreach. C#

VB Copiar

iconLabel.ForeColor = iconLabel.BackColor

7.

Haga clic en el botn Guardar todo de la barra de herramientas para guardar el programa y, a continuacin, ejectelo. Parece que los iconos han desaparecido (nicamente se muestra un fondo azul). Sin embargo, los iconos se asignan aleatoriamente y siguen ah. Debido a que los iconos tienen el mismo color que el fondo, no se ven.

Paso 4: Agregar un controlador de eventos Click a cada etiqueta


Visual Studio 2010 El juego de formar parejas funciona como sigue: 1. 2. 3. Cuando un jugador hace clic en uno de los cuadrados con icono oculto, el programa muestra el icono al jugador cambiando a negro su color. A continuacin, el jugador hace clic en otro icono oculto. Si los iconos coinciden, permanecen visibles. En caso contrario, se vuelven a ocultar.

Para conseguir que un programa funcione as, agregue un controlador de eventos Click que cambie el color de la etiqueta en la que se hace clic.

Para agregar un controlador de eventos Click a cada etiqueta


1. Vaya al Diseador de Windows Forms y haga clic en el primer control Label para seleccionarlo. A continuacin, mantenga presionada la tecla CTRL mientras hace clic en cada una de las otras etiquetas para seleccionarlas. Asegrese de que todas las etiquetas estn seleccionadas. A continuacin, vaya a la pgina Eventos de la ventana Propiedades. Desplcese hacia abajo hasta el evento Click y escriba label_Click en el cuadro, como se muestra en la siguiente ilustracin. Ventana Propiedades con el evento Click

2.

3. 4.

Presione ENTRAR. El IDE agrega al cdigo un controlador de eventos Click denominado label_Click() y lo enlaza a cada una de las etiquetas. Rellene el resto del cdigo como se indica a continuacin: C# VB Copiar

''' <summary> ''' Every label's Click event is handled by this event handler ''' </summary> ''' <param name="sender">The label that was clicked</param> ''' <param name="e"></param> ''' <remarks></remarks> Private Sub label_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Label9.Click, Label8.Click, Label7.Click, Label6.Click, Label5.Click, Label4.Click, Label3.Click, Label2.Click, Label16.Click, Label15.Click, Label14.Click, Label13.Click, Label12.Click, Label11.Click, Label10.Click, Label1.Click

Dim clickedLabel As Label = TryCast(sender, Label)

If clickedLabel IsNot Nothing Then

' If the clicked label is black, the player clicked ' an icon that's already been revealed -' ignore the click If (clickedLabel.ForeColor = Color.Black) Then Return End If

clickedLabel.ForeColor = Color.Black End If End Sub

Nota
Es posible que reconozca, del tutorial para crear una prueba matemtica, el elemento object sender que se muestra en la parte superior del controlador de eventos. Enlaz distintos eventos Clic del control Label a un nico mtodo de controlador de eventos, de modo que se llama al mismo mtodo con independencia de la etiqueta en la que haga clic el usuario. Dado que el mtodo necesita saber en qu etiqueta se hizo clic, usa el nombre sender para ese control Label. La primera lnea del mtodo indica al programa que no es solo un objeto, sino que es, en concreto, un control Label y que, a travs del nombre clickedLabel, se tiene acceso a sus propiedades y mtodos.

Este mtodo comprueba primero si clickedLabel se convirti (mediante conversin de tipos) correctamente de un objeto en un control Label. Si no, tiene un valor Null (C#) o Nothing (Visual Basic), y no se desea ejecutar el resto del cdigo en el mtodo. Luego, el mtodo comprueba el color del texto de la etiqueta en la que se hizo clic mediante la propiedad ForeColor. Si ya es negro, se ha hecho clic en el icono, de modo que el mtodo ha terminado. (Esto es lo que hace la instruccin return: indica al programa que deje de ejecutar el mtodo). Si no se ha hecho clic en el icono, cambia el color del texto a negro. 5. Guarde y ejecute el programa. Debera ver un formulario vaco con un fondo azul. Haga clic en el formulario; uno de los iconos debera volverse visible. Siga haciendo clic en distintos lugares del formulario. A medida que hace clic en los iconos, deberan aparecer.

Paso 5: Agregar referencias a etiquetas


Visual Studio 2010 El programa necesita realizar un seguimiento de los controles Label en los que el usuario hace clic. Despus de que se haga clic en la primera etiqueta, el programa muestra el correspondiente icono. Despus de que se haga clic en la segunda etiqueta, el programa muestra ambos iconos durante unos instantes y, a continuacin, los vuelve a ocultar. El programa realiza un seguimiento del control Label en el que se hace clic en primer lugar y del control en el que se hace clic en segundo lugar mediante variables de referencia.

Para agregar referencias de etiqueta


1. Para agregar referencias de etiqueta a un formulario, use el siguiente cdigo. C# VB Copiar

Public Class Form1

' firstClicked points to the first Label control ' that the player clicks, but it will be Nothing ' if the player hasn't clicked a label yet Dim firstClicked As Label = Nothing

' secondClicked points to the second Label control ' that the player clicks Dim secondClicked As Label = Nothing

Nota
Las variables de referencia parecen similares a las instrucciones usadas para agregar objetos (por ejemplo, objetos Timer, objetos List y objetos Random) a un formulario. Sin embargo, estas instrucciones no hacen aparecer dos controles Label adicionales en el formulario porque ninguna de

las dos instrucciones incluye new. Sin new, no se crea ningn objeto. Por ello, firstClicked y secondClicked se denominan variables de referencia: simplemente realizan un seguimiento o hacen referencia a objetos Label.

Nota
Cuando una variable no realiza el seguimiento de ningn objeto, se establece en un valor especial: null en Visual C# y Nothing en Visual Basic. Por lo tanto, cuando se inicia el programa, el valor de firstClicked y el valor de secondClicked estn establecidos en null o Nothing, lo que significa que las variables no realizan ningn tipo de seguimiento.

2.

Modifique el controlador de eventos Click para usar la nueva variable de referencia firstClicked. Quite la ltima instruccin del mtodo de control de eventos label_Click() (clickedLabel.ForeColor = Color.Black;) y reemplcela por la instruccin if que figura a continuacin. (Asegrese de incluir el comentario as como todo lo que aparezca entre llaves.) C# VB Copiar

''' <summary> ''' Every label's Click event is handled by this event handler ''' </summary> ''' <param name="sender">The label that was clicked</param> ''' <param name="e"></param> ''' <remarks></remarks> Private Sub label_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Label9.Click, Label8.Click, Label7.Click, Label6.Click, Label5.Click, Label4.Click, Label3.Click, Label2.Click, Label16.Click, Label15.Click, Label14.Click, Label13.Click, Label12.Click, Label11.Click, Label10.Click, Label1.Click

Dim clickedLabel As Label = TryCast(sender, Label)

If clickedLabel IsNot Nothing Then

' If the clicked label is black, the player clicked ' an icon that's already been revealed -' ignore the click If (clickedLabel.ForeColor = Color.Black) Then Return End If

' If firstClicked is Nothing, this is the first icon ' in the pair that the player clicked, ' so set firstClicked to the label that the player ' clicked, change its color to black, and return If (firstClicked Is Nothing) Then firstClicked = clickedLabel firstClicked.ForeColor = Color.Black Return End If End If

End Sub

3. 4.

Guarde y ejecute el programa. Haga clic en uno de los controles Label y aparecer el correspondiente icono. Haga clic en el siguiente control Label y ver que no sucede nada. El programa ya est realizando un seguimiento de la primera etiqueta en la que se hizo clic, por lo que el valor de firstClicked no es null en Visual C# ni Nothing en Visual Basic. Cuando la instruccin if comprueba firstClicked para determinar si su valor es null o Nothing, concluye que no tiene ese valor y no ejecuta las instrucciones de la instruccin if. Por lo tanto, solo el primer icono en el que se hizo clic se vuelve negro y los dems iconos se vuelven invisibles, tal y como se muestra en la siguiente imagen. Juego de formar parejas con un icono visible

Paso 6: Agregar un temporizador


Visual Studio 2010 A continuacin, agregar un temporizador al juego de formar parejas.

Para agregar un temporizador


1. Vaya al cuadro de herramientas del Diseador de Windows Forms. Haga doble clic en Temporizador (en la categora Componentes) y agregue un temporizador al formulario; su icono aparece en un cuadro deshabilitado bajo el formulario, como se muestra en la siguiente ilustracin. Temporizador

2.

Haga clic en el icono timer1 para seleccionar el temporizador. Establezca la propiedad Interval en 750, pero deje la propiedad Enabled establecida en False. La propiedad Interval indica al temporizador cunto tiempo debe esperar entre los pasos, de modo que aqu se indica al temporizador que espere tres cuartos de segundo (750 milisegundos) antes de desencadenar su primer evento Tick. No desear que el temporizador se inicie cuando se inicie el programa. En su lugar, utilizar el mtodo Start() para iniciar el temporizador cuando el jugador haga clic en la segunda etiqueta.

3.

Haga doble clic en el icono del control Timer en el Diseador de Windows Forms para agregar el controlador de eventos Tick, como se muestra en el siguiente cdigo. C# VB Copiar

''' <summary> ''' This timer is started when the player clicks ''' two icons that don't match, ''' so it counts three quarters of a second ''' and then turns itself off and hides both icons ''' </summary> ''' <remarks></remarks> Private Sub Timer1_Tick() Handles Timer1.Tick

' Stop the timer Timer1.Stop()

' Hide both icons firstClicked.ForeColor = firstClicked.BackColor secondClicked.ForeColor = secondClicked.BackColor

' Reset firstClicked and secondClicked ' so the next time a label is ' clicked, the program knows it's the first click firstClicked = Nothing secondClicked = Nothing

End Sub

El controlador de eventos Tick realiza tres acciones: primero, detiene el temporizador mediante una llamada al mtodo Stop(). A continuacin, usa las dos variables de referencia, firstClicked y secondClicked, para recuperar las dos etiquetas en las que el jugador hizo clic y volver a ocultar sus iconos. Finalmente, restablece las variables de referencia firstClicked y secondClicked en null en Visual C# y Nothing en Visual Basic. Esto es importante, porque as es como se restablece el propio programa. Ahora no realiza el seguimiento de ningn control Label y vuelve a estar listo para el primer clic del jugador.

Nota
Un objeto Timer tiene un mtodo Start() que inicia el temporizador y un mtodo Stop() que lo detiene. Al establecer la propiedad Enabled del temporizador en True en la ventana Propiedades, inicia los pasos nada ms comenzar el programa. Sin embargo, si se deja establecido en False, no inicia los pasos hasta que se llama a su mtodo Start().

Nota
Normalmente, un temporizador desencadena una y otra vez su evento Tick, utilizando la propiedad Interval para determinar cuntos milisegundos debe esperar entre los pasos. Es posible que haya observado cmo se llama al mtodo Stop() del temporizador dentro del evento Tick. Esto hace que el temporizador entre en modo de un disparo, de tal forma que, cuando se llama al mtodo Start(), espera durante el intervalo correspondiente y desencadena un nico evento Tick.

4.

Para ver el nuevo temporizador en accin, vaya al editor de cdigo y agregue el siguiente cdigo al principio y al final del mtodo de control de eventos label_Click(). (Se agrega una instruccin if al principio y tres instrucciones al final; el resto del mtodo no cambia). C# VB Copiar

''' <summary> ''' Every label's Click event is handled by this event handler ''' </summary> ''' <param name="sender">The label that was clicked</param> ''' <param name="e"></param> ''' <remarks></remarks>

Private Sub label_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Label9.Click, Label8.Click, Label7.Click, Label6.Click, Label5.Click, Label4.Click, Label3.Click, Label2.Click, Label16.Click, Label15.Click, Label14.Click, Label13.Click, Label12.Click, Label11.Click, Label10.Click, Label1.Click

' The timer is only on after two non-matching ' icons have been shown to the player, ' so ignore any clicks if the timer is running If (Timer1.Enabled = True) Then Return End If

Dim clickedLabel As Label = TryCast(sender, Label)

If clickedLabel IsNot Nothing Then ' If the clicked label is black, the player clicked ' an icon that's already been revealed -' ignore the click If (clickedLabel.ForeColor = Color.Black) Then Return End If

' If firstClicked is Nothing, this is the first icon ' in the pair that the player clicked, ' so set firstClicked to the label that the player ' clicked, change its color to black, and return If (firstClicked Is Nothing) Then firstClicked = clickedLabel firstClicked.ForeColor = Color.Black Return End If

' If the player gets this far, the timer isn't ' running and firstClicked isn't Nothing, ' so this must be the second icon the player clicked ' Set its color to black secondClicked = clickedLabel secondClicked.ForeColor = Color.Black

' If the player gets this far, the player ' clicked two different icons, so start the ' timer (which will wait three quarters of ' a second, and then hide the icons) Timer1.Start() End If

End Sub

El cdigo que se encuentra al principio del mtodo comprueba si el temporizador se inici en la propiedad Enabled. As, si el jugador hace clic en el primer y segundo control Label y se inicia el temporizador, no suceder nada al hacer clic en un tercer control. El cdigo al final del mtodo establece la variable de referencia secondClicked para que realice el seguimiento del segundo control Label en el que hizo clic el jugador, y establece el color del icono de esa etiqueta en negro para que est visible. A continuacin, inicia el temporizador en modo de un disparo de forma que espere durante 750 milisegundos antes de desencadenar el evento Tick. Es entonces cuando el controlador de eventos Tick del temporizador oculta los dos iconos y restablece las variables de referencia firstClicked y secondClicked de modo que el formulario est listo para que el jugador haga clic en otro icono. 5. 6. Guarde y ejecute el programa. Haga clic en un icono para que se vuelva visible. Haga clic en otro icono. Aparece brevemente y, a continuacin, ambos iconos desaparecen. Repita el proceso varias veces. Ahora, el formulario realiza el seguimiento del primer y segundo icono en los que hizo clic, y usa el temporizador para realizar una pausa antes de hacer que los iconos desaparezcan.

Paso 7: Mantener visibles los pares


Visual Studio 2010 El juego funciona bien siempre y cuando el jugador haga clic solo en los pares de iconos que no coinciden. Sin embargo, piense qu sucedera si el jugador hace clic en una pareja coincidente. En lugar de hacer que los iconos desaparezcan activando el temporizador (con el mtodo Start()), el juego se debera restablecer automticamente para dejar de realizar el seguimiento de cualquier etiqueta mediante las variables de referencia firstClicked y secondClicked, sin restablecer los colores de las dos etiquetas en las que se hizo clic.

Para mantener las parejas visibles


1. Agregue la siguiente instruccin if al mtodo de control de eventos label_Click(), casi al final, justo encima de la instruccin donde se inicia el temporizador. Observe el cdigo minuciosamente mientras lo agrega al programa. Observe cmo funciona. C# VB Copiar

' If the player gets this far, the timer isn't ' running and firstClicked isn't Nothing, ' so this must be the second icon the player clicked ' Set its color to black secondClicked = clickedLabel secondClicked.ForeColor = Color.Black

' If the player clicked two matching icons, keep them ' black and reset firstClicked and secondClicked ' so the player can click another icon If (firstClicked.Text = secondClicked.Text) Then firstClicked = Nothing secondClicked = Nothing Return End If

' If the player gets this far, the player ' clicked two different icons, so start the ' timer (which will wait three quarters of ' a second, and then hide the icons) Timer1.Start() End If End Sub

La primera lnea de la instruccin if que acaba de agregar comprueba si el icono de la primera etiqueta en la que el jugador hizo clic es igual que el icono de la segunda etiqueta. Si los iconos son iguales, el programa ejecuta las tres instrucciones entre llaves en C# o las tres instrucciones incluidas en la instruccin if en Visual Basic. Las dos primeras instrucciones restablecen las variables de referencia firstClicked y secondClicked para que no realicen el seguimiento de ninguna de las etiquetas. (Quizs reconozca esas dos instrucciones por el controlador de eventos Tick del temporizador). La tercera es una instruccin return, que indica al programa que omita el resto de las instrucciones del mtodo sin ejecutarlas. Si programa en Visual C#, quizs haya observado que en una parte del cdigo se usa un solo signo de igualdad (=), mientras que otras instrucciones usan dos (==). Piense por qu se usa = en algunos lugares y == en otros. Aqu tiene un buen ejemplo donde se ve la diferencia. Observe minuciosamente el cdigo que se encuentra entre parntesis en la instruccin if. VB Copiar

firstClicked.Text = secondClicked.Text
C# Copiar

firstClicked.Text == secondClicked.Text
A continuacin, examine con detalle la primera instruccin del bloque de cdigo situado despus de la instruccin if. VB Copiar

firstClicked = Nothing

C# Copiar

firstClicked = null;
La primera de esas dos instrucciones comprueba si dos iconos son iguales.Dado que se comparan dos valores, el programa de Visual C# usa el operador de igualdad ==.La segunda instruccin en realidad cambia el valor (lo que se conoce como asignacin), estableciendo la variable de referencia firstClicked en null para restablecerlo.Por eso se usa en este caso el operador de asignacin =.Visual C# usa = para establecer los valores y == para compararlos.En Visual Basic se usa = tanto para la asignacin como para la comparacin. 2. Guarde y ejecute el programa, y empiece a hacer clic en el formulario. Si hace clic en una pareja que no coincide, se desencadena el evento Tick del temporizador, y ambos iconos desaparecen. Si hace clic en una pareja coincidente, se ejecuta la nueva instruccin if y la instruccin return hace que el mtodo omita el cdigo que inicia el temporizador, de modo que los iconos se mantengan visibles, como se muestra en la siguiente ilustracin. Juego de formar parejas con pares de iconos visibles

Paso 8: Agregar un mtodo para comprobar si el jugador gan


Visual Studio 2010 Ha creado un juego divertido, pero necesita un elemento adicional. El juego debe finalizar cuando el jugador gana, de modo que necesita agregar un mtodo CheckForWinner() para comprobar si el jugador ha ganado.

Para agregar un mtodo que compruebe si el jugador gan


1. Agregue un mtodo CheckForWinner() al formulario, tal como se muestra en el siguiente cdigo. C# VB Copiar

''' <summary> ''' Check every icon to see if it is matched, by ''' comparing its foreground color to its background color. ''' If all of the icons are matched, the player wins ''' </summary> Private Sub CheckForWinner()

' Go through all of the labels in the TableLayoutPanel, ' checking each one to see if its icon is matched For Each control In TableLayoutPanel1.Controls Dim iconLabel As Label = TryCast(control, Label) If iconLabel IsNot Nothing Then If (iconLabel.ForeColor = iconLabel.BackColor) Then Return End If End If Next

' If the loop didnt return, it didn't find ' any unmatched icons ' That means the user won. Show a message and close the form MessageBox.Show("You matched all the icons!", "Congratulations")

Close()

End Sub

El mtodo utiliza otro bucle foreach en Visual C# o For Each en Visual Basic para recorrer cada etiqueta de TableLayoutPanel. Usa el operador de igualdad (== en Visual C# y = en Visual Basic) para comprobar el color del icono de cada etiqueta y si coincide con el fondo. Si los colores coinciden, el icono sigue siendo invisible y el jugador no ha hallado las parejas de los iconos restantes. En ese caso, el programa utiliza una instruccin return para omitir el resto del mtodo. Si el bucle pasa por todas las etiquetas sin ejecutar la instruccin return, indica que se han logrado hallar todas las parejas de iconos. El programa muestra un elemento MessageBox y, a continuacin, llama al mtodo Close() del formulario para finalizar el juego. 2. A continuacin, haga que el controlador del evento Click de la etiqueta llame al nuevo mtodo CheckForWinner(). Asegrese de que el programa comprueba si existe un ganador despus de mostrar el segundo icono en el que el jugador hace clic. Busque la lnea donde estableci el color del segundo icono en el que se ha hecho clic y llame al mtodo CheckForWinner() inmediatamente despus, tal como se muestra en el siguiente cdigo. C# VB Copiar

' If the player gets this far, the timer isn't ' running and firstClicked isn't Nothing, ' so this must be the second icon the player clicked ' Set its color to black secondClicked = clickedLabel secondClicked.ForeColor = Color.Black

' Check to see if the player won CheckForWinner()

' If the player clicked two matching icons, keep them

' black and reset firstClicked and secondClicked ' so the player can click another icon If (firstClicked.Text = secondClicked.Text) Then firstClicked = Nothing secondClicked = Nothing Return End If

3.

Guarde y ejecute el programa. Reproduzca el juego y halle las coincidencias de todos los iconos. Al ganar, el programa muestra un elemento MessageBox (tal como se muestra en la siguiente imagen) y, a continuacin, cierra el cuadro. Juego de formar parejas con MessageBox

Paso 9: Probar otras caractersticas


Visual Studio 2010 Para aprender ms, pruebe a cambiar los iconos y colores, y agregue una cuadrcula y sonidos. Para que el juego sea ms desafiante, pruebe a aumentar el tamao del tablero y a ajustar el temporizador.

Para probar otras caractersticas



Reemplace los iconos y colores con los que prefiera. Agregue una cuadrcula para que aparezca alrededor de los iconos.

Agregue un sonido para cuando el jugador encuentre una coincidencia, otro sonido para cuando destape dos iconos que no coincidan y un tercer sonido para cuando el programa vuelva a ocultar los iconos. Aumente el tamao del tablero para complicar ms el juego. (Sugerencia: no basta con solo agregar filas y columnas a TableLayoutPanel). Para que el juego sea ms desafiante, oculte el primer icono si el jugador es demasiado lento y no hace clic en el segundo icono a tiempo.