Cómo agregar botones a su juego de html5 para el acceso móvil

los simpleGame biblioteca tiene una característica muy útil llamada GameButton para añadir un botón a la pantalla de un dispositivo móvil para su juego de HTML5. El teclado es una de las maneras más fáciles de conseguir la entrada en un navegador estándar, pero la mayoría de los dispositivos móviles no tienen teclados. El primer problema es encontrar la manera de obtener la entrada del usuario cuando no hay teclado.

Video: Curso de Diseño Web, Capitulo 5 - Crear Botones y Enlaces

los GameButton botón personalizado objeto comienza con las características de un botón HTML estándar, pero a continuación añade algunos trucos para que sea adecuado para el juego. Se puede activar el botón con un ratón normal o con los controles táctiles, lo que es ideal para los juegos que se pueden jugar en ambos tipos de dispositivos. los button.html página ilustra el botón de acción:

button.html

Como de costumbre, los nuevos e interesantes elementos se indican en negrita. He aquí cómo se agrega un botón de juego para un juego:

Video: Botones HTML CSS # 7 | Diseño Web

  1. Crear una variable para el botón.

    Al igual que cualquier otro elemento de juego, se empieza por la creación de una variable para hacer referencia al botón.

  2. construir el GameButton objeto.

    construir el GameButton objeto en el en eso() método. El único parámetro indica el título del botón.

  3. Establecer el tamaño y la posición del botón.

    Video: HTML5 y jQuery Mobile 1.3.0 en Español - Añadir botones y configurarlos en jQuery Mobile - 5/x

    Usted querrá pensar un poco acerca de cómo su juego funcionará en los dispositivos móviles. Colocar los botones en los que se puede llegar fácilmente por el jugador sin bloquear demasiado de la vista. Observe que también querrá hacer los botones lo suficientemente grande para ser presionado durante el calor del juego. (Los botones en pantalla son mucho mejores para juegos basados ​​en tabletas.)

  4. Comprobar el estado de botón durante la actualizar().

    Del mismo modo que normalmente se comprueba el estado del teclado durante la actualizar() función, también puede llamar a una función para comprobar el estado de su botón. Por supuesto, tendrá que escribir esta función.

  5. Leer el botón de isClicked () método.

    Si se presiona el botón Actualmente, el valor de isClicked () es verdad. Si no se presiona el botón actualmente, isClicked () devuelve false. Utilizar este método para determinar el estado actual de cada botón y actuar en consecuencia.

  6. Tratar a un botón al igual que el teclado.

    Debido a que las pruebas de los botones en última instancia, devuelve valores booleanos (verdadero o falso), la comprobación de los botones por lo general se siente mucho como el control para el teclado.

  7. Considerar la adición de botones sólo cuando sea necesario.

    Si lo desea, puede diseñar un juego para mostrar (y prueba) botones sólo cuando una pantalla táctil está disponible. los Escena objeto tiene una variable especial llamada tocable. Esta variable es verdadera si la biblioteca detecta una pantalla táctil, y falso en caso contrario. Puede utilizar esta variable para generar una interfaz personalizada que se adapta al entorno de juego.

Normalmente, se le agrega varios botones a su interfaz, uno para reemplazar cada tecla se puede esperar que el usuario utilice (por ejemplo, flechas y la barra espaciadora). De esta manera, se puede crear un teclado virtual en la pantalla. Puede que tenga que probar el tamaño y la posición de cada tecla para obtener una experiencia de juego cómoda.

Tenga en cuenta que el título del botón es HTML estándar, por lo que si desea hacer sus botones basado en imágenes, sólo tiene que añadir el adecuado etiqueta como un título de botón.

Artículos Relacionados