Reading keystrokes?

Hiya,

Is there any functionality in Appgyver for reading keystrokes as inputs when an element (e.g., a container) is in focus? I have a game-y idea I’d like to try involving motion with arrow keys. (In simple form, picture a game of Snake.)

Thanks!
~Ethan

You would need to bind the Input field to maybe a page variable, then capture the page variable OnChange event. If changed then check if the variable = certain key value, then if so to do whatever you want to happen, then i would be sure to clear the key variable back to empty ( “”.). Im not sure if its possible to check Arrow keys, but definitely numeric (8,4,6,2) keypad) or letter keys (a,w,s,d…)

Thanks, John. I guess what I don’t understand is how I would do this for elements other than, say, a text input field. So for example, if I wanted the keystroke to be read from anywhere inside a container, how would I specify an input field/property for that container?

Oh yea I dont know how you could set up a global KeyEventListener in Appgyver. I think this would have to be implemented in a javascript node on the Global Canvas somehow, but otherwise no idea how this could be done without third-party plugin support

Yep, this isn’t possible currently without the Input hack that John described.

There’s a related feature request in our tracker here: https://tracker.appgyver.com/feature-requests/p/keypress-event-listeners You can upvote it to make it more likely to find its way to our backlog and be implemented

Thanks, Tomi. Can you explain “the Input hack” a bit more? It could be that I misunderstood it, but the way I read it, I would have to have a text input field somewhere on the page which the person would then type into – is that correct? If so is there a way to do this so that the field is invisible and always in focus?

You could use a Focus Input flow function but im not sure if that might work with the input field’s Visible=false (?)

I haven’t tested this so cannot say for sure. Perhaps you can make the input look like an area and ask user to tap there to make “game” begin or use John’s Focus Input idea which sounds good.

I think you cannot make Input visible = false, but you can make Input Opacity 0 to make it basically invisible (Style tab -> Advanced). Or if you want the Input area to be visible, you can make the text color invisible by giving it a rgba color with alpha 0.

In either case, I think (like John said) that you cannot record arrow key this way, but letters and numbers should work.

If you try it out, let us know how it works. Sounds like an interesting test :blush:

Is this for mobile or web? For mobile How about creating 4 on screen buttons arranged up, down, left, right at the bottom and just have the user press those.

From the sounds of it Your idea seems to be more for a web app using a conventional keyboard.

Thanks, guys! You are clearly way better at thinking outside the box than I am :joy: This is meant to be a web app, so I will give the “opacity 0 input overlay” thing a shot and report back.

Update: The 0-transparency overlay worked and it’s actually coming along nicely! Still super simplistic but I’m excited to have added multiplayer functionality! Screen recording of me “playing” as two different users simultaneously: https://drive.google.com/file/d/1j_HZhPaMAbIC0-glSKvfcTWYLqTjJr22/view?usp=sharing

:mechanical_arm:

4 Likes