Flutter Flame 教程4 - Input 输入

2,647 阅读2分钟

Input 输入


Gestures 手势


在package:flame/gestures.dart文件中,你可以找到所有能够被包含在你的游戏类实例中接收所有触摸输入事件的mixin集合。以下是所有的mixin和它的方法:

- TapDetector
  - onTap
  - onTapCancel
  - onTapDown
  - onTapUp

- SecondaryTapDetector
  - onSecondaryTapDown
  - onSecondaryTapUp
  - onSecondaryTapCancel

- DoubleTapDetector
  - onDoubleTap

- LongPressDetector
  - onLongPress
  - onLongPressStart
  - onLongPressMoveUpdate
  - onLongPressUp
  - onLongPressEnd

- VerticalDragDetector
  - onVerticalDragDown
  - onVerticalDragStart
  - onVerticalDragUpdate
  - onVerticalDragEnd
  - onVerticalDragCancel

- HorizontalDragDetector
  - onHorizontalDragDown
  - onHorizontalDragStart
  - onHorizontalDragUpdate
  - onHorizontalDragEnd
  - onHorizontalDragCancel

- ForcePressDetector
  - onForcePressStart
  - onForcePressPeak
  - onForcePressUpdate
  - onForcePressEnd

- PanDetector
  - onPanDown
  - onPanStart
  - onPanUpdate
  - onPanEnd
  - onPanCancel

- ScaleDetector
  - onScaleStart
  - onScaleUpdate
  - onScaleEnd

这些检测器很多会相互冲突,比如,你不能同时注册Vertical(垂直)和Horizontal(水平)拖动,所以不是所有的东西都可以同时使用。

所有这些方法都是从GesutreDetector widget的一个镜像,所以你可以从这里了解更多关于Flutter的手势。

Example 例子

    class MyGame extends Game with TapDetector {
        
        @override
        void onTapDown(TapDownDetails details){
            print("Player tap down on ${details.globalPosition.dx} - ${details.globalPosition.dy}")
        }
        
        @override
        void onTapUp(TapUpDetails details) {
            print("Player tap up on ${details.globalPosition.dx} - ${details.globalPosition.dy}");
        }
    }

你可以在这个例子中学习更多。

Tapable components 可以点击的组件


Flame也提供了简单的辅助类,使得PositionComponent可以更简单的处理触摸事件。通过使用mixin Tapable,你的组件可以实现以下方法,就能轻松使用触摸事件了。

    void onTapCancel() {}
    void onTapDown(TapDownDetails details) {}
    void onTapUp(TapUpDetails details) {}

最小的组件使用实例:

    import 'package:flame/components/component.dart';
    import 'package:flame/components/mixins/tapable.dart';
    
    class TapableComponent extends PositionComponent with Tapable {
        
        @override
        void onTapUp(TapUpDetails details){
            print("tap up");
        }
        
        @override
        void onTapDown(TapDownDetails details){
            print("tap down");
        }
        
        @override
        void onTapCancel() {
            print("tap cancel");
        }
    }

Keyboard 键盘


Flame提供了一种简单的方式来访问Flutter关于访问键盘输入事件的功能。

只需要将KeyboardEvents mixin添加到你的game类中就能使用了。这样你需要实现onKeyEvent方法,每当键盘事件发生时,这个方法都会调用,它接收一个Flutter RawKeyEvent类的实例,它可以被用在获取事件的信息,比如这是个键按下和放开事件,按住的键等等。

最简单的例子:

    import 'package:flame/game.dart';
    import 'package:flame/keyboard.dart';
    import 'package:flutter/services.dart';
    
    class MyGame extends Game with KeyboardEvents {
        
        @override
        void onKeyEvent(e){
            final bool isKeyDown = e is RawKeyDownEvent;
            print(" Key: ${e.data.keyLabel} - isKeyDown: $isKeyDown");
        }
    }

你可以在此处查看更完整的示例。