Чтобы сделать пользовательский элемент ScrollViewer или ScrollBar, надо переопределить шаблоны (ControlTemplate) этих элементов
Разметка XAML
<Window x:Class="MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:cl="clr-namespace:System.Collections;assembly=mscorlib" xmlns:sys="clr-namespace:System;assembly=mscorlib" xmlns:local="clr-namespace:WpfExp" Title="Custom ScrollViewer" Height="250" Width="300"> <Window.Resources> <cl:ArrayList x:Key="ar"> <local:Team country="Россия" place="1" score="23"></local:Team> <local:Team country="Армения" place="2" score="20"></local:Team> <local:Team country="Ирландия" place="3" score="18"></local:Team> <local:Team country="Словакия" place="4" score="17"></local:Team> <local:Team country="Македония" place="5" score="5"></local:Team> <local:Team country="Андорра" place="6" score="0"></local:Team> </cl:ArrayList> <Style x:Key="ScrollBarThumbStyle" TargetType="Thumb"> <Setter Property="IsTabStop" Value="False" /> <Setter Property="Focusable" Value="False" /> <Setter Property="Margin" Value="1,0,1,0" /> <Setter Property="Background" Value="Red" /> <Setter Property="BorderBrush" Value="Black" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Thumb"> <Ellipse Fill="Blue" /> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="ScrollBarPageButtonStyle" TargetType="RepeatButton"> <Setter Property="IsTabStop" Value="False" /> <Setter Property="Focusable" Value="False" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Border Background="Transparent" /> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="ScrollBarLineButtonStyle" TargetType="RepeatButton"> <Setter Property="Focusable" Value="False" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Grid Margin="1"> <Ellipse Name="Border" StrokeThickness="2" Stroke="Black" Fill="Gray" /> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" /> </Grid> <ControlTemplate.Triggers> <Trigger Property="IsPressed" Value="True"> <Setter TargetName="Border" Property="Fill" Value="Blue" /> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> <ControlTemplate x:Key="scroll" TargetType="ScrollBar"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="18" /> <RowDefinition Height="*" /> <RowDefinition Height="18" /> </Grid.RowDefinitions> <RepeatButton Grid.Row="0" Height="18" Style="{StaticResource ScrollBarLineButtonStyle}" Command="ScrollBar.LineUpCommand"> <Path Fill="Red" Data="M 0 4 L 8 4 L 4 0 Z" /> </RepeatButton> <Track Grid.Row="1" ViewportSize="0" IsDirectionReversed="True" x:Name="PART_Track"> <Track.DecreaseRepeatButton> <RepeatButton Command="ScrollBar.PageUpCommand" Style="{StaticResource ScrollBarPageButtonStyle}"> </RepeatButton> </Track.DecreaseRepeatButton> <Track.Thumb> <Thumb Style="{StaticResource ScrollBarThumbStyle}" /> </Track.Thumb> <Track.IncreaseRepeatButton> <RepeatButton Command="ScrollBar.PageDownCommand" Style="{StaticResource ScrollBarPageButtonStyle}"> </RepeatButton> </Track.IncreaseRepeatButton> </Track> <RepeatButton Command="{x:Static ScrollBar.LineDownCommand}" Grid.Row="3" Height="18" Style="{StaticResource ScrollBarLineButtonStyle}"> <Path Fill="Red" Data="M 0 0 L 4 4 L 8 0 Z" /> </RepeatButton> </Grid> </ControlTemplate> <Style TargetType="ScrollViewer"> <Setter Property="HorizontalContentAlignment" Value="Left" /> <Setter Property="VerticalContentAlignment" Value="Top" /> <Setter Property="VerticalScrollBarVisibility" Value="Visible" /> <Setter Property="Padding" Value="4"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="BorderBrush"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFA3AEB9" Offset="0"/> <GradientStop Color="#FF8399A9" Offset="0.375"/> <GradientStop Color="#FF718597" Offset="0.375"/> <GradientStop Color="#FF617584" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ScrollViewer"> <Border CornerRadius="2" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"> <Grid Background="{TemplateBinding Background}"> <Grid.RowDefinitions> <RowDefinition Height="*"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <ScrollContentPresenter x:Name="ScrollContentPresenter" Cursor="{TemplateBinding Cursor}" Margin="{TemplateBinding Padding}" ContentTemplate="{TemplateBinding ContentTemplate}"/> <Rectangle Grid.Column="1" Grid.Row="1" Fill="#FFE9EEF4"/> <ScrollBar Name="PART_VerticalScrollBar" Width="18" IsTabStop="False" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" Grid.Column="1" Grid.Row="0" Orientation="Vertical" ViewportSize="{TemplateBinding ViewportHeight}" Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Value="{TemplateBinding VerticalOffset}" Margin="0,-1,-1,-1" Template="{StaticResource scroll}" SnapsToDevicePixels="True" OverridesDefaultStyle="True"/> <ScrollBar Name="PART_HorizontalScrollBar" Height="18" IsTabStop="False" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" Grid.Column="0" Grid.Row="1" Orientation="Horizontal" ViewportSize="{TemplateBinding ViewportWidth}" Maximum="{TemplateBinding ScrollableWidth}" Minimum="0" Value="{TemplateBinding HorizontalOffset}" Margin="-1,0,-1,-1"/> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style TargetType="ListView"> <Setter Property="SnapsToDevicePixels" Value="true" /> <Setter Property="OverridesDefaultStyle" Value="true" /> <Setter Property="ScrollViewer.CanContentScroll" Value="true" /> <Setter Property="VerticalContentAlignment" Value="Center" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate> <Border Background="{TemplateBinding Background}"> <ScrollViewer> <ItemsPresenter Margin="2"></ItemsPresenter> </ScrollViewer> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Grid Background="Black"> <TextBlock Background="Black" Height="20" VerticalAlignment="Top" Foreground="White">Отборочная группа на Чемпионат Европы 2012</TextBlock> <ListView Name="lview" Background="White" VerticalAlignment="Top" Margin="0 20 0 30" ItemsSource="{DynamicResource ResourceKey=ar}" Height="110"> <ListView.View> <GridView> <GridViewColumn DisplayMemberBinding="{Binding Path=place}">Место</GridViewColumn> <GridViewColumn DisplayMemberBinding="{Binding Path=country}">Страна</GridViewColumn> <GridViewColumn DisplayMemberBinding="{Binding Path=score}">Очки</GridViewColumn> </GridView> </ListView.View> </ListView> </Grid> </Window>
Результат работы на следующем рисунке: