Mouse wheel not working in ScrollView on Windows

Question

Mouse wheel not working in ScrollView on Windows

Eigil Krogh Sorensen 76

.net maui 7.0.81 My app has a ScrollView. On Windows the view doesn't scroll when the mouse wheel is rolled.

			VerticalOptions="FillAndExpand"

What can be te reason for that ? It works fine on MacCatalyst.

Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Reputation points Microsoft External Staff

2023-04-22T09:54:15.0733333+00:00

I created an empty template MAUI project and added several controls in the ScrollView of the MainPage, the ScrollView can scroll when the mouse wheel is rolled. I can't reproduce your issue. Could you share some code snippets about the ScrollView so that I can test?

Eigil Krogh Sorensen 76

The .xaml file is shown below. In C# code a lot of frames containing a lot of labels are added to "GlobalStackLayout" BTW: PgUp, PgDn and arrow up/down doesn't work either.


<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
	x:Class="MyApp.View.MainPage"
	xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
	xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
	xmlns:ios="clr-namespace:Microsoft.Maui.Controls.PlatformConfiguration.iOSSpecific;assembly=Microsoft.Maui.Controls"
	xmlns:viewmodel="clr-namespace:MyApp.ViewModel"
	Title="something Calculator"
	ios:Page.UseSafeArea="True"
	x:DataType="viewmodel:MainPageViewModel">

	<StackLayout
		x:Name="TopStack"
		Orientation="Vertical">

		<StackLayout
			Orientation="Horizontal">
			<Button
				Command="{Binding ControlsButton_ClickedCommand}"
				HorizontalOptions="Start"
				Text="Controls" />
			<Button
				Command="{Binding HelpPageCommand}"
				HorizontalOptions="Start"
				Text="?" />
			<ActivityIndicator
				HorizontalOptions="FillAndExpand"
				IsRunning="{Binding TheActivityIndicatorRunning}"
				IsVisible="{Binding TheActivityIndicatorRunning}"
				Color="{StaticResource Primary}"
				VerticalOptions="FillAndExpand" />
		</StackLayout>

		<Grid
			IsVisible="{Binding HeaderGridIsVisible}"
			VerticalOptions="Start">
			<Grid.RowDefinitions>
				<RowDefinition
					Height="Auto" />
			</Grid.RowDefinitions>
			<Grid.ColumnDefinitions>
				<ColumnDefinition
					Width="*" />
				<ColumnDefinition
					Width="*" />
				<ColumnDefinition
					Width="*" />
				<ColumnDefinition
					Width="*" />
				<ColumnDefinition
					Width="*" />
			</Grid.ColumnDefinitions>
			<Label
				x:Name="SelItmsLabel"
				Grid.Row="0"
				Grid.Column="2"
				FontAttributes="Bold"
				HorizontalOptions="CenterAndExpand"
				Text="Select Item(s):"
				VerticalOptions="End" />
			<Label
				x:Name="DepositLabel"
				Grid.Row="0"
				Grid.Column="3"
				HorizontalOptions="EndAndExpand"
				Text="Deposit"
				TextDecorations="Underline"
				VerticalOptions="End" />
			<Label
				x:Name="BalanceLabel"
				Grid.Row="0"
				Grid.Column="4"
				HorizontalOptions="End"
				Text="Balance"
				TextDecorations="Underline"
				VerticalOptions="End" />

		</Grid>

		<ScrollView
			x:Name="theXamlScrollView"
			VerticalOptions="FillAndExpand"
			VerticalScrollBarVisibility="Always">
			<StackLayout
				x:Name="GlobalStackLayout" />
		</ScrollView>

	</StackLayout>

</ContentPage>

Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Microsoft External Staff

I test the code snippets you provided, I try many frames like the following code, but I still cannot reproduce the issue. For further investigation, could you share the ViewModel？ What's the detailed VS version? And you can check if ScrollView expands to its full content height and doesn't scroll. Please see Layout behavior changes from Xamarin.Forms - .NET MAUI | Microsoft Learn

