Silverlight 自定义 ScrollViewer 样式

<ResourceDictionary
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <ResourceDictionary.MergedDictionaries> 
        <ResourceDictionary Source="ValidationTooltip_style.xaml"/>
    </ResourceDictionary.MergedDictionaries>
    <ControlTemplate x:Key="RepeatButtonLineUpTemplate" TargetType="RepeatButton">
        <Border Background="Transparent">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BasicBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>            
            <Path x:Name="Arrow" Width="6" Height="3" Data="M0,3 L6,3 3,0Z" Fill="{StaticResource StrongBrush}" />
        </Border>
    </ControlTemplate>    
    <ControlTemplate x:Key="RepeatButtonLineDownTemplate" TargetType="RepeatButton">
        <Border Background="Transparent">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BasicBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Path x:Name="Arrow" Width="6" Height="3" Data="M0,0 L6,0 3,3Z" Fill="{StaticResource StrongBrush}" />
        </Border>
    </ControlTemplate>
    <ControlTemplate x:Key="RepeatButtonLineLeftTemplate" TargetType="RepeatButton">
        <Border Background="Transparent">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BasicBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Path x:Name="Arrow" Width="3" Height="6" Data="M3,0 L3,6 0,3Z" Fill="{StaticResource StrongBrush}" />
        </Border>
    </ControlTemplate>
    <ControlTemplate x:Key="RepeatButtonLineRightTemplate" TargetType="RepeatButton">
        <Border Background="Transparent">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BasicBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Path x:Name="Arrow" Width="3" Height="6" Data="M0,0 L0,6 3,3Z" Fill="{StaticResource StrongBrush}" />
        </Border>
    </ControlTemplate>

    <Style x:Key="RepeatButtonLineBaseStyle" TargetType="RepeatButton">
        <Setter Property="MinWidth" Value="12" />
        <Setter Property="MinHeight" Value="12" />
        <Setter Property="IsTabStop" Value="False" />
    </Style>
    <Style x:Key="RepeatButtonLineUpStyle" TargetType="RepeatButton" BasedOn="{StaticResource RepeatButtonLineBaseStyle}">
        <Setter Property="Template" Value="{StaticResource RepeatButtonLineUpTemplate}" />
    </Style>
    <Style x:Key="RepeatButtonLineDownStyle" TargetType="RepeatButton" BasedOn="{StaticResource RepeatButtonLineBaseStyle}">
        <Setter Property="Template" Value="{StaticResource RepeatButtonLineDownTemplate}" />
    </Style>
    <Style x:Key="RepeatButtonLineLeftStyle" TargetType="RepeatButton" BasedOn="{StaticResource RepeatButtonLineBaseStyle}">
        <Setter Property="Template" Value="{StaticResource RepeatButtonLineLeftTemplate}" />
    </Style>
    <Style x:Key="RepeatButtonLineRightStyle" TargetType="RepeatButton" BasedOn="{StaticResource RepeatButtonLineBaseStyle}">
        <Setter Property="Template" Value="{StaticResource RepeatButtonLineRightTemplate}" />
    </Style>

    <Style x:Key="ThumbHorizontalStyle" TargetType="Thumb">
        <Setter Property="IsTabStop" Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Thumb">
                    <Grid Background="Transparent">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Track" Storyboard.TargetProperty="Fill">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BasicBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Track" Storyboard.TargetProperty="Fill">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <!--<DoubleAnimation Duration="0" To="6" Storyboard.TargetName="Track" Storyboard.TargetProperty="Height" />-->
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Track" Storyboard.TargetProperty="Fill">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Rectangle x:Name="Track" Height="4" Fill="{StaticResource BasicBrush}" />
                    </Grid>
                    
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Style x:Key="ThumbVerticalStyle" TargetType="Thumb">
        <Setter Property="IsTabStop" Value="False" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Thumb">
                    <Grid Background="Transparent">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Track" Storyboard.TargetProperty="Fill">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource BasicBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Track" Storyboard.TargetProperty="Fill">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <!--<DoubleAnimation Duration="0" To="6" Storyboard.TargetName="Track" Storyboard.TargetProperty="Width" />-->
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Track" Storyboard.TargetProperty="Fill">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource MarkerBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Rectangle x:Name="Track" Width="4" Fill="{StaticResource BasicBrush}" />
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style x:Key="RepeatButtonBlankStyle" TargetType="RepeatButton">
        <Setter Property="IsTabStop" Value="False" />    
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="RepeatButton">
                    <Rectangle Fill="Transparent" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <ControlTemplate x:Key="ScrollBarControlTemplate" TargetType="ScrollBar">
        <Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}">
            <Grid x:Name="Root">
                <Grid x:Name="HorizontalRoot">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="Auto"/>
                    </Grid.ColumnDefinitions>
                    <RepeatButton x:Name="HorizontalSmallDecrease" Grid.Column="0" Interval="50" Style="{StaticResource RepeatButtonLineLeftStyle}" />
                    <RepeatButton x:Name="HorizontalLargeDecrease" Grid.Column="1" Interval="50" Style="{StaticResource RepeatButtonBlankStyle}" />
                    <Thumb x:Name="HorizontalThumb" Grid.Column="2" MinWidth="16" Style="{StaticResource ThumbHorizontalStyle}" />
                    <RepeatButton x:Name="HorizontalLargeIncrease" Grid.Column="3" Interval="50" Style="{StaticResource RepeatButtonBlankStyle}" />
                    <RepeatButton x:Name="HorizontalSmallIncrease" Grid.Column="4" Interval="50" Style="{StaticResource RepeatButtonLineRightStyle}" />
                </Grid>
                <Grid x:Name="VerticalRoot" Visibility="Collapsed">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <RepeatButton x:Name="VerticalSmallDecrease" Grid.Row="0" Interval="50" Style="{StaticResource RepeatButtonLineUpStyle}" />
                    <RepeatButton x:Name="VerticalLargeDecrease" Grid.Row="1" Interval="50" Style="{StaticResource RepeatButtonBlankStyle}" />
                    <Thumb x:Name="VerticalThumb" Grid.Row="2" MinHeight="16" Style="{StaticResource ThumbVerticalStyle}" />
                    <RepeatButton x:Name="VerticalLargeIncrease" Grid.Row="3" Interval="50" Style="{StaticResource RepeatButtonBlankStyle}" />
                    <RepeatButton x:Name="VerticalSmallIncrease" Grid.Row="4" Interval="50" Style="{StaticResource RepeatButtonLineDownStyle}" />
                </Grid>
            </Grid>
        </Border>
    </ControlTemplate>
    <Style x:Key="ScrollBarStyle" TargetType="ScrollBar">
        <Setter Property="MinWidth" Value="12" />
        <Setter Property="MinHeight" Value="12" />
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Template" Value="{StaticResource ScrollBarControlTemplate}" />
    </Style>
    
    <ControlTemplate x:Key="ScrollViewerControlTemplate" TargetType="ScrollViewer">
        <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="2">
            <Grid Background="{TemplateBinding Background}">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <ScrollContentPresenter x:Name="ScrollContentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" />
                <ScrollBar x:Name="VerticalScrollBar" Grid.Column="1" IsTabStop="False" Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Orientation="Vertical" Grid.Row="0" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" Value="{TemplateBinding VerticalOffset}" ViewportSize="{TemplateBinding ViewportHeight}" />
                <ScrollBar x:Name="HorizontalScrollBar" Grid.Column="0" IsTabStop="False" Maximum="{TemplateBinding ScrollableWidth}" Minimum="0" Orientation="Horizontal" Grid.Row="1" Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}" Value="{TemplateBinding HorizontalOffset}" ViewportSize="{TemplateBinding ViewportWidth}" />
            </Grid>
        </Border>
    </ControlTemplate>
    <Style x:Key="ScrollViewerStyle" TargetType="ScrollViewer">
        <Setter Property="HorizontalContentAlignment" Value="Left"/>
        <Setter Property="VerticalContentAlignment" Value="Top"/>
        <Setter Property="VerticalScrollBarVisibility" Value="Visible"/>
        <Setter Property="Background" Value="{StaticResource MainBrush}" />
        <Setter Property="BorderBrush" Value="{StaticResource BasicBrush}" />
        <Setter Property="BorderThickness" Value="1" />
        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        <Setter Property="VerticalContentAlignment" Value="Stretch" />
        <Setter Property="Padding" Value="0" />
        <Setter Property="Template" Value="{StaticResource ScrollViewerControlTemplate}" />
    </Style>
    
    <Style BasedOn="{StaticResource ScrollBarStyle}" TargetType="ScrollBar" />
    <Style BasedOn="{StaticResource ScrollViewerStyle}" TargetType="ScrollViewer" />
    


