P. 1
Crear un juego de formar parejas (C

Crear un juego de formar parejas (C

|Views: 625|Likes:

More info:

Published by: Esteban Laime Gonzales on Feb 20, 2014
Copyright:Attribution Non-commercial

Availability:

Read on Scribd mobile: iPhone, iPad and Android.
download as DOCX, PDF, TXT or read online from Scribd
See more
See less

06/06/2015

pdf

text

original

Tutorial 3: Crear un juego de formar parejas (C#

)
Visual Studio 2012 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 después de iniciarse. Cuando termine, el programa se parecerá al de la ilustración 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 información específica del lenguaje de programación que use.

Temas relacionados
Título Paso 1: Crear un proyecto y agregar una tabla a un formulario Paso 2: Agregar un objeto aleatorio y una lista de iconos Paso 3: Asignar un icono Descripción El primer paso es crear el proyecto y agregar un control TableLayoutPanel.

Agregará un objeto Random y un objeto List, para crear una lista de iconos.

Asignará los iconos aleatoriamente a los controles Label.

4. Haga clic en el icono Aplicación de Windows Forms y. Probará otras características. (Seleccione la pestaña Web en el selector de colores para ver los nombres de los colores). seleccione C# o Visual Basic. haga clic en el botón de lista desplegable situado al lado de la propiedad y haga clic en el botón grande del medio. Si no usa Visual Studio Express.aleatorio a cada etiqueta Paso 4: Agregar un controlador de eventos Click a cada etiqueta Paso 5: Agregar referencias a etiquetas Paso 6: Agregar un temporizador Paso 7: Mantener visibles los pares Paso 8: Agregar un método para comprobar si el jugador ganó Paso 9: Probar otras características Agregará un controlador de eventos Click que cambiará el color de la etiqueta en la que se haga clic. Agregará un método CheckForWinner() para comprobar si el jugador ganó. Para crear un proyecto y agregar una tabla al formulario 1. En el menú Archivo. b. Agregará un temporizador al formulario. Intentará aumentar el tamaño del tablero y ajustar el temporizador. a continuación. Establezca la propiedad BackColor en CornflowerBlue. Haga clic en el botón del triángulo situado en la esquina superior derecha de TableLayoutPanel para mostrar el menú de tareas. Establezca la propiedad Dock en Fill. primero debe seleccionar un lenguaje. a. haga clic en Nuevo proyecto. . como cambiar los iconos y colores. Mantendrá los pares de iconos visibles si se selecciona una pareja coincidente. agregar una cuadrícula y agregar sonidos. Cambie la propiedad Text del formulario a Matching Game. Establezca las propiedades del formulario. c. Agregará variables de referencia para realizar el seguimiento de las etiquetas en las que se hace clic. b. a continuación. d. Paso 1: Crear un proyecto y agregar una tabla a un formulario Visual Studio 2012 El primer paso para crear un juego de formar parejas es crear el proyecto y agregar una tabla al formulario. Cambie el tamaño a 550 píxeles de ancho por 550 píxeles de alto mediante la propiedad Size o arrastre el mouse hasta que vea el tamaño correcto en la esquina inferior izquierda del entorno de desarrollo integrado (IDE). 3. a continuación. escriba el nombre MatchingGame. En la lista Plantillas instaladas. 5. haga clic dos veces enAgregar columna para agregar dos columnas más. Haga clic dos veces Agregar fila para agregar dos filas más y. para ello. Arrastre un control TableLayoutPanel desde el cuadro de herramientas y. 2. establezca sus propiedades: a.

6. e. g. Debería tener este aspecto: Formulario inicial del juego de formar parejas . Haga clic en el botón Aceptar. de modo que se usa esta fuente para mostrar los iconos que deben coincidir. 8. a continuación. abra el cuadro de herramientas y haga doble clic en Etiqueta para agregar un control Label al cuadrado superior izquierdo. Ya tiene diseñado el formulario. el IDE agrega una nueva fila a TableLayoutPanel para que haya espacio para agregar el nuevo control Label. Establezca la propiedad Text en la letra c. Siga pegando los controles Label hasta que se llenen todas las celdas. Establezca la propiedad Dock en Fill. Establezca sus propiedades: a. en el menú Edición. La acción se puede deshacer. el control Label debería estar seleccionado en el IDE. en el botón central. Debería aparecer un botón de puntos suspensivos. (Presione Ctrl+V o. Ahora. (Presione Ctrl+C o. Establezca la propiedad BackColor en CornflowerBlue. haga clic en Deshacer. Aparecerá otra etiqueta en la segunda celda de TableLayoutPanel. una N mayúscula es un ojo y una coma es una guindilla. aparecerá otra etiqueta en la tercera celda. d. 7. A continuación. Nota Si pega demasiadas veces. Con él seleccionado. pruebe a escribir letras diferentes para ver qué iconos se muestran. Establezca la propiedad AutoSize en False. Un signo de exclamación es una araña. Haga clic en el botón de puntos suspensivos y establezca la fuente en Webdings 72 point Bold. Ahora. Haga clic en la propiedad Font. péguelo. Nota La fuente Webdings es una fuente de iconos que se distribuye con el sistema operativo Microsoft Windows. 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. Vuelva a pegar el control. f. haga clic en Pegar). Seleccione el control Label y cópielo. e. Para quitar la nueva celda. haga clic en Copiar). haga clic en el botón Porcentaje y establezca el ancho de cada columna en el 25 por ciento del ancho total. Asegúrese de que el control TableLayoutPanel esté seleccionado en el editor de formularios. su control TableLayoutPanel debería tener dieciséis celdas cuadradas del mismo tamaño. En lugar de colocar c en la propiedad Text. Establezca la propiedad TextAlign en MiddleCenter haciendo clic en el botón de lista desplegable que se encuentra al lado de la propiedad y haciendo clic. En el juego de formar parejas. La celda superior izquierda de TableLayoutPanel debería contener un cuadro negro grande centrado sobre un fondo azul. c. A continuación. en el menú Edición. 9. b. Seleccione cada una de las columnas. Haga clic en Editar filas y columnas para abrir la ventana Estilos de columna y fila. en el menú Edición. presione Ctrl+Z o. el jugador necesita encontrar la correspondencia entre pares de iconos.

"b". Al escribir código de Visual C#. Para volver al tema de la información general. "k". 3. // Cada una de estas cartas es un icono interesante en la fuente Webdings. public partial class Form1 : Form { // Utilice este objeto aleatorio para elegir iconos aleatorios para las plazas Random random = new Random(). "k". coloque el código justo después de la declaración de clase ( Public Class Form1). Pase al editor de código haciendo clic con el botón secundario en Form1. Paso 2: Agregar un objeto aleatorio y una lista de iconos Visual Studio 2012 Es preciso utilizar dos instrucciones new para crear dos objetos y agregarlos al formulario. 2. Al agregar el objeto List. Ventana IntelliSense . y cada icono aparece dos veces en esta lista List<string> icons = new List<string>() { "!". El segundo es nuevo: un objeto List. "z". Aparecerá texto similar si agrega una lista en Visual Basic. vea Tutorial 4: Crear un juego de formar parejas.cs en el Explorador de solucionesy haciendo clic a continuación en Ver código en el menú. "!". observe atentamente la ventana IntelliSense que se abre. tenga en cuenta su funcionamiento. asegúrese de que coloca el código después de la llave de apertura y justo después de la declaración de clase (public partial class Form1 : Form).10.". vea Paso 2: Agregar un objeto aleatorio y una lista de iconos. ". "z" }. ". Antes de agregar el siguiente código para crear la lista. "v". "v". "b". Comience por escribir el código mostrado en el paso anterior. El siguiente es un ejemplo de Visual C#. Para agregar un objeto Random y una lista de iconos 1. "w". Para continuar o revisar   Para ir al siguiente paso del tutorial. "w". "N".". "N". Al escribir código de Visual Basic. El primero es un objetoRandom como el usado en el juego de la prueba de matemáticas.

Se puede tener un objeto List que contiene otros objetos List. no se puede agregar texto.Nota Es más sencillo comprender el código si se examina en secciones pequeñas. Sin embargo. Nota . Tampoco se pueden agregar números a una lista de valores true/false Nota Cuando crea un objeto List mediante una instrucción new.El objeto List tendrá dieciséis cadenas en total. Así que una lista de números solo puede contener números. En Visual Basic se debe crear primero una matriz temporal. que es lo que la información sobre herramientas de la parte derecha de la ventanaIntelliSense le indica. Una cadena es lo que su programa utiliza para almacenar texto. En este caso. Esto es porque Visual C# tiene inicializadores de colección. la lista se puede crear con una instrucción. Sus programas pueden utilizar objetos List para hacer el seguimiento de muchos elementos. el programa lo rellena con lo que haya entre las llaves. una vez creado el nuevo objeto List. Cada una de esas cadenas es una letra única y todas corresponden a los iconos que se mostrarán en las etiquetas. Así que el juego tendrá un par de signos de exclamación. Una lista puede contener números. un par de letras N en mayúscula. se obtiene una lista de cadenas denominadas iconos. En Visual Basic 2010. puede utilizar un inicializador de colección. por compatibilidad con la versión anterior de Visual Basic. recomendamos utilizar el código anterior. Además.Los elementos en una lista se llaman elementos y cada lista solo contiene elementos de un tipo. texto u otros objetos. la lista se inicializará para que contenga dieciséis cadenas. necesita indicar lo que desea que contenga. pero en Visual C#. Por eso la información sobre herramientas de la parte superior de la ventana IntelliSense muestra el tipo de elementos de la lista. etc. 4. valores true/false. una por cada celda de la TableLayoutPanel. Nota Al utilizar un inicializador de colección con una instrucción new. un par de comas. eso es lo que significa List<string> (en Visual C#) y List(Of String) (en Visual Basic): es un objeto List que contiene cadenas.

iconLabel. // iconLabel. } } } 2. Un bucle For Each se usa siempre que se desea realizar la misma acción una y otra vez. se obtiene el mismo resultado. Basta con que lo coloque debajo del código que agregó en Paso 2: Agregar un objeto aleatorio y una lista de iconos. Hay una novedad en el método AssignIconsToSquares(): un bucle foreach en Visual C# y For Each en Visual Basic.Count).En Visual Basic. Antes de agregar el siguiente código. (Una de las líneas está comentada intencionadamente. La primera línea crea una variable denominada control que almacena cada control uno a la vez mientras ese control tiene las instrucciones del bucle ejecutado en él. desea ejecutar las mismas instrucciones para cada etiqueta de TableLayoutPanel. algo que es importante en este programa.BackColor. icons. considere cómo funciona el método. Las listas pueden reducir y crecer según sea necesario. salvo que las matrices se crean con un tamaño fijo. Con este objetivo. Una matriz es similar a una lista.ForeColor = iconLabel. Para continuar o revisar   Para ir al siguiente paso del tutorial. Agregue el método AssignIconsToSquares() tal como se indica en el paso anterior. por lo que un icono se tiró al azar de la lista y se añade a cada etiqueta foreach (Control control in tableLayoutPanel1. se agrega un métodoAssignIconsToSquares(). que se convierte después en un objeto List.Controls) { . tal y como se observa en el siguiente código. Para asignar un icono aleatorio a cada etiqueta 1. vea Paso 1: Crear un proyecto y agregar una tabla a un formulario. Hay una nueva palabra clave:foreach en Visual C# y For Each en Visual Basic. Debe asignar los iconos de forma aleatoria a los controles Label del formulario. Paso 3: Asignar un icono aleatorio a cada etiqueta Visual Studio 2012 Si el juego siempre oculta los mismos iconos en las mismas ubicaciones.Controls) { Label iconLabel = control as Label. vea Paso 3: Asignar un icono aleatorio a cada etiqueta.RemoveAt(randomNumber). if (iconLabel != null) { int randomNumber = random. En este caso. no supone ningún reto.Next(icons. se explica al final de este procedimiento). /// <summary> /// Asigne a cada icono de la lista de iconos para un cuadrado al azar /// </summary> private void AssignIconsToSquares() { // El TableLayoutPanel tiene 16 etiquetas. foreach (Control control in tableLayoutPanel1. Para volver al paso anterior del tutorial. pero las cadenas se colocan primero en una matriz temporal. y la lista de iconos tiene 16 iconos.Text = icons[randomNumber].

El método 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. Para ello.// Las declaraciones que se deben ejecutar para cada etiqueta. La línea que es una instrucción de if que comprueba para asegurarse de que la conversión funcionó después. entra aquí Los estados utilizan iconLabel para acceder a las propiedades y métodos de cada etiqueta } Nota Se usan los nombres iconLabel y control porque son descriptivos.RemoveAt(randomNumber). Esta línea también utiliza la propiedad de Count de la lista de icons para determinar el intervalo de que elegir el número aleatorio. de modo que el formulario llame a su nuevo método para prepararse antes de mostrarse. C# public Form1() { InitializeComponent(). agregue una instrucción bajo la llamada al método InitializeComponent() en el constructor Form1. icons. iconLabel. y funcionaría exactamente igual cuando cambió el nombre en cada instrucción dentro del bucle. La primera línea de la instrucción de if crea una variable denominada randomNumber que contenga un número aleatorio que corresponde a uno de los elementos de la lista de los iconos. } 3. Si funciona la conversión.BackColor. // iconLabel.ForeColor = iconLabel. Label iconLabel = control as Label. if (iconLabel != null) { int randomNumber = random.Text = icons[randomNumber]. Recuerde que. la línea siguiente asigna uno de los elementos de la lista de iconos a la propiedad de Text de la etiqueta. AssignIconsToSquares(). Puede sustituir estos nombres con cualquier nombre.Next(icons. la última línea de la instrucción de if quita de la lista el icono que se ha agregado al formulario. las instrucciones en la ejecución de la instrucción de if . Finalmente. Necesita llamar al método AssignIconsToSquares() en cuanto se inicie el programa.Count). utiliza el método de Next del objeto de Random que creó anteriormente. este código se reproduce aquí. (Por eso incluyó dos iconos de cada en la lista. la primera línea convierte la variable de control a Label denominado iconLabel. para que hubiera un par de iconos asignado a los controles Label aleatorios. Si escribe código de Visual C#. puede colocar el puntero del mouse sobre un elemento de código y revisar la información sobre herramientas resultante. el método de Next devuelve el número aleatorio.) Considere más detenidamente el código que se ejecuta dentro del bucle de foreach o de For Each . La línea con comentarios se explica más adelante en este tema. . si no está seguro sobre lo que alguna parte del código.

5. a continuación. VB Public Sub New() ' Esta llamada es requerida por el Diseñador de Windows Forms InitializeComponent() ' Agregar cualquier inicialización después de la llamada InitializeComponent () End Sub Agregue la llamada al método AssignIconsToSquares() de modo que el constructor sea similar al siguiente. a continuación. Cierre el programa y. Al presionar la tecla ENTRAR para pasar a la línea siguiente. Antes del método AssignIconsToSquares() que acaba de crear. debería mostrar un formulario con iconos aleatorios asignados a cada etiqueta. Juego de formar parejas con iconos aleatorios 6. Guarde el programa y ejecútelo. VB Public Sub New() ' Esta llamada es requerida por el Diseñador de Windows Forms InitializeComponent() ' Agregar cualquier inicialización después de la llamada InitializeComponent () AssignIconsToSquares() End Sub 4.} Para Visual Basic.ForeColor = iconLabel. Ahora detenga el programa y quite los comentarios de la línea de código dentro del bucle For Each. como se muestra en la siguiente ilustración. IntelliSense debería hacer que apareciese el siguiente código para completar el constructor. Ahora. empiece escribiendo el código Public Sub New(). primero agregue el constructor y. ejecútelo de nuevo.BackColor. Ahora hay iconos diferentes asignados a cada etiqueta. . agregue al constructor la llamada al método. iconLabel.

no se ven. Cuando un jugador hace clic en uno de los cuadrados con icono oculto.7. Presione ENTRAR. agregue un controlador de eventos Click que cambie el color de la etiqueta en la que se hace clic. A continuación. Para ir al siguiente paso del tutorial. el programa muestra el icono al jugador cambiando a negro su color. vaya a la página Eventos de la ventana Propiedades. Ventana Propiedades con el evento Click 2. se vuelven a ocultar. A continuación. permanecen visibles. 3. como se muestra en la siguiente ilustración. mantenga presionada la tecla CTRL mientras hace clic en cada una de las otras etiquetas para seleccionarlas. 2. Asegúrese de que todas las etiquetas están seleccionadas. ejecútelo. Para agregar un controlador de eventos Click a cada etiqueta 1. 4. Si los iconos coinciden. Rellene el resto del código como se indica a continuación: . 3. Para volver al paso anterior del tutorial. vea Paso 4: Agregar un controlador de eventos Click a cada etiqueta. vea Paso 2: Agregar un objeto aleatorio y una lista de iconos. el jugador hace clic en otro icono oculto. a continuación. En caso contrario. El IDE agrega al código un controlador de eventos Click denominado label_Click() y lo enlaza a cada una de las etiquetas. Vaya al Diseñador de Windows Forms y haga clic en el primer control Label para seleccionarlo. Desplácese hacia abajo hasta el evento Click y escriba label_Click en el cuadro. Para continuar o revisar   Paso 4: Agregar un controlador de eventos Click a cada etiqueta Visual Studio 2012 El juego de formar parejas funciona como sigue: 1. Debido a que los iconos tienen el mismo color que el fondo. Parece que los iconos han desaparecido (únicamente se muestra un fondo azul). Haga clic en el botón Guardar todo de la barra de herramientas para guardar el programa y. los iconos se asignan aleatoriamente y siguen ahí. Sin embargo. Para conseguir que un programa funcione así. A continuación.

Dado que el método necesita saber en qué etiqueta se hizo clic. Si no se ha hecho clic en el icono. se ha hecho clic en el icono. Este método comprueba primero si clickedLabel se convirtió (mediante conversión de tipos) correctamente de un objeto en un control Label. tiene un valor Null (C#) o Nothing (Visual Basic). se tiene acceso a sus propiedades y métodos. del tutorial para crear una prueba matemática. La primera línea del método indica al programa que no es solo un objeto. el método comprueba el color del texto de la etiqueta en la que se hizo clic mediante la propiedad ForeColor. Si no. de modo que se llama al mismo método con independencia de la etiqueta en la que haga clic el usuario. EventArgs e) { Label clickedLabel = sender as Label. y no se desea ejecutar el resto del código en el método./// <summary> /// Evento Click de cada etiqueta es manejado por este controlador de eventos /// </summary> /// <param name="sender"> La etiqueta que se hizo clic </ param> /// <param name="e"></param> private void label_Click(object sender. (Esto es lo que hace la instrucción return: indica al programa que deje de ejecutar el método). clickedLabel.Black) return. un control Label y que.Black. Para ir al siguiente paso del tutorial. Debería ver un formulario vacío con un fondo azul. if (clickedLabel != null) { // Si hace clic en la etiqueta es de color negro. vea Paso 3: Asignar un icono aleatorio a cada etiqueta. cambia el color del texto a negro. vea Paso 5: Agregar referencias a etiquetas.ignore el clic if (clickedLabel. 5. Haga clic en el formulario. el jugador hace clic en un icono que ya ha sido revelado . deberían aparecer.ForeColor == Color. uno de los iconos debería volverse visible. en concreto. Luego. Guarde y ejecute el programa. Siga haciendo clic en distintos lugares del formulario. usa el nombre sender para ese control Label. sino que es. de modo que el método ha terminado. Para volver al paso anterior del tutorial. Si ya es negro. Enlazó distintos eventos Clic del control Label a un único método de controlador de eventos. Para continuar o revisar   Paso 5: Agregar referencias a etiquetas Visual Studio 2012 . a través del nombre clickedLabel. } } Nota Es posible que reconozca. el elemento object sender que se muestra en la parte superior del controlador de eventos. A medida que hace clic en los iconos.ForeColor = Color.

objetos List y objetos Random) a un formulario.El programa necesita realizar un seguimiento de los controles Label en los que el usuario hace clic. se establece en un valor especial: null en Visual C# y Nothing en Visual Basic. los vuelve a ocultar. Modifique el controlador de eventos Click para usar la nueva variable de referencia firstClicked. pero será nula si el jugador no ha hecho clic en un sello Label firstClicked = null. estas instrucciones no hacen aparecer dos controles Label adicionales en el formulario porque ninguna de las dos instrucciones incluye new. if (clickedLabel != null) { . Después de que se haga clic en la primera etiqueta. Nota Las variables de referencia parecen similares a las instrucciones usadas para agregar objetos (por ejemplo. // puntos secondClicked al segundo control Label que el jugador hace clic Label secondClicked = null. Quite la última instrucción del método de control de eventos label_Click() (clickedLabel.ForeColor = Color. lo que significa que las variables no realizan ningún tipo de seguimiento. EventArgs e) { Label clickedLabel = sender as Label. el programa muestra ambos iconos durante unos instantes y.Black. objetos Timer. use el siguiente código. Sin new. no se crea ningún objeto. cuando se inicia el programa. public partial class Form1 : Form { // firstClicked apunta al primer control Label que el jugador hace clic. Sin embargo. el programa muestra el correspondiente icono. 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.) /// <summary> /// Evento Click de cada etiqueta es manejado por este controlador de eventos /// </summary> /// <param name="sender"> La etiqueta que se hizo clic </ param> /// <param name="e"></param> private void label_Click(object sender. Nota Cuando una variable no realiza el seguimiento de ningún objeto. Por ello. Por lo tanto. y la instrucción completa de if . (Asegúrese de incluir el comentario. Después de que se haga clic en la segunda etiqueta. a continuación. Para agregar referencias de etiqueta 1. ) y reemplácela por la instrucción if que figura a continuación. el valor de firstClicked y el valor de secondClicked están establecidos en null o Nothing. 2. Para agregar referencias de etiqueta a un formulario. firstClicked y secondClicked se denominan variables de referencia: simplemente realizan un seguimiento o hacen referencia a objetos Label.

el jugador hace clic en un icono que ya ha sido revelado . // Si firstClicked es nulo.// Si hace clic en la etiqueta es de color negro. Haga clic en el siguiente control Label y verá que no sucede nada.ForeColor = Color. firstClicked.ForeColor == Color. este es el primer icono en la par que el jugador hace clic. } } } 3. por lo que el valor de firstClicked no es null en Visual C# ni Nothing en Visual Basic. concluye que no tiene ese valor y no ejecuta las instrucciones de la instrucción if.Black.Black) return. y el retorno if (firstClicked == null) { firstClicked = clickedLabel. vea Paso 6: Agregar un temporizador.Por lo tanto. 4.ignore el clic if (clickedLabel. vea Paso 4: Agregar un controlador de eventos Click a cada etiqueta. Guarde y ejecute el programa. Paso 6: Agregar un temporizador Visual Studio 2012 . Juego de formar parejas con un icono visible Para continuar o revisar   Para ir al siguiente paso del tutorial. return. Para volver al paso anterior del tutorial. tal y como se muestra en la siguiente imagen. por lo establecido firstClicked a la etiqueta que el jugador hace clic. El programa ya está realizando un seguimiento de la primera etiqueta en la que se hizo clic. solo el primer icono en el que se hizo clic se vuelve negro y los demás iconos se vuelven invisibles. Cuando la instrucción if comprueba firstClicked para determinar si su valor es null o Nothing. Haga clic en uno de los controles Label y aparecerá el correspondiente icono. cambie su color a negro.

detiene el temporizador mediante una llamada al método Stop().ForeColor = secondClicked.ForeColor = firstClicked. No deseará que el temporizador se inicie cuando se inicie el programa. el programa sabe que es el primer clic firstClicked = null. pero deje la propiedad Enabled establecida en False. EventArgs e) { // Detenga el temporizador timer1. A continuación. Haga clic en el icono timer1 para seleccionar el temporizador. Vaya al cuadro de herramientas del Diseñador de Windows Forms. Haga doble clic en Temporizador (en la categoría Componentes) y agregue un temporizador al formulario. de modo que aquí se indica al temporizador que espere tres cuartos de segundo (750 milisegundos) antes de desencadenar su primer evento Tick. La propiedad Interval indica al temporizador cuánto tiempo debe esperar entre los pasos. para recuperar las dos etiquetas en las que el jugador hizo clic y volver a ocultar sus iconos. Finalmente. 3. su icono aparece en un cuadro deshabilitado bajo el formulario. /// <summary> /// Este temporizador se inicia cuando el jugador hace clic en dos iconos que no coinciden. } El controlador de eventos Tick realiza tres acciones: primero. como se muestra en la siguiente ilustración. restablece las . secondClicked. Establezca la propiedad Interval en 750. utilizará el método Start() para iniciar el temporizador cuando el jugador haga clic en la segunda etiqueta.BackColor. como se muestra en el siguiente código. por lo que cuenta con tres cuartas partes de un segundo y luego se apaga y se esconde dos iconos /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void timer1_Tick(object sender. firstClicked y secondClicked. // Cambiar firstClicked y secondClicked por lo que la próxima vez que se hace clic en una etiqueta. En su lugar. usa las dos variables de referencia. // Ocultar ambos iconos firstClicked. agregará un temporizador al juego de formar parejas.A continuación. secondClicked = null. Temporizador 2.BackColor. Haga doble clic en el icono del control Timer en el Diseñador de Windows Forms para agregar el controlador de eventos Tick. Para agregar un temporizador 1.Stop().

porque así es como se restablece el propio programa. Label clickedLabel = sender as Label.Esto es importante. el jugador hace clic en un icono que ya ha sido revelado . el resto del método no cambia).ForeColor == Color. cambie su color a negro. y el retorno if (firstClicked == null) { firstClicked = clickedLabel. no inicia los pasos hasta que se llama a su método Start(). un temporizador desencadena una y otra vez su evento Tick.variables de referencia firstClicked y secondClicked en null en Visual C# y Nothing en Visual Basic.Black) return. // Si firstClicked es nulo. este es el primer icono en la par que el jugador hace clic. así que ignora los clics si el temporizador está en marcha if (timer1. (Se agrega una instrucción if al principio y tres instrucciones al final. cuando se llama al método Start().Enabled == true) return.ignore el clic if (clickedLabel.Black. Sin embargo. inicia los pasos nada más comenzar el programa. Es posible que haya observado cómo se llama al método Stop() del temporizador dentro del evento Tick. EventArgs e) { // El temporizador sólo después de dos iconos no coincidentes se ha demostrado que el jugador. Nota Un objeto Timer tiene un método Start() que inicia el temporizador y un método Stop() que lo detiene. utilizando la propiedad Interval para determinar cuántos milisegundos debe esperar entre los pasos. espera durante el intervalo correspondiente y desencadena un único evento Tick. if (clickedLabel != null) { // Si hace clic en la etiqueta es de color negro. firstClicked. /// <summary> /// Evento Click de cada etiqueta es manejado por este controlador de eventos /// </summary> /// <param name="sender"> La etiqueta que se hizo clic </ param> /// <param name="e"></param> private void label_Click(object sender. Nota Normalmente. si se deja establecido en False. . Al establecer la propiedad Enabled del temporizador en True en la ventana Propiedades. por lo establecido firstClicked a la etiqueta que el jugador hace clic. Para ver el nuevo temporizador en acción. Ahora no realiza el seguimiento de ningún control Label y vuelve a estar listo para el primer clic del jugador. de tal forma que. vaya al editor de código y agregue el siguiente código al principio y al final del método de control de eventos label_Click(). 4.ForeColor = Color. Esto hace que el temporizador entre en modo de un disparo.

Para mantener las parejas visibles 1.Black. Guarde y ejecute el programa. Agregue la siguiente instrucción if al método de control de eventos label_Click(). // Si el jugador obtiene este momento. el juego se debería restablecer automáticamente para dejar de realizar el seguimiento de cualquier etiqueta mediante las variables de referencia firstClicked ysecondClicked.Start(). sin restablecer los colores de las dos etiquetas en las que se hizo clic. Así. a continuación. inicia el temporizador en modo de un disparo de forma que espere durante 750 milisegundos antes de desencadenar el evento Tick. así que empieza el temporizador (que esperar tres cuartos de segundo y. vea Paso 7: Mantener visibles los pares. por lo que este debe ser el segundo icono el jugador hizo clic en Set su color a negro secondClicked = clickedLabel. piense qué sucedería si el jugador hace clic en una pareja coincidente. por lo que este debe ser el segundo icono el jugador hizo clic en Set su color a negro secondClicked = clickedLabel. y establece el color del icono de esa etiqueta en negro para que esté visible. Sin embargo. Repita el proceso varias veces. si el jugador hace clic en el primer y segundo control Label y se inicia el temporizador. Haga clic en otro icono. El código que se encuentra al principio del método comprueba si el temporizador se inició en la propiedad Enabled. Para ir al siguiente paso del tutorial. Para volver al paso anterior del tutorial. . a continuación. } // Si el jugador obtiene este momento.return. Observe cómo funciona. El código al final del método establece la variable de referencia secondClicked para que realice el seguimiento del segundo control Label en el que hizo clic el jugador. Es entonces cuando el controlador de eventos Tick del temporizador oculta los dos iconos y restablece las variables de referenciafirstClicked y secondClicked de modo que el formulario esté listo para que el jugador haga clic en otro icono. // Si el jugador consigue a este punto. A continuación. no sucederá nada al hacer clic en un tercer control. Ahora. el formulario realiza el seguimiento del primer y segundo icono en los que hizo clic. justo encima de la instrucción donde se inicia el temporizador. secondClicked. el jugador hace clic en dos iconos diferentes. el temporizador no está funcionando y firstClicked no es nulo. En lugar de hacer que los iconos desaparezcan activando el temporizador (con el método Start()). 6. el temporizador no está funcionando y firstClicked no es nulo.ForeColor = Color. Aparece brevemente y. Para continuar o revisar   Paso 7: Mantener visibles los pares Visual Studio 2012 El juego funciona bien siempre y cuando el jugador haga clic solo en los pares de iconos que no coinciden. casi al final. y usa el temporizador para realizar una pausa antes de hacer que los iconos desaparezcan. } } 5. ambos iconos desaparecen. ocultar los iconos) timer1. Observe el código minuciosamente mientras lo agrega al programa. Haga clic en un icono para que se vuelva visible. vea Paso 5: Agregar referencias a etiquetas.

Text = secondClicked. } } La primera línea de la instrucción 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.Black. } // Si el jugador consigue a este punto. que indica al programa que omita el resto de las instrucciones del método sin ejecutarlas. La tercera es una instrucción return. VB firstClicked = Nothing C# firstClicked = null. Si los iconos son iguales. el jugador hace clic en dos iconos diferentes.secondClicked. Observe minuciosamente el código que se encuentra entre paréntesis en la instrucción if. return.Text == secondClicked.Text A continuación. (Quizás reconozca esas dos instrucciones por el controlador de eventos Tick del temporizador).Start(). Aquí tiene un buen ejemplo donde se ve la diferencia. estableciendo la variable de referencia firstClicked en null para . La primera de esas dos instrucciones comprueba si dos iconos son iguales. secondClicked = null. mientras que otras instrucciones usan dos (==). ocultar los iconos) timer1. el programa ejecuta las tres instrucciones entre llaves en C# o las tres instrucciones incluidas en la instrucción if en Visual Basic.Text C# firstClicked. VB firstClicked. Piense por qué se usa = en algunos lugares y== en otros. mantenerlos negro y restablecer firstClicked y secondClicked por lo que el jugador puede hacer clic en otro icono if (firstClicked. examine con detalle la primera instrucción del bloque de código situado después de la instrucción if. el programa de Visual C# usa el operador de igualdad ==. // Si el jugador hace clic en dos iconos iguales.Text) { firstClicked = null. Si programa en Visual C#.ForeColor = Color.Text == secondClicked. quizás haya observado que en una parte del código se usa un solo signo de igualdad (=). Dado que se comparan dos valores. Las dos primeras instrucciones restablecen las variables de referencia firstClicked y secondClicked para que no realicen el seguimiento de ninguna de las etiquetas. así que empieza el temporizador (que esperar tres cuartos de segundo y. La segunda instrucción en realidad cambia el valor (lo que se conoce como asignación). a continuación.

