Click here to Skip to main content
15,896,335 members
Articles / Desktop Programming / WPF

Improving WPF Mouse Wheel Processing

Rate me:
Please Sign up or sign in to vote.
4.91/5 (29 votes)
11 Jun 2016MIT16 min read 94.3K   3.8K   52  
How to quickly improve your WPF application to give your users a pleasant mouse wheel experience
<UserControl
  x:Class="Logitech.WpfMouseWheel.Views.WorkspaceView"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
  mc:Ignorable="d" 
  d:DesignHeight="300" d:DesignWidth="300">
  <UserControl.Resources>
    <ResourceDictionary Source="WorkspaceResources.xaml"/>
  </UserControl.Resources>

  <TabControl>

    <!-- Scroll -->
    <TabItem>
      <TabItem.Header>
        <TextBlock Text="Scroll" FontSize="14" FontWeight="DemiBold"/>
      </TabItem.Header>
      <DockPanel>
        <Border DockPanel.Dock="Bottom" Margin="0,4,0,0" BorderThickness="1" BorderBrush="Gray" Background="LightGray">
          <TextBlock
            DockPanel.Dock="Top" Margin="4" TextAlignment="Center" TextWrapping="Wrap" FontSize="16"
            Text="In native mode, horizontal mouse wheel scrolling is not available" Foreground="DarkRed"/>
        </Border>
        <TabControl>
          <TabItem Header="Vertical Scroll">
            <TabControl>
              <TabItem Header="Nested Scroll" DataContext="{Binding Source={StaticResource _nestedCollectionBuilder}, Path=Items}" >
                <TabControl>
                  <TabItem Header="In an ItemsControl"            Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L1-ItemsControl}"/>
                  <TabItem Header="In a ListBox"                  Background="{StaticResource LogicalModeBrush}"  Content="{StaticResource L1-ListBox}"/>
                  <TabItem Header="In a FlowDocumentScrollViewer" Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L1-FlowDocumentScrollViewer}"/>
                  <TabItem Header="In a FlowDocumentPageViewer"   Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L1-FlowDocumentPageViewer}"/>
                  <TabItem Header="In a RichTextBox"              Background="{StaticResource TextBoxBaseBrush}"     Content="{StaticResource L1-RichTextBox}"/>
                </TabControl>
              </TabItem>
              <TabItem Header="Non Nested Scroll" DataContext="{Binding Source={StaticResource _collectionBuilder}, Path=Items}">
                <TabControl>
                  <TabItem Header="Image"                    Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L0-Image}" />
                  <TabItem Header="ItemsControl"             Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L0-ItemsControl}" />
                  <TabItem Header="ListBox"                  Background="{StaticResource LogicalModeBrush}"  Content="{StaticResource L0-ListBox}" />
                  <TabItem Header="ListView"                 Background="{StaticResource LogicalModeBrush}"  Content="{StaticResource L0-ListView}" />
                  <TabItem Header="DataGrid"                 Background="{StaticResource LogicalModeBrush}"  Content="{StaticResource L0-DataGrid}" />
                  <TabItem Header="ComboBox"                 Background="{StaticResource LogicalModeBrush}"  Content="{StaticResource L0-ComboBox}" />
                  <TabItem Header="TextBox"                  Background="{StaticResource TextBoxBaseBrush}"     Content="{StaticResource L0-TextBox}" />
                  <TabItem Header="RichTextBox"              Background="{StaticResource TextBoxBaseBrush}"     Content="{StaticResource L0-RichTextBox}" />
                  <TabItem Header="FlowDocumentScrollViewer" Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L0-FlowDocumentScrollViewer}" />
                  <TabItem Header="FlowDocumentPageViewer"   Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L0-FlowDocumentPageViewer}" />
                </TabControl>
              </TabItem>
            </TabControl>
          </TabItem>
          <TabItem Header="Horizontal Scroll">
            <TabControl>
              <TabItem Header="Nested Scroll" DataContext="{Binding Source={StaticResource _nestedCollectionBuilder}, Path=Items}" >
                <TabControl>
                  <TabItem Header="In an ItemsControl" Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L1H-ItemsControl}"/>
                  <TabItem Header="In a ListBox"       Background="{StaticResource LogicalModeBrush}"  Content="{StaticResource L1H-ListBox}"/>
                </TabControl>
              </TabItem>
              <TabItem Header="Non Nested Scroll" DataContext="{Binding Source={StaticResource _narrowCollectionBuilder}, Path=Items}">
                <TabControl>
                  <TabItem Header="ItemsControl" Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L0H-ItemsControl}"/>
                  <TabItem Header="ListBox"      Background="{StaticResource LogicalModeBrush}"  Content="{StaticResource L0H-ListBox}"/>
                </TabControl>
              </TabItem>
            </TabControl>
          </TabItem>
        </TabControl>
      </DockPanel>
    </TabItem>

    <!-- Zoom -->
    <TabItem>
      <TabItem.Header>
        <TextBlock Text="Zoom" FontSize="14" FontWeight="DemiBold"/>
      </TabItem.Header>
      <DockPanel>
        <Border DockPanel.Dock="Bottom" Margin="0,4,0,0" BorderThickness="1" BorderBrush="Gray" Background="LightGray">
          <TextBlock DockPanel.Dock="Top" Text="To zoom, hold down the Control key while rotating the mouse wheel."
               TextAlignment="Center" TextWrapping="Wrap" FontSize="16"/>
        </Border>
        <TabControl>
          <TabItem Header="Nested Zoom">
            <TabControl>
              <TabItem Header="In a FlowDocumentScrollViewer" Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L1Z-FlowDocumentScrollViewer}"/>
              <TabItem Header="In a FlowDocumentPageViewer"   Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L1Z-FlowDocumentPageViewer}"/>
            </TabControl>
          </TabItem>
          <TabItem Header="Non Nested Zoom">
            <TabControl>
              <TabItem Header="FlowDocumentScrollViewer" Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L0-FlowDocumentScrollViewer}" />
              <TabItem Header="FlowDocumentPageViewer"   Background="{StaticResource PhysicalModeBrush}" Content="{StaticResource L0-FlowDocumentPageViewer}" />
            </TabControl>
          </TabItem>
        </TabControl>
      </DockPanel>
    </TabItem>

  </TabControl>
</UserControl>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The MIT License


Written By
Software Developer (Senior)
Switzerland Switzerland
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions