Crear control de juego adelante, atrás y saltar en CoronaSDK


Vamos a crear un control de juego con las opciones adelante, atrás y saltar para aplicaciones o juegos basados en CoronaSDK.

Este control de juego sirve para que al hacer tap o click sobre los botones se ejecuten las acciones requeridas.

Incluso podemos aplicar otros usos por ejemplo carouseles de imágenes, entre otras cosas.

Control de Juego

En la siguiente imagen se puede ver la pantalla de un dispositivo, el control de juego consiste en 3 botones que se pueden ver de color azul con flechas indicando la direccion.

Los botones del control tienen la misma imagen pero con rotación en diferentes ángulos.

Al hacer click o tap en cualquiera de los botones, se ejecutara una función o método.

Código fuente

El código fuente esta en el lenguaje Lua.

	-- Definimos el grupo de objetos
	local sceneGroup = self.view
	-- Definimos la medida de la pantalla y cual es el centro (half)
	local screenW, screenH, halfW = display.actualContentWidth, display.actualContentHeight, display.contentCenterX
	-- Creamos un fondo de pantalla
	local background = display.newRect( display.screenOriginX, display.screenOriginY, screenW, screenH )
	background.anchorX = 0 
	background.anchorY = 0
	background:setFillColor( .5 ,.2,.5)
	-- Esta es la imagen 1 para el boton "Adelante"
	local img1 = display.newImageRect("arrow1.png",50,50);
	img1.x = 50 -- Posicion en X
	img1.y= 280 -- Posicion en Y
	img1.rotation=180 -- Rotacion de 180 grados
	--- Esta es la imagen 2 para el boton "Atras"
	local img2 = display.newImageRect("arrow1.png",50,50);
	img2.x = 0 
	img2.y= 280
	--- Esta es la imagen 3 para el boton "Saltar"
	local img3 = display.newImageRect("arrow1.png",50,50);
	img3.x = 480
	img3.y= 280
	img3.rotation=90 -- Rotacion de 90 grados

	-- Funcion para el boton 1
	function img1touch(event)
		print("Adelante"); -- Aqui podemos poner cualquier funcion o codigo
	end
	-- Funcion para el boton 2
	function img2touch(event)
		print("Atras"); -- Aqui podemos poner cualquier funcion o codigo
	end
	-- Funcion para el boton 3
	function img3touch(event)
		print("Saltar"); -- Aqui podemos poner cualquier funcion o codigo
	end


	img1:addEventListener("tap", img1touch) -- Asignamos la funcion 1 al boton 1 en el evento tap/click
	img2:addEventListener("tap", img2touch) -- Asignamos la funcion 2 al boton 2 en el evento tap/click
	img3:addEventListener("tap", img3touch) -- Asignamos la funcion 3 al boton 3 en el evento tap/click
	-- Agregamos los elementos a la escena del juego
	sceneGroup:insert(background)
	sceneGroup:insert(img1)
	sceneGroup:insert(img2)
	sceneGroup:insert(img3)

El código ya contiene comentarios para que se entienda mejor.

Resultado

El resultado se pueden muestra en la pantalla blanca, es la consola de Corona SDK, se muestra el texto correspondiente al presionar cada botón.

Descargar

A continuación les dejo la opción de descargar el proyecto con todos los archivos Lua, Imagenes y APK.

Link: Descargar Proyecto

Te invito a seguir mis otros articulos sobre desarrollo de juegos.

Conclusión

Este control se puede modificar para agregar mas botones, puede ser una cruz completa de movimientos y opciones para disparar y/o tirar bombas. Tal vez lo haga mas adelante.

CoronaSDK es una asombrosa herramienta para crear juegos y aplicaciones.

Leave a comment