y ambos iconos desaparecen. Paso 8: Agregar un método para comprobar si el jugador ganó Visual Studio 2012 Ha creado un juego divertido. if (iconLabel != null) . Juego de formar parejas con pares de iconos visibles Para continuar o revisar   Para ir al siguiente paso del tutorial. de modo que necesita agregar un método CheckForWinner() para comprobar si el jugador ha ganado. Visual C# usa = para establecer los valores y == para compararlos. y empiece a hacer clic en el formulario. Si hace clic en una pareja que no coincide. Agregue un método CheckForWinner() al formulario. Para agregar un método que compruebe si el jugador ganó 1.2. de modo que los iconos se mantengan visibles. el jugador gana /// </summary> private void CheckForWinner() { // Ir a través de todas las etiquetas de TableLayoutPanel. vea Paso 6: Agregar un temporizador. En Visual Basic se usa = tanto para la asignación como para la comparación. El juego debe finalizar cuando el jugador gana. Para volver al paso anterior del tutorial. Por eso se usa en este caso el operador de asignación =. la comprobación de cada uno para ver si su icono se corresponde foreach (Control control in tableLayoutPanel1. pero necesita un elemento adicional. Guarde y ejecute el programa. se desencadena el evento Tick del temporizador. /// Si todos los iconos se emparejan. comparando su color de primer plano a su color de fondo. vea Paso 8: Agregar un método para comprobar si el jugador ganó. /// <summary> /// Compruebe cada icono para ver si coincide. tal como se muestra en el siguiente código. Si hace clic en una pareja coincidente. se ejecuta la nueva instrucción if y la instrucción return hace que el método omita el código que inicia el temporizador.Controls) { Label iconLabel = control as Label. como se muestra en la siguiente ilustración. restablecerlo.

