An easy way to customize a scrollbar for a control

If you want to customize a scrollbar for a control such as listbox as follows:

You can define xaml as follows (wrap listbox with a scrollviewer):

<ScrollViewer Name="myScrollView" Grid.Row="0" VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden" PreviewMouseWheel="OnWheelScroll">
        <ListBox Width="34" ScrollViewer.HorizontalScrollBarVisibility="Hidden" ScrollViewer.VerticalScrollBarVisibility="Hidden"</ListBox>
</ScrollViewer>
<Button Grid.Row="1" Name="btnScrollUp" Click="OnScrollUp" ">
        <Image Source="Resources/scrollup-arrow.png" Stretch="Uniform" StretchDirection="Both"></Image>
</Button>
<Button Grid.Row="2" Name="btnScrollDown" Click="OnScrollDown" >
        <Image Source="Resources/scrolldown-arrow.png" Stretch="Uniform" StretchDirection="Both"></Image>
</Button>

Then define event handler in xaml.cs as follows:

 private void OnScrollUp(object sender, RoutedEventArgs e)

 {
      myScrollView.LineUp();
}

 private void OnScrollDown(object sender, RoutedEventArgs e)
 {
      myScrollView.LineDown();
 }

 private void OnWheelScroll(object sender, MouseWheelEventArgs e) // Sometimes if we cannot scroll with mouse wheel, we need add this handler.
 {
      myScrollView.ScrollToVerticalOffset(e.Delta);
 }

Note:

Two buttons are up/down arrow for scrollbar.