Corona SDK Desarrolla una entretenida aplicación de Magic Ball

En este tutorial, usaremos las API de Corona y el lenguaje de programación Lua para crear una entretenida aplicación Magic Ball..


Breve descripción

Utilizando la Sacudir Evento creado en Corona API, crearemos una aplicación que genere un resultado aleatorio a partir de palabras predefinidas. También aprenderá a crear animaciones simples usando el transición metodos.


Seleccionar dispositivo de destino

Lo primero que debes hacer es seleccionar la plataforma en la que deseas ejecutar tu aplicación, de esta manera podrás elegir el tamaño de las imágenes que usarás.

La plataforma iOS tiene estas características:

  • iPad: 1024x768px, 132 ppi
  • iPhone / iPod Touch: 320x480px, 163 ppi
  • Iphone 4: 960x640px, 326 ppi

Para Android es un poco diferente, al ser una plataforma abierta, puede encontrar muchas resoluciones de pantalla diferentes:

  • Nexus One: 480x800px, 254 ppi
  • Droid: 854x480px, 265 ppi
  • HTC Legend: 320x480px, 180 ppi

En este tutorial usaremos el iPhone / iPod touch como plataforma.


Interfaz

Esta es la interfaz gráfica que usaremos, incluye un gráfico de triángulo que servirá como el Octoedro que se encuentra en Magic Balls.


Exportando PNG's

Dependiendo del dispositivo que haya seleccionado, deberá exportar los gráficos en el PPI recomendado, 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.


Código!

Es hora de escribir nuestra aplicación!

Abra su editor de Lua preferido (cualquier editor de texto funcionará, pero no tendrá resaltado de sintaxis) y prepárese para escribir su increíble aplicación.


Ocultar barra de estado

Primero, escondemos la barra de estado, esta es la barra en la parte superior de la pantalla que muestra la hora, la señal y otros indicadores.

 display.setStatusBar (display.HiddenStatusBar)

Fondo

Ahora añadimos el fondo de la aplicación..

 local background = display.newImage ("background.png")

Esta línea crea la variable local. fondo y usa el monitor API para agregar la imagen especificada al escenario. Por defecto, la imagen se agrega a 0,0 usando la esquina superior izquierda como punto de referencia.


Octoedro

Repetimos el proceso con la imagen del octoedro, colocándola en el centro del escenario..

 local octohedron = display.newImage ("octohedron.png", 110, 186) octohedron.isVisible = false

El Octothedron será invisible por defecto, y aparecerá en el primer movimiento del dispositivo.


Campo de texto

El siguiente código crea el campo de texto central que mostrará la oración aleatoria cuando se envía un evento de sacudida.

 local textfield = display.newText ("", 0, 0, native.systemFontBold, 14) - Crea el campo de texto TextField: setReferencePoint (display.CenterReferencePoint) - Cambia el punto de referencia al centro para facilitar el posicionamiento textfield.x = display.contentWidth * 0.5 - Campo de texto central del campo de texto.y = display.contentHeight * Campo de texto de 0.5: setTextColor (255, 255, 255) - Establecer el color del texto en blanco

Variables necesarias

Las siguientes variables serán utilizadas para manejar el evento Shake..

  • sacudir: Una tabla que se utilizará como escucha de la función para el evento shake.
  • opciones: Almacena las palabras que pueden ser mostradas por la bola mágica..
batido local = 
opciones locales = "Probablemente no", "No.", "No", "Tal vez", "Sí", "Probablemente", "Está listo", "Por supuesto"

Función de agitar

Esta función escucha un evento de sacudidas y revela el octoedro y el texto si es verdadero.

función shake: acelerómetro (e)
if (e.isShake == true) entonces
octohedron.isVisible = true
transition.from (octoedro, alfa = 0) - Mostrar octoedro, anima el alfa de 0 a 1
textfield.text = options [math.random (1, 8)] - Selecciona una oración aleatoria de la variable de opciones
transition.from (textfield, alpha = 0) - se desvanece en el texto
fin
fin

Escucha del acelerómetro

Los eventos del Acelerómetro se basan en el tiempo de ejecución, por lo que usamos la palabra clave Runtime para agregar la escucha.

 Tiempo de ejecución: addEventListener ("acelerómetro", agitar)

Icono

Si todo funciona como se espera, estamos casi listos para construir nuestra aplicación para la prueba de dispositivos. Solo una cosa más, nuestro ícono de aplicación..

Al usar los gráficos que creaste antes de que puedas crear un ícono bonito y atractivo, el tamaño del ícono para los íconos del iPhone es de 57x57px, pero la tienda de iTunes usa 512x512px, por lo que es mejor crear tu ícono en este tamaño.

No es necesario que tenga las esquinas redondeadas o el brillo transparente, iTunes y el iPhone lo harán por usted..


Conclusión

Los eventos de Shake son fáciles de detectar y realmente útiles, puede darles cualquier funcionalidad como borrar, deshacer, barajar u obtener una respuesta aleatoria tal como lo hizo en este tutorial..

Gracias por leer!