功能更新
This commit is contained in:
GG Z
415
Melskin/Controls/ScrollViewer.xaml
Normal file
415
Melskin/Controls/ScrollViewer.xaml
Normal file
@@ -0,0 +1,415 @@
|
||||
<ResourceDictionary
|
||||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
||||
xmlns:assists="clr-namespace:Melskin.Assists"
|
||||
xmlns:markup="clr-namespace:Melskin.Markup"
|
||||
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
|
||||
<ResourceDictionary.MergedDictionaries>
|
||||
<ResourceDictionary Source="RepeatButtonTransparent.xaml" />
|
||||
</ResourceDictionary.MergedDictionaries>
|
||||
<!-- 显示两端按钮 -->
|
||||
<Storyboard x:Key="ShowScrollItem">
|
||||
<DoubleAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetName="border"
|
||||
Storyboard.TargetProperty="Opacity"
|
||||
To="1" />
|
||||
</Storyboard>
|
||||
<!-- 隐藏两端按钮 -->
|
||||
<Storyboard x:Key="HideScrollItem">
|
||||
<DoubleAnimationUsingKeyFrames
|
||||
Duration="0:0:1.2"
|
||||
Storyboard.TargetName="border"
|
||||
Storyboard.TargetProperty="Opacity">
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:0.2" Value="1" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1" Value="1" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1.2" Value="0" />
|
||||
</DoubleAnimationUsingKeyFrames>
|
||||
</Storyboard>
|
||||
<!-- 展开滚动条 -->
|
||||
<Storyboard x:Key="ExpandBar">
|
||||
<ThicknessAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="Margin"
|
||||
To="1" />
|
||||
<DoubleAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="RadiusX"
|
||||
To="4" />
|
||||
<DoubleAnimation
|
||||
Duration="0:0:0.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="RadiusY"
|
||||
To="4" />
|
||||
</Storyboard>
|
||||
<!-- 收缩垂直滚动条 -->
|
||||
<Storyboard x:Key="ShrinkVerticalBar">
|
||||
<ThicknessAnimationUsingKeyFrames
|
||||
Duration="0:0:1.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="Margin">
|
||||
<LinearThicknessKeyFrame KeyTime="0:0:0.2" Value="1" />
|
||||
<LinearThicknessKeyFrame KeyTime="0:0:1" Value="1" />
|
||||
<LinearThicknessKeyFrame KeyTime="0:0:1.2" Value="6,1,1,1" />
|
||||
</ThicknessAnimationUsingKeyFrames>
|
||||
<DoubleAnimationUsingKeyFrames
|
||||
Duration="0:0:1.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="RadiusX">
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:0.2" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1.2" Value="1.5" />
|
||||
</DoubleAnimationUsingKeyFrames>
|
||||
<DoubleAnimationUsingKeyFrames
|
||||
Duration="0:0:1.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="RadiusY">
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:0.2" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1.2" Value="1.5" />
|
||||
</DoubleAnimationUsingKeyFrames>
|
||||
</Storyboard>
|
||||
<!-- 收缩水平滚动条 -->
|
||||
<Storyboard x:Key="ShrinkHorizontalBar">
|
||||
<ThicknessAnimationUsingKeyFrames
|
||||
Duration="0:0:1.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="Margin">
|
||||
<LinearThicknessKeyFrame KeyTime="0:0:0.2" Value="1" />
|
||||
<LinearThicknessKeyFrame KeyTime="0:0:1" Value="1" />
|
||||
<LinearThicknessKeyFrame KeyTime="0:0:1.2" Value="1,6,1,1" />
|
||||
</ThicknessAnimationUsingKeyFrames>
|
||||
<DoubleAnimationUsingKeyFrames
|
||||
Duration="0:0:1.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="RadiusX">
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:0.2" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1.2" Value="1.5" />
|
||||
</DoubleAnimationUsingKeyFrames>
|
||||
<DoubleAnimationUsingKeyFrames
|
||||
Duration="0:0:1.2"
|
||||
Storyboard.TargetName="rectangle"
|
||||
Storyboard.TargetProperty="RadiusY">
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:0.2" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1" Value="4" />
|
||||
<LinearDoubleKeyFrame KeyTime="0:0:1.2" Value="1.5" />
|
||||
</DoubleAnimationUsingKeyFrames>
|
||||
</Storyboard>
|
||||
|
||||
<!-- 滚动条两端按钮 -->
|
||||
<Style TargetType="{x:Type RepeatButton}" x:Key="ScrollBarButtonStyle">
|
||||
<Setter Property="FocusVisualStyle" Value="{DynamicResource FocusVisual}" />
|
||||
<Setter Property="HorizontalContentAlignment" Value="Center" />
|
||||
<Setter Property="VerticalContentAlignment" Value="Center" />
|
||||
<!--<Setter Property="assists:ButtonAssist.Icon" Value="{markup:Icon SymbolValue=ArrowDropUp}" />-->
|
||||
<Setter Property="Focusable" Value="False" />
|
||||
<Setter Property="IsTabStop" Value="False" />
|
||||
<Setter Property="Template">
|
||||
<Setter.Value>
|
||||
<ControlTemplate TargetType="{x:Type RepeatButton}">
|
||||
<Border
|
||||
Opacity="0"
|
||||
SnapsToDevicePixels="true"
|
||||
x:Name="border">
|
||||
<ContentPresenter
|
||||
Content="{Binding Path=(assists:ControlAssist.Icon), RelativeSource={RelativeSource TemplatedParent}}"
|
||||
TextElement.Foreground="{DynamicResource TextSecondaryBrush}"
|
||||
x:Name="Icon" />
|
||||
</Border>
|
||||
<ControlTemplate.Triggers>
|
||||
<Trigger Property="IsMouseOver" Value="true">
|
||||
<Setter Property="TextElement.Foreground" TargetName="Icon" Value="{DynamicResource TextPrimaryBrush}" />
|
||||
</Trigger>
|
||||
<Trigger Property="IsPressed" Value="true">
|
||||
<Setter Property="Margin" TargetName="border" Value="1.5" />
|
||||
</Trigger>
|
||||
<Trigger Property="IsEnabled" Value="True">
|
||||
<!-- TODO:不知道是不是要移除原有动画，原有动画是否会被自动释放 -->
|
||||
<Trigger.EnterActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource ShowScrollItem}" />
|
||||
</Trigger.EnterActions>
|
||||
<Trigger.ExitActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource HideScrollItem}" />
|
||||
</Trigger.ExitActions>
|
||||
</Trigger>
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
<!-- 垂直滑块 -->
|
||||
<Style TargetType="{x:Type Thumb}" x:Key="ScrollBarThumbVerticalStyle">
|
||||
<Setter Property="OverridesDefaultStyle" Value="true" />
|
||||
<Setter Property="IsTabStop" Value="False" />
|
||||
<Setter Property="Template">
|
||||
<Setter.Value>
|
||||
<ControlTemplate TargetType="{x:Type Thumb}">
|
||||
|
||||
<Rectangle
|
||||
Fill="{DynamicResource TextSecondaryBrush}"
|
||||
Height="{TemplateBinding Height}"
|
||||
Margin="6,1,1,1"
|
||||
RadiusX="1.5"
|
||||
RadiusY="1.5"
|
||||
SnapsToDevicePixels="True"
|
||||
Width="{TemplateBinding Width}"
|
||||
x:Name="rectangle" />
|
||||
<ControlTemplate.Triggers>
|
||||
<Trigger Property="IsEnabled" Value="True">
|
||||
<Trigger.EnterActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource ExpandBar}" />
|
||||
</Trigger.EnterActions>
|
||||
<Trigger.ExitActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource ShrinkVerticalBar}" />
|
||||
</Trigger.ExitActions>
|
||||
</Trigger>
|
||||
<Trigger Property="IsDragging" Value="true">
|
||||
<Setter Property="Fill" TargetName="rectangle" Value="{DynamicResource TextPrimaryBrush}" />
|
||||
</Trigger>
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
<!-- 水平滑块 -->
|
||||
<Style TargetType="{x:Type Thumb}" x:Key="ScrollBarHorizontalThumbStyle">
|
||||
<Setter Property="OverridesDefaultStyle" Value="true" />
|
||||
<Setter Property="IsTabStop" Value="False" />
|
||||
<Setter Property="Template">
|
||||
<Setter.Value>
|
||||
<ControlTemplate TargetType="{x:Type Thumb}">
|
||||
<Rectangle
|
||||
Fill="{DynamicResource TextSecondaryBrush}"
|
||||
Height="{TemplateBinding Height}"
|
||||
Margin="1,6,1,1"
|
||||
RadiusX="1.5"
|
||||
RadiusY="1.5"
|
||||
SnapsToDevicePixels="True"
|
||||
Width="{TemplateBinding Width}"
|
||||
x:Name="rectangle" />
|
||||
<ControlTemplate.Triggers>
|
||||
<Trigger Property="IsEnabled" Value="True">
|
||||
<Trigger.EnterActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource ExpandBar}" />
|
||||
</Trigger.EnterActions>
|
||||
<Trigger.ExitActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource ShrinkHorizontalBar}" />
|
||||
</Trigger.ExitActions>
|
||||
</Trigger>
|
||||
<Trigger Property="IsDragging" Value="true">
|
||||
<Setter Property="Fill" TargetName="rectangle" Value="{DynamicResource TextPrimaryBrush}" />
|
||||
</Trigger>
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
</Style>
|
||||
|
||||
<ControlTemplate TargetType="{x:Type ScrollBar}" x:Key="ScrollBarVerticalTemplate">
|
||||
<Grid SnapsToDevicePixels="true" x:Name="Bg">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition MaxHeight="10" />
|
||||
<RowDefinition Height="*" />
|
||||
<RowDefinition MaxHeight="10" />
|
||||
</Grid.RowDefinitions>
|
||||
<Rectangle
|
||||
Fill="{TemplateBinding Background}"
|
||||
Grid.RowSpan="3"
|
||||
Opacity="0"
|
||||
RadiusX="4"
|
||||
RadiusY="4"
|
||||
x:Name="border" />
|
||||
<RepeatButton
|
||||
Command="{x:Static ScrollBar.LineUpCommand}"
|
||||
Grid.Row="0"
|
||||
IsEnabled="{TemplateBinding IsMouseOver}"
|
||||
Style="{StaticResource ScrollBarButtonStyle}"
|
||||
assists:ControlAssist.Icon="{markup:Icon SymbolValue=ArrowDropUp}"
|
||||
x:Name="PART_LineUpButton" />
|
||||
<Track
|
||||
Grid.Row="1"
|
||||
IsDirectionReversed="true"
|
||||
IsEnabled="{TemplateBinding IsMouseOver}"
|
||||
x:Name="PART_Track">
|
||||
<Track.DecreaseRepeatButton>
|
||||
<RepeatButton Command="{x:Static ScrollBar.PageUpCommand}" Style="{StaticResource RepeatButtonTransparentStyle}" />
|
||||
</Track.DecreaseRepeatButton>
|
||||
<Track.IncreaseRepeatButton>
|
||||
<RepeatButton Command="{x:Static ScrollBar.PageDownCommand}" Style="{StaticResource RepeatButtonTransparentStyle}" />
|
||||
</Track.IncreaseRepeatButton>
|
||||
<Track.Thumb>
|
||||
<Thumb
|
||||
IsEnabled="False"
|
||||
Style="{StaticResource ScrollBarThumbVerticalStyle}"
|
||||
x:Name="ThumbPart" />
|
||||
</Track.Thumb>
|
||||
</Track>
|
||||
<RepeatButton
|
||||
Command="{x:Static ScrollBar.LineDownCommand}"
|
||||
Grid.Row="2"
|
||||
IsEnabled="{TemplateBinding IsMouseOver}"
|
||||
Style="{StaticResource ScrollBarButtonStyle}"
|
||||
assists:ControlAssist.Icon="{markup:Icon SymbolValue=ArrowDropDown}"
|
||||
x:Name="PART_LineDownButton" />
|
||||
</Grid>
|
||||
<ControlTemplate.Triggers>
|
||||
<Trigger Property="IsMouseOver" Value="True">
|
||||
<Setter Property="IsEnabled" TargetName="ThumbPart" Value="True" />
|
||||
<Trigger.EnterActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource ShowScrollItem}" />
|
||||
</Trigger.EnterActions>
|
||||
<Trigger.ExitActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource HideScrollItem}" />
|
||||
</Trigger.ExitActions>
|
||||
</Trigger>
|
||||
<Trigger Property="IsEnabled" Value="False">
|
||||
<Setter Property="Visibility" TargetName="PART_LineUpButton" Value="Hidden" />
|
||||
<Setter Property="Visibility" TargetName="PART_LineDownButton" Value="Hidden" />
|
||||
</Trigger>
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
|
||||
<ControlTemplate TargetType="{x:Type ScrollBar}" x:Key="ScrollBarHorizontalTemplate">
|
||||
<Grid SnapsToDevicePixels="true" x:Name="Bg">
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition MaxWidth="10" />
|
||||
<ColumnDefinition Width="*" />
|
||||
<ColumnDefinition MaxWidth="10" />
|
||||
</Grid.ColumnDefinitions>
|
||||
<Rectangle
|
||||
Fill="{TemplateBinding Background}"
|
||||
Grid.ColumnSpan="3"
|
||||
Opacity="0"
|
||||
RadiusX="4"
|
||||
RadiusY="4"
|
||||
x:Name="border" />
|
||||
<RepeatButton
|
||||
Command="{x:Static ScrollBar.LineLeftCommand}"
|
||||
Grid.Column="0"
|
||||
IsEnabled="{TemplateBinding IsMouseOver}"
|
||||
Style="{StaticResource ScrollBarButtonStyle}"
|
||||
assists:ControlAssist.Icon="{markup:Icon SymbolValue=ArrowLeft}"
|
||||
x:Name="PART_LineLeftButton" />
|
||||
<Track
|
||||
Grid.Column="1"
|
||||
IsEnabled="{TemplateBinding IsMouseOver}"
|
||||
x:Name="PART_Track">
|
||||
<Track.DecreaseRepeatButton>
|
||||
<RepeatButton Command="{x:Static ScrollBar.PageLeftCommand}" Style="{StaticResource RepeatButtonTransparentStyle}" />
|
||||
</Track.DecreaseRepeatButton>
|
||||
<Track.IncreaseRepeatButton>
|
||||
<RepeatButton Command="{x:Static ScrollBar.PageRightCommand}" Style="{StaticResource RepeatButtonTransparentStyle}" />
|
||||
</Track.IncreaseRepeatButton>
|
||||
<Track.Thumb>
|
||||
<Thumb
|
||||
IsEnabled="False"
|
||||
Style="{StaticResource ScrollBarHorizontalThumbStyle}"
|
||||
x:Name="ThumbPart" />
|
||||
</Track.Thumb>
|
||||
</Track>
|
||||
<RepeatButton
|
||||
Command="{x:Static ScrollBar.LineRightCommand}"
|
||||
Grid.Column="2"
|
||||
IsEnabled="{TemplateBinding IsMouseOver}"
|
||||
Style="{StaticResource ScrollBarButtonStyle}"
|
||||
assists:ControlAssist.Icon="{markup:Icon SymbolValue=ArrowRight}"
|
||||
x:Name="PART_LineRightButton" />
|
||||
</Grid>
|
||||
<ControlTemplate.Triggers>
|
||||
<Trigger Property="IsMouseOver" Value="True">
|
||||
<Setter Property="IsEnabled" TargetName="ThumbPart" Value="True" />
|
||||
<Trigger.EnterActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource ShowScrollItem}" />
|
||||
</Trigger.EnterActions>
|
||||
<Trigger.ExitActions>
|
||||
<BeginStoryboard Storyboard="{StaticResource HideScrollItem}" />
|
||||
</Trigger.ExitActions>
|
||||
</Trigger>
|
||||
<Trigger Property="IsEnabled" Value="False">
|
||||
<Setter Property="Visibility" TargetName="PART_LineLeftButton" Value="Hidden" />
|
||||
<Setter Property="Visibility" TargetName="PART_LineRightButton" Value="Hidden" />
|
||||
</Trigger>
|
||||
</ControlTemplate.Triggers>
|
||||
</ControlTemplate>
|
||||
|
||||
<!-- 滚动条样式 -->
|
||||
<Style TargetType="{x:Type ScrollBar}">
|
||||
<Setter Property="Stylus.IsPressAndHoldEnabled" Value="False" />
|
||||
<Setter Property="Stylus.IsFlicksEnabled" Value="False" />
|
||||
<Setter Property="Background" Value="{DynamicResource ControlBackgroundNormalBrush}" />
|
||||
<Setter Property="BorderThickness" Value="1,0" />
|
||||
<Setter Property="Width" Value="10" />
|
||||
<Setter Property="MinWidth" Value="10" />
|
||||
<Setter Property="Template" Value="{StaticResource ScrollBarVerticalTemplate}" />
|
||||
<Style.Triggers>
|
||||
<Trigger Property="Orientation" Value="Horizontal">
|
||||
<Setter Property="Width" Value="Auto" />
|
||||
<Setter Property="MinWidth" Value="0" />
|
||||
<Setter Property="Height" Value="10" />
|
||||
<Setter Property="MinHeight" Value="10" />
|
||||
<Setter Property="BorderThickness" Value="0,1" />
|
||||
<Setter Property="Template" Value="{StaticResource ScrollBarHorizontalTemplate}" />
|
||||
</Trigger>
|
||||
</Style.Triggers>
|
||||
</Style>
|
||||
<!-- 滚动视图 -->
|
||||
<Style TargetType="{x:Type ScrollViewer}">
|
||||
<Setter Property="Template">
|
||||
<Setter.Value>
|
||||
<ControlTemplate TargetType="{x:Type ScrollViewer}">
|
||||
<Grid Background="{TemplateBinding Background}" x:Name="Grid">
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="*" />
|
||||
<ColumnDefinition Width="Auto" />
|
||||
</Grid.ColumnDefinitions>
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="*" />
|
||||
<RowDefinition Height="Auto" />
|
||||
</Grid.RowDefinitions>
|
||||
<ScrollContentPresenter
|
||||
CanContentScroll="{TemplateBinding CanContentScroll}"
|
||||
CanHorizontallyScroll="False"
|
||||
CanVerticallyScroll="False"
|
||||
Content="{TemplateBinding Content}"
|
||||
ContentTemplate="{TemplateBinding ContentTemplate}"
|
||||
Grid.Column="0"
|
||||
Grid.Row="0"
|
||||
Margin="{TemplateBinding Padding}"
|
||||
x:Name="PART_ScrollContentPresenter" />
|
||||
<ScrollBar
|
||||
AutomationProperties.AutomationId="VerticalScrollBar"
|
||||
Cursor="Arrow"
|
||||
Grid.Column="1"
|
||||
Grid.Row="0"
|
||||
Maximum="{TemplateBinding ScrollableHeight}"
|
||||
Minimum="0"
|
||||
Value="{Binding VerticalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
|
||||
ViewportSize="{TemplateBinding ViewportHeight}"
|
||||
Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
|
||||
x:Name="PART_VerticalScrollBar" />
|
||||
<ScrollBar
|
||||
AutomationProperties.AutomationId="HorizontalScrollBar"
|
||||
Cursor="Arrow"
|
||||
Grid.Column="0"
|
||||
Grid.Row="1"
|
||||
Maximum="{TemplateBinding ScrollableWidth}"
|
||||
Minimum="0"
|
||||
Orientation="Horizontal"
|
||||
Value="{Binding HorizontalOffset, Mode=OneWay, RelativeSource={RelativeSource TemplatedParent}}"
|
||||
ViewportSize="{TemplateBinding ViewportWidth}"
|
||||
Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
|
||||
x:Name="PART_HorizontalScrollBar" />
|
||||
</Grid>
|
||||
</ControlTemplate>
|
||||
</Setter.Value>
|
||||
</Setter>
|
||||
<Style.Triggers>
|
||||
<Trigger Property="IsEnabled" Value="False">
|
||||
<Setter Property="Foreground" Value="{DynamicResource TextDisabledBrush}" />
|
||||
</Trigger>
|
||||
</Style.Triggers>
|
||||
</Style>
|
||||
|
||||
</ResourceDictionary>
|
||||
Reference in New Issue
Block a user