El evento "tap" se refiere a una de las muchas acciones que tenemos disponibles como entrada de datos por parte del usuario (jugador) en la que tocan o hacen click en la ventana de nuestro juego sobre una pantalla con la cual puede interactuar el usuario, como sería un teléfono inteligente con Android, iOS, una tableta, iPAD, etc
El tap puede ser la acción de tocar el elemento con un dedo, mientras que en una computadora, un tap puede ser la acción de hacer clic con un mouse en el elemento; y en Flame con Flutter esto es fundamental;
El evento "tap" se utiliza comúnmente en el desarrollo de aplicaciones móviles y de escritorio para permitir que los usuarios interactúen con la interfaz de usuario; es el evento por excelencia junto con la entrada de teclado que lo tratamos en otra entrada.
Con el evento tap podemos hacer toda clase te juegos como el tipico planta vs zombies para seleccionar y colocar una planta, para indicar que un caracer tiene que saltar, atacar…
Em definitiva, como toda entrada de datos, lo que queiras hacer depende de ti.
El tap es ora entrada de datos que podemos utilizar en Flame, es el de tap sobre la pantalla que a la final viene siendo un evento click; al igual que con la entrada de teclado, podemos utilizar el evento tap a nivel de la clase como a nivel de componentes.
Tap a nivel de componente
Para poder utilizar el evento de tap a nivel del componente, primero, debemos de habilitarlo a nivel del componente en la clase tipo Game:
lib/main.dart
class <LevelGame> extends FlameGame
with
HasTappables {}Y desde el componente, implementamos el mixin de Tappable:
class <Component> extends <TypeComponent> with Tappable {}Con esto, tenemos acceso a las mismas funciones que las usadas a nivel de la clase Game que mostramos antes.
Por ejemplo, una posible implementación queda como:
lib\components\player_sprite_sheet_component.dart
class PlayeSpriteSheetComponent extends SpriteAnimationComponent with Tappable {
***
@override
bool onTapDown(TapDownInfo info) {
print("Player tap down on ${info.eventPosition.game}");
return true;
}
@override
bool onTapUp(TapUpInfo info) {
print("Player tap up on ${info.eventPosition.game}");
return true;
}
}Con el par de funciones anteriores, podejos determinar si ejecutar el evento al tocar la pantalla o al dejar de precionar la pantalla respetivamente; usualmente se usa es la de onTapDown, que es cuando el usurio da un click sobre la pantalla, pero, tambien puedes que quieras colocar alguna lógica cuando el usuario levanta el dedo o libera el click… en ese caso, puedes usar el de onTapUp en su lugar.
Nuevamente, lo que implementes en estas funciones depende de tu juego, en nuestro curso y libro sobre Flame para el desarrollo de juegos en 2D, hacemos toda clase de juegos con las mismas, ya sea para seleccionar las plantas y colcoarlar, en nuestro juego de plantas vs zombies, para seleccionar items, entre otros.
- Andrés Cruz
In english
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter