qgroundcontrol icon indicating copy to clipboard operation
qgroundcontrol copied to clipboard

Improve ability to navigate with TAB key

Open gillamkid opened this issue 1 year ago • 14 comments

Description

There was little to no visual indication to show which buttons where focused when TAB was pressed. I added visual queues and made so the expected inputs would be focused when pressing TAB

Sponsor

This contribution was sponsored by Firestorm 654d4f9476ff2a38f37e9ab9_firestorm-homepage-share-img-2

Demo of new TAB navigating ability (Light mode)

https://github.com/user-attachments/assets/819d4375-741c-479a-9782-a0b83fa66956

Demo of new TAB navigating ability (Dark mode)

https://github.com/user-attachments/assets/e35e2702-e30a-4f99-aa53-de54b6bc8ebf

gillamkid avatar Sep 18 '24 05:09 gillamkid

This pull request has been mentioned on Discussion Forum for PX4, Pixhawk, QGroundControl, MAVSDK, MAVLink. There might be relevant details there:

https://discuss.px4.io/t/px4-sync-q-a-sep-18-2024/40762/4

DronecodeBot avatar Sep 18 '24 07:09 DronecodeBot

This pull request has been mentioned on Discussion Forum for PX4, Pixhawk, QGroundControl, MAVSDK, MAVLink. There might be relevant details there:

https://discuss.px4.io/t/px4-sync-q-a-sep-18-2024/40762/1

DronecodeBot avatar Sep 18 '24 14:09 DronecodeBot

Hey @HTRamsey can you take a quick look here? I have gone through the changes and they seem fine to me, but another set of eyes wouldn't hurt.

Thank you @gillamkid

mrpollo avatar Sep 18 '24 15:09 mrpollo

I'm still not seeing the videos: Screenshot 2024-09-18 at 11 56 59 AM

DonLakeFlyer avatar Sep 18 '24 18:09 DonLakeFlyer

I'm still not seeing the videos:

Maybe try using Google Chrome on a desktop? I don't see the videos on my phone, but I've tried several computers in Chrome and it works for them all.

gillamkid avatar Sep 18 '24 19:09 gillamkid

What happens with these sorts of changes on mobile? For example if you click a button in a dialog which then does some work? Does that now leave a focus visual on that button on Mobile which doesn't really make sense?

DonLakeFlyer avatar Sep 18 '24 19:09 DonLakeFlyer

Chrome shows me the videos. I built it myself on OSX but it's not working for me. For example in the instrument value edit dialog it will only move between two text fields in the range section. Strange.

DonLakeFlyer avatar Sep 18 '24 19:09 DonLakeFlyer

Changing everything from focusPolicy: clickFocus to focusPolicy: tabFocus is going to cause problems. Text fields do validation on loss of focus. If other controls don't have click focus then it doesn't that trigger validation.

Reproduce:

  • Go to App Settings - Fly View
  • Change one of the numeric text fields to "asdf"
  • Click a slider switch to change the enable state
  • With this pull - Field validation doesn't trigger
  • Current QGC master - Field validation triggers

Making sure field validation happens before you close out some part of the ui ends up being tricky. I think this might end up breaking that. I also thinks it's way better to trigger field validation when you click on any other ui control.

DonLakeFlyer avatar Sep 18 '24 19:09 DonLakeFlyer

A reason for the current state of affairs is that QGC kind of follows a more mobile and or Mac style of keyboard handling. You can tab between text fields but not every single thing. And there is limited support for things like Enter/Esc. It's been my experience that making a good end to end keyboard experience with UI takes a ton of work. It doesn't come for free by creating just any UI. And if you do it half-assed, well it ends up that way and doesn't add much value. I also tend to think all the focus display UI ends up cluttering everything up. Again for not enough value.

If the tabFocus only thing worked then it would be great since I'd assume then the extra focus display would only start showing up if someone actually pressed tab. But without that I'm kind of negative on the whole tab focus thing cluttering up the ui if it's going to be there all the time.

Do you have good reasons why full keyboard support is important?

DonLakeFlyer avatar Sep 18 '24 20:09 DonLakeFlyer

I wanted to fix this because TAB support already half works (focus will hop to different elements), it just isn't consistently visually indicated. Also some elements that one would expect to be in the TAB focus chain (namely buttons) could not be tabbed too

Importance: sometimes I like to tab through a form, and I can't in QGC, at least not with the visual focus queues I would like

I'll try to make some fixes so this can be good enough to merge. I've never built for android or macOS, but I'll experiment with that a bit and see if I can get this working on all supported devices

gillamkid avatar Sep 19 '24 16:09 gillamkid

sometimes I like to tab through a form, and I can't in QGC, at least not with the visual focus queues I would like

Ok, but I don't want to support that to the detriment of a crufty UI for all users. Nor do I want to turn QGC into a Windows App with all the UI ridiculousness that goes along with that. I can live with keyboard support and focus indicators like Ubuntu does them. That means they normally don't show. Clicking a control with the mouse doesn't cause them show. They only show up the first time you click tab and start moving around a form.

DonLakeFlyer avatar Sep 20 '24 21:09 DonLakeFlyer

They only show up the first time you click tab and start moving around a form.

From poking around Qml docs. This means using visualFocus and not activeFocus to determine if focus visuals should show on a control.

DonLakeFlyer avatar Sep 22 '24 02:09 DonLakeFlyer

Also the focusPolicy needs to be strongFocus which is both tab and click. This fixes the validation on click away problem.

DonLakeFlyer avatar Sep 22 '24 16:09 DonLakeFlyer

I hacked around with this again last night trying different things. Still no luck getting it to work on Mac. No idea why.

DonLakeFlyer avatar Sep 23 '24 16:09 DonLakeFlyer

Closing since I don't have immediate plans to finish this. I may take a stab at this again someday.

gillamkid avatar Nov 06 '24 17:11 gillamkid