Shutter web hardware keyboard monitoring

Flutter web Use keyboard monitoring when developing pages , I found a circle on the Internet and recommended it RawKeyboardListener Components

However, in the actual development process, it is found that the component often fails, resulting in the inability to monitor keyboard input .

Now the solution , Use HardwareKeyboard object .

How to get HardwareKeyboard Single case , Then add your own callback method

  late HardwareKeyboard hardwareKeyboard;
  @override
  void initState() {
    hardwareKeyboard = HardwareKeyboard.instance;
    hardwareKeyboard.addHandler((event) {
      print("event=${event.toStringShort()}");
      return true;
    });
    super.initState();
  }

In this way, the hardware keyboard input can be monitored every time .

event=KeyDownEvent#b9cb2
event=KeyUpEvent#b073c
event=KeyDownEvent#8425d
event=KeyUpEvent#b8cec
event=KeyDownEvent#3c7a9
event=KeyUpEvent#c0b31
event=KeyDownEvent#9d155
event=KeyUpEvent#9b0ca
event=KeyDownEvent#5bd0b
event=KeyUpEvent#e8fdf
event=KeyDownEvent#78c1b
event=KeyUpEvent#0abb7

The log table output is as above , We can totally rely on event Object to determine the current key input , Very convenient .