How to detect key press and keyboard shortcuts on the react-native-windows + macOS app? #10438
-
How to detect key press and keyboard shortcuts on the react-native-windows + macOS app? I need to detect when user presses certain keys like 'Enter', 'Esc', etc. and do some default actions on those for my rn-windows app. |
Beta Was this translation helpful? Give feedback.
Replies: 3 comments 10 replies
-
I'm not finding a great single example (also requested by this issue: microsoft/react-native-windows-samples#388). But the APIs are here: https://microsoft.github.io/react-native-windows/docs/ikeyboardprops-api. There may be some working examples in this app as well: https://github.com/microsoft/react-native-gallery. |
Beta Was this translation helpful? Give feedback.
-
I feel like we need a global listener for unhandled keystrokes. Id even be ok with all keystrokes and filter on client side similar to Keyboard.Keydown on wpf. There's an example here https://github.com/microsoft/react-native-windows/blob/6c871e6ba27888804c776e5deeefbc7064e181d0/packages/%40react-native-windows/tester/src/js/examples-win/Keyboard/KeyboardExtensionExample.windows.tsx But I still couldn't get it to work, and decorating views as ViewWindiws is likely going to cause cross platform issues. |
Beta Was this translation helpful? Give feedback.
-
Finally got around to working on this - `#pragma once #include "NativeModules.h" namespace winrt::NAMESPACE::implementation
}` |
Beta Was this translation helpful? Give feedback.
I'm not finding a great single example (also requested by this issue: microsoft/react-native-windows-samples#388). But the APIs are here: https://microsoft.github.io/react-native-windows/docs/ikeyboardprops-api. There may be some working examples in this app as well: https://github.com/microsoft/react-native-gallery.