enso/lib/rust/ensogl/component/scroll-area
Mateusz Czapliński 7dc971f4bb
GridView auto-scrolling when navigating with keyboard (#3687)
When a GridView is navigated using the keyboard, scroll it to display the newly selected entry.

https://www.pivotaltracker.com/story/show/182593635

#### Visuals

See below for a video demonstrating automatic scrolling of the GridView when arrow keys are pressed on the keyboard. The first video below shows the default scrolling behavior in a GridView without headers.

Note:
- When the Grid View is scrolled, the mouse hover highlight moves away from the mouse position. This is not a new regression, the behavior is the same in the `develop` branch (e.g. when scrolling using the mouse).



https://user-images.githubusercontent.com/273837/190183984-91f7808c-3606-43f8-bcda-ac4d5f84e00f.mov



The video below shows the behavior in a GridView with headers when the GridView is first scrolled to its top-left corner. The following guidance from the Design Doc is enabled and showcased:

> Users can change the selected component by pressing the arrow keys. The Focus does not move up if it does not have to (in most cases, the focus is located in the second row from the bottom). Instead, the component list scrolls down if there are enough entries.

https://user-images.githubusercontent.com/273837/189151546-e50aaf22-6f4d-41cb-809f-60038305745f.mov

The next video shows the behavior in the same GridView as in the previous example when the GridView is first scrolled away from any of its boundary entries. Notably, scrolling happens only when the selection is moved using the keyboard arrow keys, not when changing the selection using the mouse. This behavior is based on a discussion with @wdanilo on Discord.

https://user-images.githubusercontent.com/273837/189151974-d992be93-f61f-4e9f-9f4c-dfe260bbec5b.mov
2022-09-21 17:41:20 +00:00
..
src GridView auto-scrolling when navigating with keyboard (#3687) 2022-09-21 17:41:20 +00:00
Cargo.toml Switch to 2021 edition (#3173) 2021-12-01 16:06:57 +01:00