#onkeypress issues

1 messages · Page 1 of 1 (latest)

candid nymph
#

(copying from other chats)
Hi! I'm trying to use onkeypress but it doesnt seem to want to work until after having clicked something interactive in my window
I literally have to click a button for it to allow me to use that event, and if i click into the window otherwise it doesnt allow me to use the key event again

And when using the onkeypress event, is there a way to get like a capital A or something that has a modifier without having to use keydown as well?
Because the Shift and other modifier variants arent tuple types

#

#general message Helpful responses

#

@serene sphinx here i created a chat for this

serene sphinx
#

im here, answer my last question with what ur trying to do

candid nymph
#

key events will only work for things that are sort of like focused, so if you want a global key handler you should have it on the outermost div of the whole page, and those will only fire when you are still focused on the page, so if you are on desktop adn hitting keybinds while the window isn't focused it also probably wont fire
So i did try this with the top level div

#

but for some reason it still doesnt fire the keypress's until after clicking a clickable button on the app first

serene sphinx
#

are you on web

#

or deskstop

candid nymph
#

Im on desktop

#

(responding to the other part in a sec)

#

and this one doesn't make much sense to me, do you want to capture the output or the modifiers on every key down even if they are tapping like KeyA their are other flags on it that have the state of modifier keys that are held down so in web you would do like event.shiftKey or event.altKey to see the boolean value if those keys are held down so on the event of pressing 'KeyA' it will also have the modifier info on that same event, you dont have to handle your own modifiers,
Oh i see how you can get the modifiers from the Event now (.modifiers())

#

that makes that easier atleast, one down!

serene sphinx
#

yeah like modifiers().shift() returns bool

candid nymph
#

Yes this is helpful, i just will pass around the event when abstracting instead of just the code so i can have those modifiers

candid nymph
#

i put onkeydowns throughout the code, including at the top level but they wont trigger on keypress unless i click something interactive first

serene sphinx
candid nymph
#

like a form?

serene sphinx
#

input {}

candid nymph
#

oh i dont use those but i can try

serene sphinx
#

you may have to do this through like web-sys

#

to attach it to the window

#

instead

#

actually ur on desktop

#

nvm

candid nymph
#

yeah im on desktop so that would be rough 🤣

serene sphinx
#

Are you trying to have a global keydown handler? like what exactly do you need for this

#

cause keydown wont fire unless focused

candid nymph
#

nah i need it to be scoped to specific areas :/

serene sphinx
#

Is there anything that you could have focused? like what is the functionality

candid nymph
#

like for one page, there is a list of things and they each should have shortcuts for managing the list

#

stuff like that

serene sphinx
#

I mean you could possibly go through just native rust since ur on desktop like OS level key events. but for onkeydown events the element that has the event listener has to be focused, so if you have the onkeydown even on the outer div some element inside of that has to have focus, you could potentially find some workaround but idk

candid nymph
#

i would if that wasnt too difficult, it is so nice to have it scoped to like the div level and stuff tho

#

Hmm what is funky tho is that it works when clicking other elements

#

its almost like a focusing thing it feels like, maybe it is more an issue with my wayland system

serene sphinx
#

I doubt its wayland, it doesn't fire for me either

candid nymph
#

Oh interesting, okay i tend to blame wayland cuz most things dont like to work in it lol

#

like file drop too

#

thats so weird it doesnt work for you either, okay ill try to figure out a different event or something

#

will test with input first

candid nymph
serene sphinx
candid nymph
#

ugh maybe some prevent_default?

#

or stop propogation

serene sphinx
#

no

candid nymph
#

no that wouldnt work right?

serene sphinx
#

No that prevents events

#

there is no way around this unless theres some hacky thing, this is just how web key events work, maybe using eval to force the div from being focused 24/7 would cause the key events to fire maybe

#

but that will be shitty

candid nymph
#

but the divs do get focused thats the weird part

#

how would you do it without keyevents on desktop? with tao?

serene sphinx
#

try setting tabindex: "0"

#

on the div

#

that might work

#

but it might be like shitty and not work sometimes

candid nymph
#

OH WOW!! that actually seems to work LOL

serene sphinx
#

but you still have to focus it

candid nymph
#

why would that be buggy?

serene sphinx
#

like click on it

serene sphinx
#

that wouldnt work for like if you had a keybind that should apply globally

#

because if you click on another element it wouldnt be focused

candid nymph
#

interesting, so i have to click on the window just once

#

and then it works for the other binds

serene sphinx
#

all that does btw is allows a div to be focusable

#

so still if it loses focus the events wont fire

candid nymph
#

why is mousehover not enough to be a focus tho lol?

serene sphinx
#

focus is more of what you are targeting rather than what you are looking at

#

so mousehover wouldn't make sense

#

for example the primary example of a element being focused is the input box you are currently typing in

#

it will only recieve key events when its focused not hovered over

#

You could even call focus on a input element manually and you it would let you type in it, without even clicking it

candid nymph
#

oh isee yeah

#

like tab focusing

#

but not on hover

serene sphinx
#

or click

candid nymph
#

is there a way to force the div to be focused without clicking?

#

like on mount

serene sphinx
#

maybe using onmounted with dioxus

#

and with eval

#

but that doesn't stop the div from being able to unfocus

#

autofocus could work too

candid nymph
#

so on mouseover reset it or something

serene sphinx
#

well I don't know if multiple elements could be focused at once

#

i dont think its possible

#

so if you had something that forced focus on it 24/7 it would break everything else

#

you can set autofocus: true on it

#

that might work

candid nymph
#

yeah autofocus doesnt work 🤔

serene sphinx
#

probably cause its a div

#

but you can see if you can set focus on whatever onmounted with dioxus does

candid nymph
#

hm okay yeah, is focus an attribute i can set?

serene sphinx
#

should be able to with .set_focus()

#

with the onmounted event

candid nymph
#

oh nice yeah

# 
            onmounted: move |e| async move { _ = e.set_focus(true).await },
#

tried this but didnt do anything haha, the result could be erroring

#

this is getting hacky now tho 🤣

serene sphinx
#

theres prob a better way

#

ngl

candid nymph
#

yeah there has to be

#

this is a more manual way of doing it i think

#

though i wouldnt have so much scoping like i would with onkeydown

serene sphinx
#

ur desktop

candid nymph
#

found this which is cool

#

tho not sure if we have the same ref feature like that

serene sphinx
candid nymph
#

Oh okay , I'll try and convert that and see if that works

#

Tho it would mess up all the internal divs

candid nymph
#

Its all funky