Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Disable horizontal scrolling in code examples #704

Open
3 of 16 tasks
jdoubleu opened this issue Jun 15, 2021 · 6 comments
Open
3 of 16 tasks

Disable horizontal scrolling in code examples #704

jdoubleu opened this issue Jun 15, 2021 · 6 comments
Labels
enhancement Expand an existing sample or add feature to app

Comments

@jdoubleu
Copy link
Contributor

Describe the bug
The contents of some code examples expand further than the main content column of the current page. This introduces horizontal scrolling of the code examples through <ContentExample.Xaml> and effectively the surrounding ScrollView. The horizontal scrolling is triggered as soon as the user hovers over the area (i.e. <ContentExample.Xaml>).

This impacts the overall usability, because the scrolling in the page is interrupted as soon as the user hovers to code area.

Steps to reproduce the bug

Steps to reproduce the behavior:

  1. Go to the ListVIew examples page
    a. Adjust the XAML Controls Gallery app's width so that the sidebar is just shown.
  2. Place your cursor in the center of the screen, or somewhere else on the page.
  3. Try to scroll down.

Actual behavior
You should notice, that as soon as your mouse enters a code example area, the scrolling stops. Instead you are horizontally scrolling in that area.

Expected behavior
Page scrolling is not interrupted.

Screenshots

image

Version Info

  • App downloaded from Store
    • If so, which version? (Found on the Settings page of the app.)
  • App built locally from source
    • If so, which branch? master

Additional context

Suggestion: disable horizontal scrolling of the code examples through user input completely. Instead only show the scrollbar so the use can drag it manually.

Windows 10 version:

  • Insider Build (xxxxx)
  • May 2020 Update (19041)
  • November 2019 Update (18363)
  • May 2019 Update (18362)
  • October 2018 Update (17763)
  • April 2018 Update (17134)
  • Fall Creators Update (16299)
  • Creators Update (15063)
  • Anniversary Update (14393)

Device form factor:

  • Desktop
  • Mobile
  • Xbox
  • Surface Hub
  • IoT
@bpulliam bpulliam added the enhancement Expand an existing sample or add feature to app label Oct 12, 2022
@Jay-o-Way
Copy link
Contributor

+1 from me

@karkarl
Copy link
Collaborator

karkarl commented Feb 1, 2024

The question here is more-so what one would expect when scrolling? With the expander however, the horizontal scrolling annoyance is less of an issue. In the meantime, I will bring this up with the design team.

@Jay-o-Way
Copy link
Contributor

Note that some mice are able to scroll both vertically and horizontally, via the wheel.

@Jay-o-Way
Copy link
Contributor

The question here is more-so what one would expect when scrolling?

Can't speak for everybody, but my answer would be not a horizontal scroll :)

@karkarl
Copy link
Collaborator

karkarl commented May 20, 2024

Commenting here as well for posterity: I'm ok with disabling horizontal scroll, it annoys me quite a lot too :)

@Jay-o-Way
Copy link
Contributor

Jay-o-Way commented May 21, 2024

Commenting here as well for posterity: I'm ok with disabling horizontal scroll, it annoys me quite a lot too :)

To clear up ambiguity: actively disabling HorizontalScroll will make it impossible, so that's a no-go. PR 1540 solves this issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement Expand an existing sample or add feature to app
Projects
None yet
Development

No branches or pull requests

4 participants