Crear un juego de Hangman Interacción del usuario

En esta serie, estamos creando un juego de Hangman para la plataforma Android. Hasta ahora, hemos construido la interfaz de usuario de la aplicación, que incluye imágenes, dibujos y diseños. En esta tercera y última entrega, nos centraremos en la interacción del usuario..


Introducción

Agregar la interacción del usuario al juego implica varios aspectos, que incluyen detectar si el usuario gana o pierde un juego y responder a cada evento. También agregaremos un botón de ayuda a la barra de acción y la capacidad de navegar por el juego..

Para refrescar tu memoria, así es como se verá el juego final.



1. Prepare la interfaz de usuario

Paso 1

Como vimos en el tutorial anterior, la actividad del juego presenta el área de la horca con las seis partes del cuerpo dibujadas en la pantalla. Cuando comienza un nuevo juego, las partes del cuerpo deben estar ocultas, solo mostrarlas cuando el usuario hace una suposición incorrecta. Abra la clase de actividad del juego y comience agregando las siguientes instrucciones de importación..

importar android.app.AlertDialog; importar android.content.DialogInterface; importar android.support.v4.app.NavUtils; importar android.view.Menu; importar android.view.MenuItem; importar android.view.View; importar android.widget.ImageView;

A continuación, declare cinco variables de instancia en la interfaz de la clase..

// body part images private ImageView [] bodyParts; // número de partes del cuerpo privado int numParts = 6; // parte actual: se incrementará cuando se elijan respuestas incorrectas private int currPart; // número de caracteres en la palabra actual private int numChars; // número adivinado correctamente int int numCorr;

Puede cambiar la cantidad de partes del cuerpo si, por ejemplo, le gustaría agregar varios niveles de dificultad al juego. Almacenando la parte del cuerpo actual (currPart), podemos agregar una parte del cuerpo a la vez en caso de que el jugador haga una suposición incorrecta. Usamos el recuento de letras de la palabra objetivo y el número de conjeturas correctas para realizar un seguimiento del progreso del jugador en el juego actual. Periódicamente verificamos si el jugador ha ganado o perdido el juego..

En el onCreate Método de la clase de actividad del juego, justo antes de invocar. jugar un juego, creamos una instancia de la matriz de visualización de imágenes y recuperamos las imágenes de la parte del cuerpo que colocamos en el diseño. Este fragmento de código también determina el orden en que se muestran las partes del cuerpo cuando el jugador realiza una suposición errónea. Comenzamos con la cabeza y terminamos con las piernas..

bodyParts = new ImageView [numParts]; bodyParts [0] = (ImageView) findViewById (R.id.head); bodyParts [1] = (ImageView) findViewById (R.id.body); bodyParts [2] = (ImageView) findViewById (R.id.arm1); bodyParts [3] = (ImageView) findViewById (R.id.arm2); bodyParts [4] = (ImageView) findViewById (R.id.leg1); bodyParts [5] = (ImageView) findViewById (R.id.leg2);

Paso 2

En el jugar un juego Método, agregue el siguiente fragmento de código. Nosotros fijamos currPart a 0, conjunto numChars a la longitud de la palabra de destino, y establecer numCorr a 0.

currPart = 0; numChars = currWord.length (); numCorr = 0;

Antes de comenzar el juego, las partes del cuerpo deben estar ocultas.

para (int p = 0; p < numParts; p++)  bodyParts[p].setVisibility(View.INVISIBLE); 

La siguiente captura de pantalla muestra cómo debería verse el juego cuando un nuevo juego está por comenzar..



2. Responde a los clics del usuario

Paso 1

Cuando creamos el diseño para los botones de letras, declaramos un al hacer clic método. Añadamos esto a la actividad del juego..

public void letterPressed (Vista de vista) // el usuario ha presionado una letra para adivinar

Cuando el jugador toca un botón de letra para hacer una conjetura, letra presionada Recibe una referencia a la vista. Esto nos permite averiguar qué letra ha elegido el jugador. Para saber qué letra ha tocado el jugador, usamos el siguiente fragmento de código.

String ltr = (vista (TextView)) .getText (). ToString ();

A continuación, obtenemos el carácter de la cadena..

char letterChar = ltr.charAt (0);

También deshabilitamos el botón de la letra y actualizamos el dibujable de fondo para mostrar al jugador que la letra ya se ha jugado..

