WPF ScrollViewer控件添加自定义滚动条

<ScrollViewer Name="sv1" VerticalScrollBarVisibility="Hidden" Margin="0" Width="auto" Grid.Row="1">
    <DockPanel Name="FlowPanel" MinWidth="20" Background="#FFE1F3D8" ></DockPanel>
</ScrollViewer>

            <ScrollViewer Name="sv2" VerticalScrollBarVisibility="Auto"  Background="{x:Null}" MinWidth="10" >
                <DataGrid  GridLinesVisibility="None"  x:Name="xStepDataGrid" Margin="2"  Grid.Column="1" Grid.Row="1"
      ColumnHeaderStyle="{StaticResource xDataGridHeaderNormalFont}" 
      CanUserAddRows="False" CanUserDeleteRows="False"  SelectionMode="Extended" 
         SelectedItem="{Binding ItemStepSelected}" RowHeaderWidth="30" Background="{x:Null}" 
      ItemsSource="{Binding DirectChildren}"  Style="{StaticResource xAlternatingRowBackground}"
      AutoGenerateColumns="False" IsReadOnly="True" DataContextChanged="xStepDataGrid_DataContextChanged" ScrollViewer.CanContentScroll="False" PreviewMouseLeftButtonDown="xStepDataGrid_PreviewMouseLeftButtonDown"  >
                    <i:Interaction.Triggers>
                        <i:EventTrigger  EventName="MouseDoubleClick">
                            <ml:EventToCommand Command="{Binding MouseDoubleClickCommand}" />
                        </i:EventTrigger>
                    </i:Interaction.Triggers>
                    <DataGrid.Columns>
                        <DataGridTemplateColumn  Header="Name" MinWidth="100"  >
                            <DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal">
                                        <iconPacks:PackIconEntypo  Visibility="{Binding HasDeleted, Converter={StaticResource xDeleteVisibilityConvert}}"  Width="12" Height="12" Kind="Cross" Foreground="{DynamicResource CleanWindowCloseButtonBackgroundBrush}" HorizontalAlignment="Center" VerticalAlignment="Center" />
                                        <TextBlock Margin="2" ToolTip="{Binding StepName}" Text="{Binding StepName}" Foreground="Black" TextTrimming="CharacterEllipsis"  />
                                    </StackPanel>
                                </DataTemplate>
                            </DataGridTemplateColumn.CellTemplate>
                        </DataGridTemplateColumn>
                        <DataGridTemplateColumn  Header="Type" MinWidth="100"  >
                            <DataGridTemplateColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock Margin="2" Text="{Binding StepType}"  Foreground="Black"  />
                                </DataTemplate>
                            </DataGridTemplateColumn.CellTemplate>
                        </DataGridTemplateColumn>
                    </DataGrid.Columns>
                </DataGrid>
            </ScrollViewer>
       

添加滚动事件可以实现两个滚动条同时滚动

            //关联ScrollChanged事件
            //sv1.ScrollChanged += new ScrollChangedEventHandler(sv1_ScrollChanged);
            sv2.ScrollChanged += new ScrollChangedEventHandler(sv2_ScrollChanged);



        private void lstItem_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
        {
            var eventArg = new MouseWheelEventArgs(e.MouseDevice, e.Timestamp, e.Delta);
            //指定路由事件对UIElement的事件类型
            eventArg.RoutedEvent = UIElement.MouseWheelEvent;
            eventArg.Source = sv2;
            //指定路由事件的源对象
            (sv2 as UIElement).RaiseEvent(eventArg);
        }

        void sv1_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {
            sv2.ScrollToVerticalOffset(sv1.VerticalOffset);
        }

        void sv2_ScrollChanged(object sender, ScrollChangedEventArgs e)
        {
            sv1.ScrollToVerticalOffset(sv2.VerticalOffset);
        }