// Si el jugador obtiene este momento.BackColor) return. } 3. Mostrar un mensaje y cerrar el formulario MessageBox. el temporizador no está funcionando y firstClicked no es nulo. Si los colores coinciden. secondClicked. return. por lo que este debe ser el segundo icono el jugador hizo clic en Set su color a negro secondClicked = clickedLabel.ForeColor = Color. cierra el cuadro. el icono sigue siendo invisible y el jugador no ha hallado las parejas de los iconos restantes. // Revise para ver si el jugador ganó CheckForWinner().Text) { firstClicked = null. llama al método Close() del formulario para finalizar el juego. indica que se han logrado hallar todas las parejas de iconos. Si el bucle pasa por todas las etiquetas sin ejecutar la instrucción return. Close(). el programa utiliza una instrucción return para omitir el resto del método. 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. Asegúrese de que el programa comprueba si existe un ganador después de mostrar el segundo icono en el que el jugador hace clic. Juego de formar parejas con MessageBox . Reproduzca el juego y halle las coincidencias de todos los iconos. El método utiliza otro bucle foreach en Visual C# o For Each en Visual Basic para recorrer cada etiqueta de TableLayoutPanel.Black. Guarde y ejecute el programa. haga que el controlador del evento Click de la etiqueta llame al nuevo método CheckForWinner(). El programa muestra un elemento MessageBox y.Show("You matched all the icons!". a continuación. } 2. // Si el jugador hace clic en dos iconos iguales. secondClicked = null. mantenerlos negro y restablecer firstClicked y secondClicked por lo que el jugador puede hacer clic en otro icono if (firstClicked.Text == secondClicked.{ if (iconLabel. tal como se muestra en el siguiente código. Busque la línea donde estableció el color del segundo icono en el que se ha hecho clic y llame al método CheckForWinner() inmediatamente después. el programa muestra un elemento MessageBox (tal como se muestra en la siguiente imagen) y. } } // Si el bucle no volvió. a continuación. En ese caso. A continuación. no se encontró ningún icono sin igual // Eso significa que el usuario ganó. "Congratulations").ForeColor == iconLabel. Al ganar.

