7 days of WordPress plugins, themes & templates - for free!* Unlimited asset downloads! Start 7-Day Free Trial
Advertisement
  1. Code
  2. Corona SDK

Corona SDK: Crear una aplicación impulsada por un acelerómetro

Scroll to top
Read Time: 4 mins

Spanish (Español) translation by Esther (you can also view the original English article)

El Corona SDK es un framework multiplataforma que permite a los desarrolladores crear aplicaciones tanto para iPhone como para Android utilizando el lenguaje de programación Lua. En este tutorial, descubriremos las capacidades de Corona SDK para interactuar con el dispositivo acelerómetro. Crearemos una simple aplicación que responda a los eventos del acelerómetro.


Tutoriales relacionados con Corona SDK:


Resumen de la aplicación del acelerómetro

Accelerometer Figure 1Accelerometer Figure 1Accelerometer Figure 1

Usando los API's de Corona, crearemos una aplicación básica que registra el movimiento del dispositivo basado en el valor del acelerómetro, moviendo un objeto en la pantalla.


Selecciona el dispositivo destino

Accelerometer Figure 2

Lo primero que tienes que hacer es seleccionar la plataforma en la que quieres ejecutar tu aplicación, de esta manera podrás elegir el tamaño de las imágenes que vas a utilizar.

La plataforma iOS tiene estas características:

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

Debido a que Android es una plataforma abierta, hay muchos dispositivos y resoluciones diferentes. Algunas de las características más comunes de la pantalla son:

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

En este tutorial nos centraremos en la plataforma iOS, específicamente en el desarrollo para su distribución en un iPhone/iPod touch.


Interfaz

Accelerometer Figure 3

Esta es la interfaz gráfica que usaremos, incluye un gráfico triangular que servirá como medidor de posición.


Exportando PNG's

Accelerometer Figure 4Accelerometer Figure 4Accelerometer Figure 4

Dependiendo del dispositivo que hayas seleccionado, tendrás que exportar los gráficos en el PPI recomendado, puedes hacerlo en tu editor de imágenes favorito.

Utilicé la función Adjust Size (Ajustar tamaño)... en la aplicación Vista previa de Mac OS X.

Recuerda dar un nombre descriptivo a las imágenes y guardarlas en tu carpeta de proyectos.


¡Código!

Accelerometer Figure 5Accelerometer Figure 5Accelerometer Figure 5

¡Hora de escribir nuestra solicitud!

Abre tu editor Lua preferido (cualquier editor de texto funcionará, pero puede que no tengas resaltado de sintaxis) y prepárate para escribir tu increíble aplicación.


Ocultar la barra de estado

Primero, ocultamos 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.


Background (Fondo)

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

Esta línea crea el background variable local y utiliza el API de visualización para añadir la imagen especificada al escenario. Por defecto, la imagen se añade a 0,0 usando la esquina superior izquierda como punto de referencia.


Indicador

Repetimos el proceso con la imagen del indicador de posición, colocándolo en el centro del escenario.


Variables necesarias

Las siguientes variables se usarán para manejar el evento del acelerómetro.

  • acc: Una tabla que será usada como una función de escucha para el evento del acelerómetro.
  • centerX: Almacena el valor central horizontal del escenario.

Función del acelerómetro

Esta función utiliza la tabla acc para crear un oyente para el evento del acelerómetro, la propiedad xGravity (parte del evento del acelerómetro) y la variable centerX mueve el indicador de posición según la posición calculada.

Esto hará que nuestro indicador se equilibre cuando la inclinación del dispositivo cambie, la propiedad xGravity se encargará de los movimientos laterales, puedes usar la propiedad yGravity para manejar los tipos de inclinación arriba/abajo.


Acelerómetro oyente

Los eventos del acelerómetro se basan en el tiempo de ejecución, así que usamos la palabra clave de tiempo de ejecución para añadir el oyente.


Icono

Accelerometer Figure 6

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 icono de la aplicación.

El tamaño de los iconos del iPhone es de 57x57px, pero la tienda de iTunes usa un 512x512px, por lo que es mejor crear el icono en este tamaño.

No necesitas tener las esquinas redondeadas o el brillo transparente, iTunes y el iPhone lo harán por ti.


Conclusión

Con este tutorial has aprendido a utilizar los eventos del acelerómetro para manipular elementos en el escenario, hay muchas maneras de aplicar este código, siendo el movimiento básico del personaje en un juego una de las opciones más destacadas.

Gracias por leer este tutorial, espero que lo hayas encontrado útil. ¡Diviértete experimentando con el acelerómetro del dispositivo!

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.