Haciendo un juego de Blackjack en Corona - Creando la interfaz

En este tutorial, te mostraré cómo crear un juego de Blackjack para el iPad con el Corona SDK. Empecemos!

¿Quieres saber cómo fue diseñado este juego? Esta serie de tutoriales se basa en el trabajo de Andrei Marius, quien originalmente publicó un tutorial en profundidad de Illustrator que muestra cómo diseñar el juego en Vectortuts+.


1. Nuevo proyecto

Abre el simulador de Corona y elige "Nuevo proyecto".


En la pantalla que sigue, elija la siguiente configuración.

Ajustes del proyecto

Presione el "Siguiente", luego elija abrir en editor. Esto abrirá "Main.lua"en tu editor de texto predeterminado.


2. Configuración del proyecto

Abierto "Config.lua"Eliminar todo y cambiarlo a la siguiente.

 application = content = width = 768, height = 1024, scale = "letterBox", fps = 30,

Esto establece el ancho, altura, escala y FPS predeterminados del proyecto. Los "buzón"la configuración de escala significa que la aplicación se escalará en ambas direcciones de la manera más uniforme posible y, si es necesario, mostrará el juego" Letter Boxed ", como se ve en algunas películas en DVD.


3. Ocultar la barra de estado

No queremos que se muestre la barra de estado en nuestra aplicación, así que ingrese lo siguiente en "Main.lua"

 display.setStatusBar (display.HiddenStatusBar);

4. Variables locales

Agregue lo siguiente debajo del código que ingresó en el paso anterior.

 local cardTable = display.newImage ("table.png", true); dinero local10; - El dinero local de $ 10.0025; --El chip local de $ 25.00 dinero50; - El chip local de $ 50.00 dealBtn; - los botones de acuerdo local hitBtn; - el botón de golpe local standBtn; - el botón de soporte instrucciones localesTexto; - Dar instrucciones y mostrar trajes locales ganadores = "h", "d", "c", "s"; - corazones = h, diamantes = d, clubes = c, espadas = s cubierta local; - La baraja de cartas local coinContainer; - un grupo que tendrá el grupo de distribuidores locales de chips; - Ponemos las cartas de crupier en este grupo local playerGroup; - colocamos las cartas de jugador en este grupo local dealTo = "player"; - a quién se está tratando actualmente con playerHand =  local; - una mesa para guardar las cartas de los jugadores local dealerHand = ; - una mesa para guardar las cartas de los concesionarios local allCards =  - una mesa para guardar todas las cartas local betAmount = 0; - cuánto está apostando el jugador Total de dinero local; - cuánto dinero tiene el jugador blackjack local = falso; - si el jugador o crupier tiene blackjack local firstDealerCard = ""; - una referencia a la primera carta que se reparte al distribuidor local PlayerYields = false; - Si el jugador ha estado en su mano local o no; - quien el ganador de la ronda es apuesta local = 0; - cuánto está agregando el jugador a betAmount variable local BankText; - Muestra a los jugadores el dinero local betText; - muestra cuánto está apostando el jugador local dealerCardsY = 120; - Posición Y de las cartas del repartidor local playerCardsY = 810; - Posición Y de las cartas de jugador.

Estas son todas las variables que usaremos en este juego. Lee los comentarios para entender para qué sirven..


5. Configuración ()

Se llamará a la función de configuración cuando se cargue la aplicación por primera vez. Ingrese lo siguiente debajo del código que ingresó en el paso anterior.

 función de configuración () final

Ahora llame a la función de configuración justo debajo de donde la declaró.

 Preparar()

6. SetupCoins ()

Agregue lo siguiente arriba donde está llamando Preparar() en el paso anterior.

 función setupCoins () money10 = display.newImage ("money10.png", 50,960); money10.betAmount = 10; money25 = display.newImage ("money25.png", 110,960); money25.betAmount = 25; money50 = display.newImage ("money50.png", 170,960); money50.betAmount = 50; fin

Esto configura nuestras imágenes de dinero y añade un betAmount llave.

Ahora llama a esta función dentro Preparar().

 función Setup () setupCoins (); fin

7. SetupButtons ()

Agregue lo siguiente debajo de setupCoins () Función que declaraste en el paso anterior..

 función setupButtons () dealBtn = display.newImage ("deal_btn.png", 250,960); dealBtn.isVisible = falso; hitBtn = display.newImage ("hit_btn.png", 400,960); hitBtn.isVisible = falso; standBtn = display.newImage ("stand_btn.png", 550,960); standBtn.isVisible = falso; fin