aspx . otro sonido para cuando destape dos iconos que no coincidan y un tercer sonido para cuando el programa vuelva a ocultar los iconos. Para ir al tutorial siguiente.microsoft. Agregue un sonido para cuando el jugador encuentre una coincidencia. Para que el juego sea más desafiante. pruebe a aumentar el tamaño del tablero y a ajustar el temporizador. pruebe a cambiar los iconos y colores. vea (pendiente de agregar el vínculo).Para continuar o revisar   Para ir al siguiente paso del tutorial. y agregue una cuadrícula y sonidos. oculte el primer icono si el jugador es demasiado lento y no hace clic en el segundo icono a tiempo. Para continuar o revisar   http://msdn. Aumente el tamaño del tablero para complicar más el juego.com/es-es/library/dd553235(v=vs. Agregue una cuadrícula para que aparezca alrededor de los iconos. Para volver al paso anterior del tutorial. Paso 9: Probar otras características Visual Studio 2012 Para aprender más. vea Paso 7: Mantener visibles los pares. (Sugerencia: no basta con solo agregar filas y columnas a TableLayoutPanel).110). Para volver al paso anterior del tutorial. vea Paso 8: Agregar un método para comprobar si el jugador ganó. vea Paso 9: Probar otras características. Para probar otras características      Reemplace los iconos y colores con los que prefiera. Para que el juego sea más desafiante.

You're Reading a Free Preview

Download
scribd
/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->