rds1983 / Myra

UI Library for MonoGame, FNA and Stride
MIT License
704 stars 93 forks source link

Horizontal Scrolling with Mouse Wheel #350

Closed gianluca-moro closed 2 years ago

gianluca-moro commented 2 years ago

I am currently building a UI for my new game and I am using Myra for the first time.

Basically, I want a horizontal list of image buttons. I am using a ScrollViewer with a HorizontalStackPanel as its Content. Something like the following:

<Project>
  <ScrollViewer>
    <HorizontalStackPanel>
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
      <ImageTextButton Text="Test" Width="200" Padding="0, 0, 10, 0" Background="#666666FF" />
    </HorizontalStackPanel>
  </ScrollViewer>
</Project>

This works fine, however, I am not able to scroll horizontally using the scroll wheel. I can only scroll by draging the scroll bar at the bottom. I can use the scroll wheel for vertical scrolling, but not for horizontal.

My workaround to scroll with the scroll wheel is the following:

_desktop.MouseWheelChanged += (s, e) =>
            {
                if (!scrollViewer.IsMouseInside) return;

                if (e.Data > 0)
                {
                    var currScrollPosition = scrollViewer.ScrollPosition;
                    currScrollPosition.X = currScrollPosition.X - _scrollSpeed >= 0 ? currScrollPosition.X - _scrollSpeed : 0;
                    scrollViewer.ScrollPosition = currScrollPosition;
                }
                else
                {
                    var currScrollPosition = scrollViewer.ScrollPosition;
                    currScrollPosition.X = currScrollPosition.X + _scrollSpeed < scrollViewer.ScrollMaximum.X ? currScrollPosition.X + _scrollSpeed : scrollViewer.ScrollMaximum.X;
                    scrollViewer.ScrollPosition = currScrollPosition;
                }
            };

This works well, but I am still curious if there is an easier way to allow horizontal scrolling using the scroll wheel? Thanks.

rds1983 commented 2 years ago

There isn't. Only vertical scrolling is allowed via mouse.

gianluca-moro commented 2 years ago

Ok, thanks for the quick reply. I guess I have to stick with my workaround which works for my needs :)