Noticias

Se ha publicado un nuevo servicio, el Portal de Juegos Online

* Sponsor

Comunidad Game Maker

Bienvenid@ a la comunidad hispana de Game Maker. Nuestro objetivo es crear videojuegos y dar soporte en castellano de GM. Para mejorar nuestro servicio hemos implantado, como adicion al reglamento general, algunas normas especificas en los subforos más comunes. ¡No olvides informarte antes de participar!.

Autor Tema: Joystick táctiles para juegos html5 en proceso.  (Leído 533 veces)

0 Usuarios y 1 Visitante están viendo este tema.

Desconectado dixon

en: Agosto 13, 2021, 04:04:16 am
Hola, gusto en saludarlos:


Joystick táctiles para juegos html5 en proceso.

1.   Quiero crear un joystick táctil para juegos html5 y no puedo emplear el draw gui porque no funciona en exploradores.

2.   El año pasado cree un sistema engorroso y orrible de escalas para lograr imitar la función draw gui en exploradores y logré crear joytick táctiles para el juego “adiós capitán”. Pero es demasiado complicado y los resultados no son del todo agradables (Mira el juego y dale un like, XD). En el proceso aprendí algunas cosas y este es el punto 3:

3.   Se pueden crear Joytick táctiles para juegos html5 empleando un pequeño sistema de tres views manejado por un script encargado de escalar las views para que dé un resultado parecido a este:




1.   Para lograrlo hay que crear una view principal que se ajuste al tamaño del explorador.

2.   Una seguna view que contenga el juego.

3.   Una tercera view que contenga el joystick táctil.
Parece fácil pero no:

1.   Para que todo quede ajustado deben escalarse proporcionalmente las views 2 y 3, empleando regla de tres, (Estudia regla de tres matemáticas las vas a necesitar).

2.   Debido al problema de escalado que algunos conocemos (problemas con fuentes, imágenes más dibujadas), es necesario trabajar con views superiores a 512x512.

3.   Para ubicar correctamente las views vamos a necesitar un sistema o script parecido al “ajustador de canvas html5” que he creado, pero un poco más complejo, esta véz habrá que manejar muy bien las dos posiciones del dispositivo móvil:

Movil en posición horizontal: Al cambiar de posición el móvil, la posición del joystick táctil cambia.



Para lograr que todo cuadre, es conveniente trabajar ahora con 4 views como se indica abajo:





1.   View azul: La que se ajusta a todo el contorno del explorador.
2.   View Roja: La que mostrará el juego.
3.   View verde: la que contiene la parte izquierda del joystick.
4.   View naranja: la que contiene la parte izquierda del joystick táctil.

¿Y que lograremos con eso?, bueno con eso podemos manejar las views para que cuando el móvil esté en horizontal podamos mostrar algo como esto:




Ahora olviden todo lo aprendido, XD.  Ahora es que vengo a hablarles de lo que realmente quiero hablarles:

Características de este sistema ya explicado:

1.   Solo trabajará correctamente en game maker studio 1, 2 y superiores.
2.   Se requiere emplear las funciones incluidas de multitouch.
3.   No se aplicará correctamente en la versión de game maker llamada “game maker html5”.

En resumen: Quiero crear un sistema de joystick táctiles que funcione en la versión game maker llamada “Game maker html5”.

Razones y motivos principales:
1.   Los juegos creados con game maker html5 son más ligeros que los creados con game maker studio, y cargan más rápido.

Dificultades:
1.   Game maker html5 no incluye función multitouch.
2.   Game maker html5 presenta problemas de coordenadas del mouse en dispositivos móviles.

Objetivos y alternativas:
1.   Crear joystick táctiles para juegos html5 mediante lenguajes para el desarrollo web tales como javascript, Jquery, php, angular, react, etc…

2.   Integrar al juego exportado el joystick táctil creado mediante los lenguajes indicados. (para esto solo necesitamos modificar el index.html del juego)


¿Cómo funcionaría el proyecto?

1.   Se crearían, mediante los lenguajes para el desarrollo web, los botones táctiles los cuales pudiesen ser ajustados mediante reglas css u otras.
2.   Al pulsar los botones algún lenguaje deberá “simular” que se ha presionado una tecla y game maker reconocería esta tecla “en teoria”.

Dificultades:

1.   No encuentro el código que simula la teclas del teclado en exploradores, bueno solo encontré esto:
https://www.it-swarm-es.com/es/javascript/jquery-o-js-puro-simular-la-tecla-enter-presionada-para-probar/969438578/

2.   Jquery está obsoleto y quizás deje de implementarse en exploradores en el futuro.

Estado actual del proyecto:
En proceso....

¿ alguna idea?

Aqui les dejo un ejemplo:

Un ejemplo sin terminar. Giren el dispositivo móvil y verán los cambios.
https://dixonysusjuegoseducativos.000webhostapp.com/_practica_game/Draw_gui_game/index.html

El juego "Adios capitan", trabaja con el sistema engorroso de escalas, giren el dispositivo movil.
https://dixonysusjuegoseducativos.000webhostapp.com/juegos_completos/adios_capitan/index.html
« Última modificación: Agosto 13, 2021, 04:58:47 am por dixon »

Si Dios quiere; Limpiaré la oficina, puliré el piso y les serviré café a todos, luego, me enseñarán a programar e iré a comprarles más café.
 


No Tienes Permisos Para Dar Puntos
point 0 Puntos

Este tema no recibió puntos.


 


Warning: Parameter 1 to spoiler_buffer() expected to be a reference, value given in Unknown on line 0

Warning: Parameter 1 to custom_report_ob() expected to be a reference, value given in Unknown on line 0