<ScrollView
			x:Name="theXamlScrollView"
			VerticalOptions="FillAndExpand"
			VerticalScrollBarVisibility="Always">
			<StackLayout
				x:Name="GlobalStackLayout">
                <Frame>
                <Label
                Text="Hello, World!"
                SemanticProperties.HeadingLevel="Level1"
                FontSize="32"
                HorizontalOptions="Center" />
                </Frame>
            ......// a lot of frame
           </StackLayout>
		</ScrollView>

Eigil Krogh Sorensen 76 Reputation points

2023-04-25T17:44:39.8366667+00:00

I forgot that the labels inside the frames are inside a grid. That is GlobalStackLayout contains a lot of frames gontaining a grid containing a lot of labels. Do you have the top rows like in my xaml ?

Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Microsoft External Staff

I have the top rows like in your xaml. As you described, I modify the Grid and Frame in the ScrollView, does the page like the following format? (I still cannot reproduce your issue.)

<StackLayout ..>
    <StackLayout ..>
    <Grid...>
        <ScrollView x:Name="theXamlScrollView"...>
			<StackLayout ..>// GlobalStackLayout
                <Grid>
                    <Grid.RowDefinitions>
                       <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                    // a lot of rows (one frame as one row)
                    </Grid.RowDefinitions>
                        
                    <Frame Grid.Row="0">
                        <Label... />
                    </Frame>
                    <Frame Grid.Row="1">
                        <Label... />
                    </Frame>
                ......// a lot of frames， Grid.Row = 2, 3, 4, 5, 6 .....
                </Grid>
            
             </StackLayout>
        </ScrollView>
 </StackLayout>

1 answer

Your answer

Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Reputation points Microsoft External Staff

2023-04-22T09:54:15.0733333+00:00

I created an empty template MAUI project and added several controls in the ScrollView of the MainPage, the ScrollView can scroll when the mouse wheel is rolled. I can't reproduce your issue. Could you share some code snippets about the ScrollView so that I can test?
Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Reputation points Microsoft External Staff

2023-04-25T08:32:23.48+00:00

I test the code snippets you provided, I try many frames like the following code, but I still cannot reproduce the issue. For further investigation, could you share the ViewModel？ What's the detailed VS version? And you can check if ScrollView expands to its full content height and doesn't scroll. Please see Layout behavior changes from Xamarin.Forms - .NET MAUI | Microsoft Learn

<ScrollView x:Name="theXamlScrollView" VerticalOptions="FillAndExpand" VerticalScrollBarVisibility="Always"> <StackLayout x:Name="GlobalStackLayout"> <Frame> <Label Text="Hello, World!" SemanticProperties.HeadingLevel="Level1" FontSize="32" HorizontalOptions="Center" /> </Frame> ......// a lot of frame </StackLayout> </ScrollView>
Eigil Krogh Sorensen 76 Reputation points

2023-04-25T17:44:39.8366667+00:00

I forgot that the labels inside the frames are inside a grid. That is GlobalStackLayout contains a lot of frames gontaining a grid containing a lot of labels. Do you have the top rows like in my xaml ?
Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Reputation points Microsoft External Staff

2023-04-26T02:55:59.7333333+00:00

I have the top rows like in your xaml. As you described, I modify the Grid and Frame in the ScrollView, does the page like the following format? (I still cannot reproduce your issue.)

<StackLayout ..> <StackLayout ..> <Grid...> <ScrollView x:Name="theXamlScrollView"...> <StackLayout ..>// GlobalStackLayout <Grid> <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="*" /> // a lot of rows (one frame as one row) </Grid.RowDefinitions> <Frame Grid.Row="0"> <Label... /> </Frame> <Frame Grid.Row="1"> <Label... /> </Frame> ......// a lot of frames， Grid.Row = 2, 3, 4, 5, 6 ..... </Grid> </StackLayout> </ScrollView> </StackLayout>

Answer 1

Eigil Krogh Sorensen 76

Oops. It turns out that the error goes away if I disable X-Mouse Button Control (which I had running to get "natural" scroll direction).

Sorry for the inconvenience!

-- Eigil

Wenyan Zhang (Shanghai Wicresoft Co,.Ltd.) 36,436 Reputation points Microsoft External Staff

2023-04-27T01:07:56.31+00:00

Never mind, thanks for your sharing.

Share via

Mouse wheel not working in ScrollView on Windows

1 answer

Your answer