view.setEnabled (false); view.setBackgroundResource (R.drawable.letter_down);

En el siguiente paso, repasamos los caracteres de la palabra de destino para verificar si la suposición del jugador está en ella. Cada letra de la palabra objetivo se compara con la conjetura del jugador. Si la suposición del jugador coincide con una letra en la palabra objetivo, incrementamos numCorr, conjunto correcto a cierto para indicar que el jugador hizo una buena suposición, y actualice el color del texto de la letra de blanco a negro para que sea visible. los para el bucle continúa hasta que se haya comprobado cada letra de la palabra de destino. Esto es importante ya que una letra puede aparecer más de una vez en la palabra objetivo.

boolean correcto = falso; para (int k = 0; k < currWord.length(); k++)  if(currWord.charAt(k)==letterChar) correct = true; numCorr++; charViews[k].setTextColor(Color.BLACK);  

Paso 2

A continuación, debemos verificar si el jugador ha ganado o perdido el juego después de su conjetura o si ha realizado una conjetura incorrecta, pero aún puede continuar. Todavía dentro letra presionada, Comience por comprobar si el jugador ha hecho una buena suposición.

si (correcto) // conjetura correcta

Si hizo una buena suposición, compruebe si ha adivinado todas las letras de la palabra objetivo.

if (numCorr == numChars) // el usuario ha ganado

Si esto es cierto, notificamos al jugador que ella ha ganado el juego. Lo primero que hacemos es deshabilitar los botones de letras. Hacemos esto implementando otro método de ayuda., disableBtns. Implementar este método después de letra presionada.

public void disableBtns () int numLetters = letters.getChildCount (); para (int l = 0; l < numLetters; l++)  letters.getChildAt(l).setEnabled(false);  

En disableBtns, Recorremos las vistas a través del adaptador y desactivamos cada botón. Si el usuario ha ganado el juego, invocamos. disableBtns y mostrar un diálogo de alerta al usuario. En el cuadro de diálogo de alerta, también le preguntamos al jugador si quiere jugar otro juego..

Tómese un momento para revisar esto si no está familiarizado con los diálogos en Android. Establecemos las propiedades, incluidos el título y un mensaje que incluye la confirmación de la respuesta correcta. Añadimos un botón para volver a jugar en el cuadro de diálogo de alerta, que llama al jugar un juego método. También agregamos un botón para salir, lo que lleva al jugador a la actividad principal.

if (numCorr == numChars) // Inhabilitar botones disableBtns (); // Mostrar el diálogo de alerta AlertDialog.Builder winBuild = new AlertDialog.Builder (this); winBuild.setTitle ("YAY"); winBuild.setMessage ("¡Ganas! \ n \ nLa respuesta fue: \ n \ n" + currWord); winBuild.setPositiveButton ("Play Again", nuevo DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) GameActivity.this.playGame ();); winBuild.setNegativeButton ("Salir", nuevo DialogInterface.OnClickListener () public void onClick (diálogo DialogInterface, int id) GameActivity.this.finish ();); winBuild.show (); 

Paso 3

Si el usuario no ha ganado el juego, debemos verificar si ha respondido incorrectamente, pero aún nos quedan algunas conjeturas. Dentro de si no bloque, mostramos la siguiente parte del cuerpo e incrementamos el número de conjeturas incorrectas con 1.

if (correcto) // adivinar correctamente else if (currPart < numParts)  //some guesses left bodyParts[currPart].setVisibility(View.VISIBLE); currPart++; 

Etapa 4

Después de la si no, Podemos asumir con seguridad que el jugador ha perdido el juego. Comenzamos por deshabilitar los botones como lo hicimos anteriormente y mostramos un diálogo de alerta que indica que el jugador ha perdido el juego. También incluimos la respuesta correcta y ofrecemos la opción de jugar otro juego..

else // el usuario ha perdido disableBtns (); // Mostrar el diálogo de alerta AlertDialog.Builder loseBuild = new AlertDialog.Builder (this); loseBuild.setTitle ("OOPS"); loseBuild.setMessage ("¡Usted pierde! \ n \ nLa respuesta fue: \ n \ n" + currWord); loseBuild.setPositiveButton ("Play Again", nuevo DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) GameActivity.this.playGame ();); loseBuild.setNegativeButton ("Exit", new DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) GameActivity.this.finish ();); loseBuild.show (); 