</ResourceDictionary>

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:sys="clr-namespace:System;assembly=mscorlib">


    <!--背景颜色-->
    <SolidColorBrush x:Key="MainBrush" Color="#00000000" />
    <!--默认颜色-->
    <SolidColorBrush x:Key="BasicBrush" Color="#FFAFAFAF"  />
    <SolidColorBrush x:Key="StrongBrush" Color="#FFAFAFAF" />
    <!--鼠标滑过颜色-->
    <SolidColorBrush x:Key="MarkerBrush" Color="#FFF7824A"  /> 

    <ControlTemplate x:Key="ValidationToolTipTemplate">
        <Grid x:Name="Root" Margin="5,0" RenderTransformOrigin="0,0" Opacity="0">
            <Grid.RenderTransform>
                <TranslateTransform x:Name="xform" X="-25"/>
            </Grid.RenderTransform>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="OpenStates">
                    <VisualStateGroup.Transitions>
                        <VisualTransition GeneratedDuration="0"/>
                        <VisualTransition To="Open" GeneratedDuration="0:0:0.2">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="xform" Storyboard.TargetProperty="X" To="0" Duration="0:0:0.2">
                                    <DoubleAnimation.EasingFunction>
                                        <BackEase Amplitude=".3" EasingMode="EaseOut"/>
                                    </DoubleAnimation.EasingFunction>
                                </DoubleAnimation>
                                <DoubleAnimation Storyboard.TargetName="Root" Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:0.2"/>
                            </Storyboard>
                        </VisualTransition>
                    </VisualStateGroup.Transitions>
                    <VisualState x:Name="Closed">
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetName="Root" Storyboard.TargetProperty="Opacity" To="0" Duration="0"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Open">
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetName="xform" Storyboard.TargetProperty="X" To="0" Duration="0"/>
                            <DoubleAnimation Storyboard.TargetName="Root" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

            <Border Margin="4,4,-4,-4" Background="#052A2E31" CornerRadius="5"/>
            <Border Margin="3,3,-3,-3" Background="#152A2E31" CornerRadius="4"/>
            <Border Margin="2,2,-2,-2" Background="#252A2E31" CornerRadius="3"/>
            <Border Margin="1,1,-1,-1" Background="#352A2E31" CornerRadius="2"/>

            <Border Background="#FFDC000C" CornerRadius="2"/>
            <Border CornerRadius="2">
                <TextBlock 
                        UseLayoutRounding="false" 
                        Foreground="White" Margin="8,4,8,4" MaxWidth="250" TextWrapping="Wrap" Text="{Binding (Validation.Errors)[0].ErrorContent}"/>
            </Border>
        </Grid>
    </ControlTemplate>


</ResourceDictionary>