dart 如何在不使用RawKeyboardListener的情况下检测 Flutter 中的按键

kokeuurv  于 2023-03-15  发布在  Flutter
关注(0)|答案(3)|浏览(156)

我试图检测flutter中的“Enter”、“Delete”和“Backspace”等按键。我使用**RawKeyboardListener**的问题是它会将焦点从任何子部件上移开。
例如

RawKeyboardListener(
  focusNode: _focusNode,
  onKey: handleKey,
  child: TextField()
)

这使得无法检测两个按键并同时使用**Textfield**。
有没有人有一个替代的方法来检测按键。
谢谢

lf5gs5x2

lf5gs5x21#

您可以使用dart_html中的以下内容:

window.onKeyPress.listen((KeyboardEvent e) {
      print(e.charCode.toString() + " " + new String.fromCharCode(e.charCode));
    });
bksxznpy

bksxznpy2#

您可以在有状态小部件的initState中使用dart:ui并设置window.onKeyData方法
使用该方法时要小心,因为如果屏幕上有任何可聚焦的节点,您也需要向它们传递事件,否则,例如,TextField将无法工作。

@override
  void initState() {
    window.onKeyData = (final keyData) {
      if (keyData.logical == LogicalKeyboardKey.escape.keyId) {
        widget.onPressed();

        return true;
      }

      /// Let event pass to other focuses if it is not the key we looking for
      return false;
    };
    super.initState();
  }

  @override
  void dispose() {
    window.onKeyData = null;
    super.dispose();
  }
dw1jzc5e

dw1jzc5e3#

Flutter有一个键盘服务,它为Flutter提供原始按键事件,您也可以要求该服务为您提供按键事件。
这种方法的好处是它不会阻止现有Flutter焦点节点接收事件,因此您不必手动处理键盘事件传播。
您可以向此服务添加侦听器,如下所示:

import 'package:flutter/services.dart';

ServicesBinding.instance.keyboard.addHandler(_onKey);

...其中_onKeybool Function(KeyEvent)。下面是一个事件处理程序示例:

bool _onKey(KeyEvent event) {
  final key = event.logicalKey.keyLabel;

  if (event is KeyDownEvent) {
    print("Key down: $key");
  } else if (event is KeyUpEvent) {
    print("Key up: $key");
  } else if (event is KeyRepeatEvent) {
    print("Key repeat: $key");
  }

  return false;
}

更多信息,请访问:https://api.flutter.dev/flutter/services/HardwareKeyboard/addHandler.html
请注意,即使文本框当前处于焦点位置,此事件处理程序也将始终接收按键事件。
以下是在小部件中使用此技术的示例:

import 'package:flutter/services.dart';

// ...

class MyApp extends StatefulWidget {
  // ...
}

class _MyAppState extends State<MyApp> {
  // ...

  bool _onKey(KeyEvent event) {
    final key = event.logicalKey.keyLabel;

    if (event is KeyDownEvent) {
      print("Key down: $key");
    } else if (event is KeyUpEvent) {
      print("Key up: $key");
    } else if (event is KeyRepeatEvent) {
      print("Key repeat: $key");
    }

    return false;
  }

  @override
  void initState() {
    super.initState();
    ServicesBinding.instance.keyboard.addHandler(_onKey);
  }

  @override
  void dispose() {
    ServicesBinding.instance.keyboard.removeHandler(_onKey);
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    // ...
  }
}

相关问题