En esta serie de tutoriales, construiremos un juego Brick Breaker desde cero utilizando el SDK de Corona. El objetivo de este juego es controlar una paleta tipo pong para golpear una bola contra una pila de ladrillos hasta que todos se rompan..
El propósito de este juego es usar una paleta para golpear una bola en una pila de ladrillos hasta que todos los ladrillos se rompan sin permitir que la pelota pierda la paleta y salga volando de la pantalla. Si tiene éxito, el usuario avanzará a un nuevo nivel, de lo contrario el juego terminará.
Lo primero que debemos hacer es seleccionar la plataforma en la que queremos ejecutar nuestra aplicación, de esta manera podremos elegir el tamaño de las imágenes que usaremos.
La plataforma iOS tiene estas características:
Debido a que Android es una plataforma abierta, hay muchos dispositivos y resoluciones diferentes. Algunas de las características de pantalla más comunes son:
En este tutorial, nos centraremos en la plataforma iOS con el diseño gráfico, específicamente el desarrollo para la distribución a un iPhone / iPod touch, pero el código que se presenta aquí también debe aplicarse al desarrollo de Android con Corona SDK..
Se mostrará una interfaz vistosa y colorida, que involucra múltiples formas, botones, mapas de bits y más.
Los recursos gráficos de la interfaz necesarios para este tutorial se pueden encontrar en la descarga adjunta..
Dependiendo del dispositivo que haya seleccionado, es posible que deba exportar los gráficos en la ppi recomendada, puede hacerlo en su editor de imágenes favorito.
Usé el Ajustar el tamaño? Funciona en la aplicación Preview en Mac OS X.
Recuerde dar a las imágenes un nombre descriptivo y guardarlas en la carpeta de su proyecto.
Es hora de escribir nuestra aplicación!
Abra su editor de Lua preferido (cualquier editor de texto funcionará, pero no todos los editores ofrecen resaltado de sintaxis de Lua) y prepárese para escribir su increíble aplicación. Recuerde guardar el archivo como main.lua en la carpeta de tu proyecto.
Estructuraremos nuestro código como si fuera una clase. Si conoce ActionScript o Java, debería encontrar la estructura familiar.
Clases necesarias. Variables y constantes. Funciones. Conductor. (Función principal). Métodos de clase (otras funciones).
display.setStatusBar (display.HiddenStatusBar)
Este código oculta la barra de estado. La barra de estado es la barra en la parte superior de la pantalla del dispositivo que muestra la hora, la señal y otros indicadores.
Haremos uso del potente motor Box2D integrado en Corona, use este código para incluirlo en su aplicación:
--Motor de Física física local = requiere 'física' physics.start () physics.setGravity (0, 0) - Establezca la gravedad en 0 ya que no la necesitaremos
Estas son las variables y constantes básicas que usaremos, lea los comentarios en el código para obtener más información sobre ellas..
local BRICK_W = 41 - ancho de ladrillo local BRICK_H = 21 - altura de ladrillo local OFFSET = 23 --un desplazamiento usado para centrar los ladrillos local W_LEN = 8 - la longitud de los niveles, solo se deben crear 8 ladrillos horizontales en el escenario SCORE_CONST local = 100 - la cantidad que se agrega a la puntuación cuando se golpea un ladrillo puntuación local = 0 - almacena la puntuación actual local bricks = display.newGroup () - mantiene todos los ladrillos de nivel local xSpeed = 5 local ySpeed = -5 local xDir = 1 - x dirección local yDir = 1 local gameEvent = "- almacena eventos del juego (ganar, perder, terminado) local currentLevel = 1
Esta es la pantalla principal de la aplicación, será la primera vista interactiva que aparecerá en nuestro juego. Estas variables almacenan el fondo y los componentes de la pantalla de menú..
local background = display.newImage ('bg.png') menu localScreen local mScreen local startB local aboutB
Presta especial atención a la línea con display.newImage ('bg.png')
. Este es el responsable de mostrar la imagen de fondo inicial en la pantalla..
La pantalla Acerca de mostrará los créditos, el año y los derechos de autor del juego. Esta variable se utilizará para almacenar una referencia a la vista:
local sobre pantalla
Esta es la pantalla del juego, se creará cuando el comienzo se pulsa el botón.
Variables para almacenar la pantalla del juego:
local paleta local ladrillo local bola
Variables locales que almacenan los campos de texto de puntuación / nivel y los valores numéricos de puntuación / nivel:
puntuación localTexto puntuación localNum nivel localText nivel localNum
Esta pantalla aparecerá cuando el juego haya sido decidido. El mensaje le dirá al jugador que gana o pierde.
La pantalla de alerta se almacena por las siguientes variables:
local alertScreen local alertBg local box local localTF local msgTF
Todos nuestros niveles se almacenarán en tablas (la versión Lua de una matriz).
Esta es esencialmente una tabla que contiene una tabla. Podría declarar esto en una sola línea, pero, con el formato correcto, el espaciado le permite ver la forma en que tomarán los niveles:
niveles locales = niveles [1] = 0,0,0,0,0,0,0,0, 0,0,0,0,0,0,0,0, 0, 0,0,1,1,0,0,0, 0,0,0,1,1,0,0,0, 0,1,1,1,1,1,1,0 , 0,1,1,1,1,1,1,0, 0,0,0,1,1,0,0,0, 0,0,0,1,1,0, 0,0, 0,0,0,0,0,0,0,0, niveles [2] = 0,0,0,0,0,0,0,0, 0 , 0,0,1,1,0,0,0, 0,0,1,0,0,1,0,0, 0,0,0,0,0,1,0,0 , 0,0,0,0,1,0,0,0, 0,0,0,1,0,0,0,0, 0,0,1,0,0,0 , 0,0, 0,0,1,1,1,1,0,0, niveles [3] = 0,0,0,0,0,0,0,0, 0,0,0,0,0,0,0,0, 0,0,0,1,1,0,0,0, 0,1,0,0,0,0,1, 0, 0,1,1,1,1,1,1,0, 0,1,0,1,1,0,1,0, 0,0,0,0,0, 0,0,0, 0,0,0,1,1,0,0,0, 0,0,0,0,0,0,0,0, niveles [4] = 0,0,0,0,0,0,0,0, 0,0,0,0,0,0,0,0, 1,1,1,1,1,1,1 , 1, 1,0,0,0,0,0,0,1, 1,0,0,0,0,0,0,1, 1,0,0,0,0 , 0,0,1, 1,0,0,0,0,0,0,1,1, 1,0,0,0,0,0,0,1, 1,1,1 , 1,1,1,1,1,
En las tablas multidimensionales de arriba, 1's están representando el espacio en la etapa donde se colocará un ladrillo, y la 0's son solo espacios vacíos. Más adelante, los números serán leídos por una función que colocará un ladrillo en la vista del juego. Hemos agregado cuatro arriba, pero puedes agregar tantos como quieras!
Ya has visto la interfaz y la configuración básica de nuestro juego. Manténgase atento a la segunda parte de esta serie, donde agregaremos interactividad a la interfaz y detección de colisiones entre los gráficos de nuestros juegos..