Lo creas o no, hemos terminado de implementar el aspecto de interacción con el usuario del juego. Todo lo que nos queda por hacer es agregar algunas mejoras a la interfaz.



3. Completa la barra de acción.

Paso 1

Terminemos este tutorial agregando un botón de ayuda a la barra de acción. No voy a entrar en demasiados detalles, pero siéntase libre de experimentar con esto en sus propias aplicaciones. Dependiendo de los niveles de API a los que te dirijas, el soporte para navegar por medio de la barra de acción se proporciona con poca o ninguna codificación. Para asegurarse de que la barra de acción permita volver a la actividad principal, agregue lo siguiente dentro de onCreate Método en la actividad del juego..

getActionBar (). setDisplayHomeAsUpEnabled (true);

En el manifiesto, recuerde que especificamos la actividad principal como el padre de la actividad del juego. Esto le dice al sistema operativo que navegar hacia atrás / arriba desde la actividad del juego debería hacer que el usuario vuelva a la actividad principal. Su proyecto debe tener un recurso de menú principal. Ábralo y eche un vistazo a su contenido. De forma predeterminada, tendrá una acción de configuración, que no necesitamos para nuestro juego. Inserte el siguiente fragmento de código, para agregar un botón de ayuda.

Recuerda que listamos el ícono de ayuda en el primer tutorial de esta serie. Puede agregar más botones a su barra de acción más tarde si lo desea. Si lo hace, deberá ampliar el código de actividad que cubrimos a continuación..

No necesitamos las funciones de la barra de acción en la actividad principal, por lo que si Eclipse agrega el onCreateOptionsMenu Método a su clase de actividad principal, siéntase libre de eliminarlo.

Paso 2

De vuelta en la actividad del juego, configura la pantalla para usar el menú principal agregando el siguiente método.

@Override public boolean onCreateOptionsMenu (Menú) getMenuInflater (). Inflate (R.menu.main, menu); devuelve verdadero 

Agregue otro método para especificar lo que debería suceder cuando el usuario intente navegar hacia atrás / arriba o presione el botón de ayuda en la barra de acción.

@Override public boolean onOptionsItemSelected (elemento MenuItem) switch (item.getItemId ()) case android.R.id.home: NavUtils.navigateUpFromSameTask (this); devuelve verdadero caso R.id.action_help: showHelp (); devuelve verdadero  return super.onOptionsItemSelected (item); 

Navegar hacia arriba llevará al usuario a la actividad principal. los android.R.id.home La acción corresponde a la llamada a setDisplayHomeAsUpEnabled añadimos en onCreate.

Paso 3

Agregue otra variable de instancia en la parte superior de la clase para la información de ayuda.

AlertDialog privado helpAlert;

Usaremos otro método de ayuda para mostrar la información de ayuda..

public void showHelp () AlertDialog.Builder helpBuild = new AlertDialog.Builder (this); helpBuild.setTitle ("Ayuda"); helpBuild.setMessage ("Adivina la palabra seleccionando las letras. \ n \ n" + "¡Solo tienes 6 selecciones incorrectas, entonces se acabó el juego!"); helpBuild.setPositiveButton ("OK", nuevo DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) helpAlert.dismiss ();); helpAlert = helpBuild.create (); helpBuild.show (); 

El soporte de la barra de acción que hemos incluido solo funcionará para niveles de API de 11 en adelante, y el soporte de navegación solo funcionará para niveles de API de 16 en adelante. Para admitir versiones anteriores, deberá usar las bibliotecas de soporte para la barra de acción y la navegación.

Conclusión

Nuestro juego Hangman ahora debería estar completo. Ejecútalo y dale una vuelta. La aplicación en su forma actual solo funcionará en versiones recientes de Android y la interfaz de usuario solo es adecuada para un rango limitado de dispositivos. Como puedes ver, hay espacio para mejorar. Además de admitir un mayor número de dispositivos, puede mejorar el juego agregando niveles de dificultad o categorías de palabras. Incluso podría crear una tabla de clasificación para realizar un seguimiento de los puntajes.

Si ha completado esta serie con éxito, debería haber aprendido sobre varios aspectos de la plataforma Android, incluida la interacción del usuario, los adaptadores, los recursos XML y el aprovechamiento de la barra de acción..