Instead of hiding keyboard I would like to tight an action listener to the Enter button.
To my understanding, it might have different behavior on iOS and Android, as well as it might be not very reliable.
I will appreciate any suggestions.
You can use setDoneListener on text components e.g.:
myTextField.setDoneListener(e -> doSomething());
Related
I'm using ReactJS and I have a lot of <button> in my code. I notice that I can use the Tab key to move over the button and there will be an outline on focused button like this:
But on this website which I'm trying to replicate, the buttons they use do not get Tab-focused on normal but just when we turn on the VoiceOver accessibility mode.
And the border of the Tab focus is also different.
I wonder how can we implement this in React?
Changing tabIndex to 0 or -1 doesn't work.
Thanks everyone!
Update
I ask because this leads to a problem:
If I use the UI Keyboard (UIKB) first and then try to type with the real keyboard keydown event. The tab focus would just stuck on the UIKB letter and return it twice.
This doesn't happen on the Wordle game because they just allow using tab focus when in accessibility mode.
tabIndex = -1 doesn't work because I want to allow the user use the tab focus just in a11y mode like Wordle, I don't want to totally disable it.
I have a list of items. I want to be able to handle both an onClick and onLongPress events. For this purpose, I am using this hook here.
My issue is that on mobile when you start to press on the item, but them move your finger out of the "hitbox" (finger no longer on the item), this will still trigger a onLongPress event. Expected behaviour is that the user should keep their finger on the item when long pressing, and only then should the event trigger.
I found this library which doesn't have this issue but ONLY works on mobile, and I'm trying to make my app compatible with all platforms, including the browser (as a PWA): this one
Any sort of advice on how to move forward would be greatly appreciated.
I have a link in my React application that calls an onClick handler as follows:
<a onClick={handleClick}>Link</a>
However, since I'm not using the native href attribute, this handler does not get activated when I focus the link, then press Enter.
Now, of course I could add an onKeyDown handler, then check whether the key that was pressed is Space or Enter and, if it is, call handleClick. However, I'm afraid that that won't be enough to capture all accessibility nuances, nor whether it will behave exactly like regular links.
Thus, the question is: is there a way to indicate that I want my function to be called when the link is followed by whatever possible interaction method?
an <a> tag without an href is no longer valid. Instead of trying to reimplement focus and keyboard logic, use a button and style however you like. Semantically, if it is firing an onClick it should most likely be a button and will be most accessible.
For reference https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/anchor-is-valid.md
You have the right idea onKeyDown or something needs to be set.
Ideally I would recommend using a library like Microsoft's FabricUI or Material which do all of this behind the scenes.
Alternatively you can use react-a11y package which has checks for such things. Following is the check for onClick
https://github.com/reactjs/react-a11y/blob/master/docs/rules/click-events-have-key-events.md
This is my code guys
ShareButton share = new ShareButton();
share.setIcon(icon);
share.setTextToShare("Text yada yada");
tb.add(BorderLayout.EAST, share);
Its just disappearing from the bar after a single click. I also wanna know how to invoke the share functionality on a command thats on the side menu
Thanks in advance
Apparently its a simulator problem. Works well on device
The way you add the button to the toolbar is illegal and incorrect. It will behave erratically across devices based on the different behaviors.
You should use a command such as addMaterialCommand on the toolbar and then invoke the share functionality in Display.
I'm using this code to grab barcodes from the camera:
http://blogs.msdn.com/b/stephe/archive/2011/11/07/wp7-real-time-video-scan-a-barcode-qr-code-in-your-app-using-zxing-lib.aspx
It works fine if it is called from a button press, but if you put it in page load nothing happens, I assume this is a security feature?
Is there any way around it?
Thanks
All must be Ok with Loaded event. Maybe you put code inside constructor instead...