Esto configura nuestros botones y los hace invisibles..

Llama a esta función dentro Preparar().

 función Setup () setupCoins (); botones de configuración (); fin

8. SetupTextFields ()

Agregue lo siguiente debajo de botones de configuración () Función que ingresaste en el paso anterior.

 función setupTextFields () instructionsText = display.newText ("Place Your Bet", 300, 300, native.systemFont, 30); instructionsText: setTextColor (0,0,0) bankText = display.newText ("Your Bank: $", 10,905, native.systemFont, 30); bankText: setTextColor (0,0,0) betText = display.newText ("", 650,906, native.systemFont, 30); betText: setTextColor (0,0,0); fin

Esto configura el Campos de texto y establece el color del texto en negro.

Agrega esto a la Preparar() función.

 función Setup () setupCoins (); botones de configuración (); setupTextFields () end

9. Grupos de configuración ()

Agregue lo siguiente debajo de setupTextFields () función.

 función setupGroups () coinContainer = display.newGroup () coinContainer.x = 250; coinContainer.y = 600; dealerGroup = display.newGroup (); playerGroup = display.newGroup (); fin

Esto configura los grupos que se utilizarán para guardar las cartas y el dinero que el jugador apuesta.

Agrega esto a la Preparar() Funciona igual que has estado haciendo en los pasos anteriores.


10. Compruebe el progreso

Si prueba la aplicación, debería ver la interfaz funcionando correctamente.

Interfaz de juego

11. AddListeners ()

Agregue lo siguiente debajo de setupGroups () función.

 function addListeners () money10: addEventListener ('touch', betHandler); money25: addEventListener ('touch', betHandler); money50: addEventListener ('touch', betHandler); dealBtn: addEventListener ('touch', deal); hitBtn: addEventListener ('touch', hit); standBtn: addEventListener ('touch', stand); fin

Esto agrega escuchas táctiles a los elementos de nuestra interfaz para que el usuario pueda interactuar con ellos. Necesitamos crear las funciones que se llamarán cuando el usuario haga clic en ellas..


12. BetHandler ()

Introduzca lo siguiente debajo de addListeners () función.

 función betHandler (evento) final

Esta función se encargará de las apuestas. Se asegurará de que el usuario no intente apostar más de lo que tiene en su banco..


13. Trato ()

Ingrese lo siguiente debajo del código que ingresó en el paso anterior.

 función trato () fin

Esta función es donde se encuentra el corazón del juego. Toda la lógica del juego será manejada en esta función..


14. Golpear ()

Agregue lo siguiente debajo de acuerdo() función.

 función hit (evento) final

Esta función se activará cuando el usuario presione "golpearbotón ".


15. Stand ()

Ingrese lo siguiente debajo del código que ingresó en el paso anterior.

 función stand () final

Cuando el jugador decida ponerse de pie, se llamará a esta función..


16. CreateDeck ()

Agregue lo siguiente debajo de createDeck () función.

 function createDeck () deck = ; para i = 1, 4 do para j = 1, 13 do local tempCard = se adapta a [i]… j; table.insert (deck, tempCard); fin extremo fin

Esto restablece la tabla de la cubierta y crea una cubierta nueva. Se ejecuta a través de cada valor en el trajes tabla y anexa el número 1 mediante 13 a ellos Establecemos la variable tempCard igual al resultado, luego insértelo en el cubierta mesa.

Ahora llama a esto en el Preparar() función.

 función Setup () setupCoins (); botones de configuración (); setupTextFields (); setupGroups (); createDeck (); fin

Obtendremos algunas cartas aleatorias del mazo, así que asegúrate de que sea realmente aleatorio que necesitaremos para generar el generador aleatorio. Si no hacemos esto, cada vez que el juego comience, generará la misma aleatoriedad. Agrega lo siguiente createDeck ().

 función Setup () setupCoins (); botones de configuración (); setupTextFields (); setupGroups (); math.randomseed (os.time ()); createDeck (); fin

Conclusión

Esto pone fin a la primera parte de este tutorial. En la siguiente parte de la serie comenzaremos a incorporar la jugabilidad. Gracias por leer. Manténgase en sintonía para la segunda parte!