title: Change scrollviewer template in listbox
body: <p>I'm a newbie with WPF.
  I want to change the template of scroll viewer in listbox. I found an Apple style scroll bar in this <a href="http://johnnystechnicallife.blogspot.com/2013/01/apple-style-scroll-bar-in-wpf.html" rel="nofollow">blog</a></p>
  
  <p>But i dont know how to apply that scroll viewer template to listbox. Can anyone help me?
  Here is the <code>XAML</code>code of Apple scroll viewer template:  </p>
  
  <pre><code>&lt;SolidColorBrush x:Key="ScrollBarDisabledBackground" Color="#F4F4F4"/&gt;
          &lt;Style x:Key="VerticalScrollBarPageButton" TargetType="{x:Type RepeatButton}"&gt;
              &lt;Setter Property="OverridesDefaultStyle" Value="true"/&gt;
              &lt;Setter Property="Background" Value="Transparent"/&gt;
              &lt;Setter Property="Focusable" Value="false"/&gt;
              &lt;Setter Property="IsTabStop" Value="false"/&gt;
              &lt;Setter Property="Template"&gt;
                  &lt;Setter.Value&gt;
                      &lt;ControlTemplate TargetType="{x:Type RepeatButton}"&gt;
                          &lt;Rectangle Fill="{TemplateBinding Background}" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}"/&gt;
                      &lt;/ControlTemplate&gt;
                  &lt;/Setter.Value&gt;
              &lt;/Setter&gt;
          &lt;/Style&gt;
          &lt;Style x:Key="ScrollBarThumb" TargetType="{x:Type Thumb}"&gt;
              &lt;Setter Property="OverridesDefaultStyle" Value="true"/&gt;
              &lt;Setter Property="IsTabStop" Value="false"/&gt;
              &lt;Setter Property="Template"&gt;
                  &lt;Setter.Value&gt;
                      &lt;ControlTemplate TargetType="{x:Type Thumb}"&gt;
                          &lt;Border Background="#FF868686" BorderThickness="0,0,1,0" Height="Auto" CornerRadius="4" /&gt;
                      &lt;/ControlTemplate&gt;
                  &lt;/Setter.Value&gt;
              &lt;/Setter&gt;
          &lt;/Style&gt;
          &lt;Style x:Key="HorizontalScrollStyle" TargetType="{x:Type ScrollBar}"&gt;
              &lt;Setter Property="Background" Value="Transparent"/&gt;
              &lt;Setter Property="Template"&gt;
                  &lt;Setter.Value&gt;
                      &lt;ControlTemplate TargetType="{x:Type ScrollBar}"&gt;
                          &lt;Grid x:Name="Bg" Background="{TemplateBinding Background}" Height="10" SnapsToDevicePixels="true"&gt;
                              &lt;Grid.RowDefinitions&gt;
                                  &lt;RowDefinition /&gt;
                              &lt;/Grid.RowDefinitions&gt;
                              &lt;Track x:Name="PART_Track" IsDirectionReversed="true" IsEnabled="{TemplateBinding IsMouseOver}"&gt;
                                  &lt;Track.DecreaseRepeatButton&gt;
                                      &lt;RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/&gt;
                                  &lt;/Track.DecreaseRepeatButton&gt;
                                  &lt;Track.IncreaseRepeatButton&gt;
                                      &lt;RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/&gt;
                                  &lt;/Track.IncreaseRepeatButton&gt;
                                  &lt;Track.Thumb&gt;
                                      &lt;Thumb Style="{StaticResource ScrollBarThumb}" Cursor="Hand"/&gt;
                                  &lt;/Track.Thumb&gt;
                              &lt;/Track&gt;
                          &lt;/Grid&gt;
                          &lt;ControlTemplate.Triggers&gt;
                              &lt;Trigger Property="IsEnabled" Value="false"&gt;
                                  &lt;Setter Property="Background" TargetName="Bg" Value="{StaticResource ScrollBarDisabledBackground}"/&gt;
                              &lt;/Trigger&gt;
                          &lt;/ControlTemplate.Triggers&gt;
                      &lt;/ControlTemplate&gt;
                  &lt;/Setter.Value&gt;
              &lt;/Setter&gt;
          &lt;/Style&gt;
          &lt;Style x:Key="AppleStyleVerticalScrollBarStyle" TargetType="{x:Type ScrollBar}"&gt;
              &lt;Setter Property="Template"&gt;
                  &lt;Setter.Value&gt;
                      &lt;ControlTemplate TargetType="{x:Type ScrollBar}"&gt;
                          &lt;Grid x:Name="Bg" SnapsToDevicePixels="true" Width="10" HorizontalAlignment="Right" Margin="0"&gt;
                              &lt;Grid.RowDefinitions&gt;
                                  &lt;RowDefinition /&gt;
                              &lt;/Grid.RowDefinitions&gt;
                              &lt;Track x:Name="PART_Track" IsDirectionReversed="true" IsEnabled="{TemplateBinding IsMouseOver}"&gt;
                                  &lt;Track.DecreaseRepeatButton&gt;
                                      &lt;RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource VerticalScrollBarPageButton}" /&gt;
                                  &lt;/Track.DecreaseRepeatButton&gt;
                                  &lt;Track.IncreaseRepeatButton&gt;
                                      &lt;RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource VerticalScrollBarPageButton}"/&gt;
                                  &lt;/Track.IncreaseRepeatButton&gt;
                                  &lt;Track.Thumb&gt;
                                      &lt;Thumb Style="{DynamicResource ScrollBarThumb}" Cursor="Hand"/&gt;
                                  &lt;/Track.Thumb&gt;
                              &lt;/Track&gt;
                          &lt;/Grid&gt;
                      &lt;/ControlTemplate&gt;
                  &lt;/Setter.Value&gt;
              &lt;/Setter&gt;
          &lt;/Style&gt;
          &lt;ControlTemplate x:Key="AppleStyleScrollBarStyle" TargetType="{x:Type ScrollViewer}"&gt;
              &lt;Grid x:Name="Grid" Background="{TemplateBinding Background}"&gt;
                  &lt;Grid.ColumnDefinitions&gt;
                      &lt;ColumnDefinition Width="*"/&gt;
                      &lt;ColumnDefinition Width="Auto"/&gt;
                  &lt;/Grid.ColumnDefinitions&gt;
                  &lt;Grid.RowDefinitions&gt;
                      &lt;RowDefinition Height="*"/&gt;
                      &lt;RowDefinition Height="Auto"/&gt;
                  &lt;/Grid.RowDefinitions&gt;
                  &lt;Rectangle x:Name="Corner" Grid.Column="1" Fill="{x:Null}" Grid.Row="1"/&gt;
                  &lt;ScrollContentPresenter x:Name="PART_ScrollContentPresenter" CanContentScroll="{TemplateBinding CanContentScroll}"   
                        CanHorizontallyScroll="False" CanVerticallyScroll="False"   
                        ContentTemplate="{TemplateBinding ContentTemplate}"   
                        Content="{TemplateBinding Content}" Grid.Column="0"   
                        Margin="{TemplateBinding Padding}" Grid.Row="0"/&gt;
                  &lt;ScrollBar x:Name="PART_VerticalScrollBar" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"   
                AutomationProperties.AutomationId="VerticalScrollBar" Cursor="Arrow" Grid.Column="1"   
                Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Grid.Row="0"   
                Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"   
                ViewportSize="{TemplateBinding ViewportHeight}" Style="{DynamicResource AppleStyleVerticalScrollBarStyle}"   
                  Background="{x:Null}" Width="Auto" Margin="0"/&gt;
                  &lt;ScrollBar x:Name="PART_HorizontalScrollBar" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"   
                AutomationProperties.AutomationId="HorizontalScrollBar" Cursor="Arrow" Grid.Column="0"   
                Maximum="{TemplateBinding ScrollableWidth}" Minimum="0" Orientation="Horizontal" Grid.Row="1"   
                Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"   
                ViewportSize="{TemplateBinding ViewportWidth}" Style="{DynamicResource HorizontalScrollStyle}"/&gt;
              &lt;/Grid&gt;
          &lt;/ControlTemplate&gt;
  </code></pre>