问题
I am trying to figure out how to get the mouse scroll working on a wpf window with a scrollviewer and a datagrid within it. The WPF and C# code is below
<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Auto">
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid Grid.Row="0">
<Border Name="DataGridBorder" BorderThickness="2" Margin="1" CornerRadius="4" BorderBrush="#FF080757">
<dg:DataGrid AutoGenerateColumns="False" Name="ValuesDataGrid"
BorderThickness="0" CanUserResizeColumns="True" FontWeight="Bold" HorizontalScrollBarVisibility="Auto"
CanUserReorderColumns="False" IsReadOnly="True" IsTextSearchEnabled="True" AlternationCount="2"
SelectionMode="Extended" GridLinesVisibility="All"
HeadersVisibility="Column" CanUserAddRows="False" CanUserDeleteRows="False" CanUserResizeRows="False" CanUserSortColumns="False"
RowDetailsVisibilityMode="Collapsed" SelectedIndex="0"
RowStyle="{StaticResource CognitiDataGridRowStyle}"
>
<dg:DataGrid.Columns>
<dg:DataGridTemplateColumn Header="Title" >
<dg:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<TextBlock HorizontalAlignment="Left" VerticalAlignment="Center" Text="{Binding Path=Name}" FontWeight="Normal" />
</StackPanel>
</DataTemplate>
</dg:DataGridTemplateColumn.CellTemplate>
</dg:DataGridTemplateColumn>
</dg:DataGrid.Columns>
</dg:DataGrid>
</Border>
</Grid>
<Button Grid.Row="1" Height="90" >hello world</Button>
</Grid>
</ScrollViewer>
and the C# code is as follows
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
initialize();
}
public void initialize()
{
ObservableCollection<MyObject> testList = new ObservableCollection<MyObject>();
for (int i = 0; i < 20; i++)
{
MyObject my = new MyObject("jack " + i);
testList.Add(my);
}
ValuesDataGrid.ItemsSource = testList;
}
}
public class MyObject
{
public string Name { get; set; }
public MyObject(string name)
{
Name = name;
}
}
The problem i am facing is that when using the mouse to scroll, it works fine when it is over the button but as soon as i move the mouse pointer over the grid and try to scroll, nothing happens. I am able to move the scrollbar of the scrollviewer directly though. I am still a wpf novice so any help on how to get the mouse scroll to work over the datagrid would be appreciated. I am guessing there should be a pretty easy solution for this but I havent been able to figure it out
回答1:
I think Dave's solution is a good one. However, one recommendation I'd make is to catch the PreviewMouseWheel event on the scrollviewer instead of on the datagrid. If you don't, you might notice some minor differences based on whether you're scrolling over the datagrid or the scroll bar itself. The reasoning is that the scrollviewer will be handling scrolling when the mouse is hovered over the scrollbar, and the datagrid event will handle the scrolling when over the datagrid. For instance, one mouse wheel scroll over the datagrid might bring you farther down your list then it would when over the scroll bar. If you catch it on scrollviewer preview event, all will use the same measurement when scrolling. Also, if you catch it this way, you won't need to name the scrollviewer element, as you won't need a reference to the object since you can just type cast the sender object passed into the scrollviewer PreviewMouseWheel event. Lastly, I'd recommend marking the event handled at the end of the event, unless you need to catch it in an element further down the heirarchy for some reason. Example below:
private void ScrollViewer_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
ScrollViewer scv = (ScrollViewer)sender;
scv.ScrollToVerticalOffset(scv.VerticalOffset - e.Delta);
e.Handled = true;
}
回答2:
I'm assuming the DataGrid does not need to scroll - Set the VerticalScrollBar="None" on the DataGrid.
The DataGrid swallows the mouse scroll event.
What I found is to use the PreviewMouseWheel event to scroll the container that you want to scroll. You will need to name the scrollviewer to change the Vertical offset.
private void DataGrid_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset-e.Delta);
}
回答3:
I tried Don B's solution and it's solves the issue with scrolling over a data grid pretty well for the cases when you don't have other inner scrollable controls.
For the case when the scroll viewer has as children other scrollable controls and a data grid, then that requires that the event shouldn't be marked as handled at the end of the event handler for the main scroll viewer so it could be catched also in the inner scrollable controls, however that has the side effect that when the scroll should occur only on the inner scrollable control, it will also occur on the main scroll viewer.
So I've updated Dave's solution with the difference for how the scroll viewer is found so it won't be necessary to know the name of the scroll viewer:
private void DataGrid_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
ScrollViewer scrollViewer = (((DependencyObject)sender).GetVisualParent<ScrollViewer>());
scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
}
回答4:
To enable touch support you might also want to set ScrollViewer.PanningMode to None on your DataGrid and set the same property to VerticalFirst or other value on your top level ScrollViewer
Example
<ScrollViewer VerticalScrollBarVisibility="Auto" Margin="5" PanningMode="VerticalFirst">
<DataGrid ScrollViewer.PanningMode="None" ItemsSource="{Binding Items}" />
</ScrollViewer>
Of course, also use the PreviewMouseWheel event as indicated by Don B's answers to fix the original mouse scrolling issue.
private static void ScrollViewer_PreviewMouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e)
{
var scrollViewer = (ScrollViewer)sender;
scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
e.Handled = true;
}
Or, you can simply set the following Attached Property to your ScrollViewer
public class TopMouseScrollPriorityBehavior
{
public static bool GetTopMouseScrollPriority(ScrollViewer obj)
{
return (bool)obj.GetValue(TopMouseScrollPriorityProperty);
}
public static void SetTopMouseScrollPriority(ScrollViewer obj, bool value)
{
obj.SetValue(TopMouseScrollPriorityProperty, value);
}
public static readonly DependencyProperty TopMouseScrollPriorityProperty =
DependencyProperty.RegisterAttached("TopMouseScrollPriority", typeof(bool), typeof(TopMouseScrollPriorityBehavior), new PropertyMetadata(false, OnPropertyChanged));
private static void OnPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var scrollViewer = d as ScrollViewer;
if (scrollViewer == null)
throw new InvalidOperationException($"{nameof(TopMouseScrollPriorityBehavior)}.{nameof(TopMouseScrollPriorityProperty)} can only be applied to controls of type {nameof(ScrollViewer)}");
if (e.NewValue == e.OldValue)
return;
if ((bool)e.NewValue)
scrollViewer.PreviewMouseWheel += ScrollViewer_PreviewMouseWheel;
else
scrollViewer.PreviewMouseWheel -= ScrollViewer_PreviewMouseWheel;
}
private static void ScrollViewer_PreviewMouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e)
{
var scrollViewer = (ScrollViewer)sender;
scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
e.Handled = true;
}
}
Usage
<ScrollViewer b:TopMouseScrollPriorityBehavior.TopMouseScrollPriority="True" VerticalScrollBarVisibility="Auto" Margin="5" PanningMode="VerticalFirst">
<DataGrid ScrollViewer.PanningMode="None" ItemsSource="{Binding Items}" />
</ScrollViewer>
Where b: is the namespace that contains this behavior
This way your no code-behind is needed and your app is purely MVVM
回答5:
An improvement to Don B's solution is to avoid using ScrollToVerticalOffset.
scv.ScrollToVerticalOffset(scv.VerticalOffset - e.Delta);
VerticalOffset - Delta results in a pretty jarring experience. The ScrollViewer puts a lot of thought into making the movement smoother than that. I think it also scales the delta down based on dpi and other factors...
I found it's better to catch and handle the PreviewMouseWheelEvent and send a MouseWheelEvent to the intended ScrollViewer. My version of Don B's solution looks like this.
private void ScrollViewer_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
var eventArg = new MouseWheelEventArgs(e.MouseDevice, e.Timestamp, e.Delta);
eventArg.RoutedEvent = UIElement.MouseWheelEvent;
eventArg.Source = e.Source;
ScrollViewer scv = (ScrollViewer)sender;
scv.RaiseEvent(eventArg);
e.Handled = true;
}
回答6:
@fjch1997, I used your solution and it works pretty well. There is only one problem which I found. It's connected with the comment of @Vadim Tofan:
For the case when the scroll viewer has as children other scrollable controls and a data grid, then that requires that the event shouldn't be marked as handled at the end of the event handler for the main scroll viewer so it could be catched also in the inner scrollable controls, however that has the side effect that when the scroll should occur only on the inner scrollable control, it will also occur on the main scroll viewer.
I also tried to remove e.Handled = true statement, but then the effect is not nice - both scrolls are moved in the same time. So, finally I enhanced a little bit event handler method to the following one:
private static void ScrollViewer_PreviewMouseWheel(object sender, System.Windows.Input.MouseWheelEventArgs e)
{
ScrollViewer scrollViewer = (ScrollViewer)sender;
FrameworkElement origicalControlSender = e.OriginalSource as FrameworkElement;
ScrollViewer closestScrollViewer = origicalControlSender.GetParent<ScrollViewer>();
if (closestScrollViewer != null && !ReferenceEquals(closestScrollViewer, scrollViewer))
{
return;
}
scrollViewer.ScrollToVerticalOffset(scrollViewer.VerticalOffset - e.Delta);
e.Handled = true;
}
public static T GetParent<T>(this FrameworkElement control)
where T : DependencyObject
{
FrameworkElement parentElement = control?.Parent as FrameworkElement;
if (parentElement == null)
{
return null;
}
T parent = parentElement as T;
if (parent != null)
{
return parent;
}
return GetParent<T>(parentElement);
}
This now prevents the outside scroller to scroll in case inner ScrollViewer exists.
回答7:
Guys I`ve seen most of the solution posted over here and fundamentally all of them are right, but I think there is an easiest and more elegant syntax that we could apply.
Assuming that we don't need to scroll with our data grid and instead we would like to scroll with our MainWindow
fallowing "Dave" and "Vladim Tofan" answer
Private Void Scrlll(Object sebder, MouseWheelEventArgs e)
{
var windows = (Window.GetWindow(this) as MainWindow).MainScroll;
windows.ScrollToVerticalOffset(windows.VerticalOffset - e.Delta);
}
Sorry, for bad english.
回答8:
I found that ScrollViewer can't be concatenated, which means if it is concatenated like in your case the Grid starts under the ScrollViewer tag and in the Grid we have DataGrid and in the DataGrid again the ScrollViewer property has been set. i.e.
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="45" />
<RowDefinition Height="100*" />
<RowDefinition Height="105" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0"
Grid.Column="0"
Margin="10,0,0,0"
HorizontalAlignment="Left"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Vessel: " />
<TextBox Height="30"
Width="300"
Margin="70,0,0,0"
HorizontalAlignment="Left"
BorderThickness="1,1,1,1"
IsReadOnly="True"
Name="txtVessel" />
<Label Grid.Row="0"
Grid.Column="2"
Margin="0,0,185,0"
HorizontalAlignment="Right"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Month:" />
<StackPanel Orientation="Horizontal"
Grid.Row="0"
Grid.Column="2"
Margin="0,0,0,0"
HorizontalAlignment="Right">
<ComboBox BorderThickness="2"
HorizontalAlignment="Right"
Name="CmbMonth"
VerticalAlignment="Center"
Width="90" />
<ComboBox BorderThickness="2"
HorizontalAlignment="Right"
Margin="5,0,0,0"
Name="CmbYear"
VerticalAlignment="Center"
Width="90" />
</StackPanel>
<Grid Grid.Row="1"
Grid.ColumnSpan="2">
<Grid.RowDefinitions>
<RowDefinition Height="45" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30" />
<ColumnDefinition Width="220" />
<ColumnDefinition Width="80" />
<ColumnDefinition Width="80" />
<ColumnDefinition Width="80" />
<ColumnDefinition Width="80" />
<ColumnDefinition Width="120" />
<ColumnDefinition Width="120" />
<ColumnDefinition Width="140*" />
</Grid.ColumnDefinitions>
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="0" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="1" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="2" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="3" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="4" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="5" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="6" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="7" />
<Border BorderBrush="Black"
BorderThickness="0,1,1,1"
Grid.Row="0"
Grid.Column="8" />
<Label Grid.Row="0"
Grid.Column="1"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Item" />
<Label Grid.Row="0"
Grid.Column="2"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Maker" />
<Label Grid.Row="0"
Grid.Column="3"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Model" />
<Label Grid.Row="0"
Grid.Column="4"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content=" Part No.
Serial No." />
<Label Grid.Row="0"
Grid.Column="5"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Condition" />
<Label Grid.Row="0"
Grid.Column="6"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content=" Onboard
 Calibr/Test" />
<Label Grid.Row="0"
Grid.Column="7"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content=" Shore
 Callibration" />
<Label Grid.Row="0"
Grid.Column="8"
Margin="0,0,0,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Remarks" />
</Grid>
<Border Grid.Row="2"
Grid.ColumnSpan="2">
<ScrollViewer Grid.Row="2"
Grid.ColumnSpan="2"
CanContentScroll="True"
HorizontalScrollBarVisibility="Disabled"
VerticalScrollBarVisibility="Auto"
Name="ScrollViewer3"
Margin="0,0,0,0">
<Grid Name="grdOnBoardCalibrationRecord"
Margin="0,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30"></ColumnDefinition>
<ColumnDefinition Width="220"></ColumnDefinition>
<ColumnDefinition Width="80"></ColumnDefinition>
<ColumnDefinition Width="80"></ColumnDefinition>
<ColumnDefinition Width="80"></ColumnDefinition>
<ColumnDefinition Width="80"></ColumnDefinition>
<ColumnDefinition Width="120"></ColumnDefinition>
<ColumnDefinition Width="120"></ColumnDefinition>
<ColumnDefinition Width="140*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Border Grid.Column="0"
BorderThickness="1,0,1,1"
BorderBrush="Black"
Grid.RowSpan="26"></Border>
<Border Grid.Column="1"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
<Border Grid.Column="2"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
<Border Grid.Column="3"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
<Border Grid.Column="4"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
<Border Grid.Column="5"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
<Border Grid.Column="6"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
<Border Grid.Column="7"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
<Border Grid.Column="8"
BorderThickness="0,1,1,1"
Grid.RowSpan="26"></Border>
</Grid>
</ScrollViewer>
</Border>
<Grid Grid.Row="3"
Grid.ColumnSpan="2">
<Grid.RowDefinitions>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="40"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBox Grid.Row="0"
Grid.Column="0"
Height="30"
Width="300"
TextAlignment="Center"
Background="Gray"
IsReadOnly="True"
Margin="0,0,0,0"
HorizontalAlignment="Right"
VerticalAlignment="Bottom"
BorderThickness="1,1,1,1"
Name="txtChiefEngineer" />
<Label Grid.Row="1"
Grid.Column="1"
Margin="0,0,100,0"
HorizontalAlignment="Right"
VerticalAlignment="Center"
FontWeight="Bold"
Content="Chief Engineer" />
<StackPanel Orientation="Horizontal"
Grid.Row="2"
Margin="0,0,0,0">
<Label Name="lblonshorecomment"
Content=" Shore Comment : "
HorizontalAlignment="Center"
Margin="5,0,0,0"
FontWeight="Bold"
VerticalAlignment="Center"
FontFamily="Calibri"
FontStyle="Normal"
FontSize="14"></Label>
<TextBox BorderThickness="1"
FontWeight="Normal"
IsReadOnly="True"
Height="44"
Width="878"
TextWrapping="Wrap"
AcceptsReturn="True"
HorizontalAlignment="left"
Margin="0,0,0,0"
Name="txtShoreComment"
VerticalAlignment="Center" />
</StackPanel>
</Grid>
</Grid>
来源：https://stackoverflow.com/questions/2922303/mouse-scroll-not-working-in-a-scroll-viewer-with-a-wpf-datagrid-and-additional-u