重新想象 Windows 8 Store Apps (4) - 控件之提示控件: ProgressRing; 范围控件: ProgressBar, Slider
原文:重新想象 Windows 8 Store Apps (4) - 控件之提示控件: ProgressRing; 范围控件: ProgressBar, Slider

[源码下载]

重新想象 Windows 8 Store Apps (4) - 控件之提示控件: ProgressRing; 范围控件: ProgressBar, Slider

作者:webabcd

介绍
重新想象 Windows 8 Store Apps 之提示控件

  • ProgressRing - 进度圈控件

重新想象 Windows 8 Store Apps 之范围控件

  • ProgressBar - 进度条控件
  • Slider - 滑动条控件

示例
1、ProgressRing 的 Demo
ProgressRingDemo.xaml

<Pagex:Class="XamlDemo.Controls.ProgressRingDemo"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="using:XamlDemo.Controls"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"mc:Ignorable="d"><Grid Background="Transparent"><StackPanel Margin="120 0 0 0"><!--ProgressRing - 进度圈控件IsActive - 是否显示--><ProgressRing IsActive="{Binding IsChecked, ElementName=chkRunning}" Width="200" Height="200" HorizontalAlignment="Left" /><CheckBox Name="chkRunning" Content="Running" IsChecked="True" /></StackPanel></Grid>
</Page>

2、ProgressBar 的 Demo
ProgressBarDemo.xaml

<Pagex:Class="XamlDemo.Controls.ProgressBarDemo"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="using:XamlDemo.Controls"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"mc:Ignorable="d"><Grid Background="Transparent"><StackPanel Margin="120 0 0 0"><!--ProgressBar - 进度条控件IsIndeterminate - 是否是无法确定进度的进度条Minimum - 进度条的最小值Maximum - 进度条的最大值Value - 进度条的当前值ShowPaused - 显示暂停状态ShowError - 显示错误状态ValueChanged - 进度条的当前值发生变化后所触发的事件--><ProgressBar IsIndeterminate="True" Width="200" HorizontalAlignment="Left"ShowPaused="{Binding IsChecked, ElementName=radPaused}"ShowError="{Binding IsChecked, ElementName=radError}" /><ProgressBar IsIndeterminate="False" Width="200" Minimum="0" Maximum="100" Value="50"  HorizontalAlignment="Left" Margin="0 20 0 0"ShowPaused="{Binding IsChecked, ElementName=radPaused}"ShowError="{Binding IsChecked, ElementName=radError}"/><StackPanel Orientation="Horizontal" Margin="0 20 0 0"><RadioButton x:Name="radRunning" GroupName="ProgressState" Content="Running" IsChecked="True"/><RadioButton x:Name="radPaused" GroupName="ProgressState" Content="Paused"/><RadioButton x:Name="radError" GroupName="ProgressState" Content="Error"/></StackPanel></StackPanel></Grid>
</Page>

3、Slider 的 Demo
SliderDemo.xaml

<Pagex:Class="XamlDemo.Controls.SliderDemo"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="using:XamlDemo.Controls"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:myControls="using:MyControls"mc:Ignorable="d"><Grid Background="Transparent"><Grid.Resources><local:MyThumbToolTipValueConverter x:Key="MyThumbToolTipValueConverter" /></Grid.Resources><!--Slider - 滑动条控件Value - 滑动条的值SmallChange - 按键盘左右键时,滑动条的值的变化量Orientation - 滑动条的布局方向,Horizontal:水平放置,Vertical:垂直放置IsDirectionReversed - 增加值方向为左到右或下到上则为 false,反之为 trueIsThumbToolTipEnabled - 是否在 thumb 旁显示当前值的提示ThumbToolTipValueConverter - 在 thumb 旁显示当前值的提示时所使用的 ConverterMinimum - 最小值Maximum - 最大值ValueChanged - 当前值发生变化后所触发的事件TickPlacement - 如何显示刻度线,Windows.UI.Xaml.Controls.Primitives.TickPlacement枚举(None, TopLeft, BottomRight, Outside, Inline)TickFrequency - 刻度线的间隔StepFrequency - 每一步的间隔SnapsTo - 按 TickFrequency 做 Snap 还是按 StepFrequency 做 Snap,Windows.UI.Xaml.Controls.Primitives.SliderSnapsTo枚举StepValues - 按 StepFrequency 做 Snap(默认值)Ticks - 按 TickFrequency 做 Snap--><StackPanel Margin="120 0 0 0"><Slider Width="100" SmallChange="2" Value="20" HorizontalAlignment="Left" /><Slider Height="100" Orientation="Vertical" IsDirectionReversed="True" HorizontalAlignment="Left"IsThumbToolTipEnabled="True" ThumbToolTipValueConverter="{StaticResource MyThumbToolTipValueConverter}" /><Slider Width="800" Minimum="0" Maximum="800" StepFrequency="100" HorizontalAlignment="Left" TickPlacement="Inline" TickFrequency="80" SnapsTo="StepValues" /><!--自定义 Slider 使其具有圆角效果,类似 ios 的滑动条(具体实现参考 MyControls 项目中的 MySlider)--><myControls:MySlider Width="100" HorizontalAlignment="Left" /></StackPanel></Grid>
</Page>

SliderDemo.xaml.cs

/** Slider - 滑动条控件* Thumb - 可由用户拖动的控件(Slider 内的可拖动部分就是一个 Thumb 控件)*/using System;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Data;namespace XamlDemo.Controls
{public sealed partial class SliderDemo : Page{public SliderDemo(){this.InitializeComponent();}}// 为 Slider 的 ThumbToolTipValueConverter 提供 Converterpublic sealed class MyThumbToolTipValueConverter : IValueConverter{public object Convert(object value, Type targetType, object parameter, string language){// 在 Slider 的值后面加一个百分号return value + "%";}public object ConvertBack(object value, Type targetType, object parameter, string language){return null;}}
}

4、自定义 Slider 使其具有圆角效果
MyControls/MySlider.cs

/** 改变 Slider 的样式,使其具有圆角效果,类似 ios 的滑动条*/using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Shapes;namespace MyControls
{public class MySlider : Slider{// 原 loaded 背景(Slider 中已加载部分的背景)private Rectangle _loadedBackground;// 由于用原 loaded 背景实现圆角有一些问题,所以新增了一个 Rectangle 来辅助private Rectangle _loadedBackgroundCustom;private Thumb _thumb;public MySlider() : base(){this.DefaultStyleKey = typeof(MySlider);}protected override void OnValueChanged(double oldValue, double newValue){base.OnValueChanged(oldValue, newValue);_loadedBackgroundCustom.HorizontalAlignment = Windows.UI.Xaml.HorizontalAlignment.Left;// loaded 背景的宽度为原 loaded 背景的宽度加上 thumb 宽度的二分之一_loadedBackgroundCustom.Width = _loadedBackground.Width + _thumb.Width / 2;}protected override void OnApplyTemplate(){base.OnApplyTemplate();_loadedBackground = GetTemplateChild("HorizontalDecreaseRect") as Rectangle;_loadedBackgroundCustom = GetTemplateChild("HorizontalBorderCustom") as Rectangle;_thumb = GetTemplateChild("HorizontalThumb") as Thumb;}}
}

MyControls/themes/MySlider.xaml

<ResourceDictionaryxmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:local="using:MyControls"><Style TargetType="local:MySlider"><Setter Property="Background" Value="{StaticResource SliderTrackBackgroundThemeBrush}"/><Setter Property="BorderBrush" Value="{StaticResource SliderBorderThemeBrush}"/><Setter Property="BorderThickness" Value="{StaticResource SliderBorderThemeThickness}"/><Setter Property="Foreground" Value="{StaticResource SliderTrackDecreaseBackgroundThemeBrush}"/><Setter Property="ManipulationMode" Value="None"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="local:MySlider"><Grid Margin="{TemplateBinding Padding}"><Grid.Resources><Style x:Key="SliderThumbStyle" TargetType="Thumb"><Setter Property="BorderThickness" Value="1"/><Setter Property="BorderBrush" Value="{StaticResource SliderThumbBorderThemeBrush}"/><Setter Property="Background" Value="{StaticResource SliderThumbBackgroundThemeBrush}"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="Thumb"><!--将原来的用 Border 实现的 thumb 改为用 Ellipse 来实现,从而实现圆形的 thumb<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"/>--><Ellipse Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}" Fill="{TemplateBinding Background}"/></ControlTemplate></Setter.Value></Setter></Style></Grid.Resources><VisualStateManager.VisualStateGroups><VisualStateGroup x:Name="CommonStates"><VisualState x:Name="Normal"/><VisualState x:Name="Pressed"><Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalDecreaseRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePressedBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalTrackRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPressedBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="VerticalDecreaseRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePressedBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="VerticalTrackRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPressedBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="HorizontalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="HorizontalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBorderThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="VerticalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="VerticalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPressedBorderThemeBrush}"/></ObjectAnimationUsingKeyFrames></Storyboard></VisualState><VisualState x:Name="Disabled"><Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="HorizontalBorder"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderDisabledBorderThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Stroke" Storyboard.TargetName="VerticalBorder"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderDisabledBorderThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalDecreaseRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreaseDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalTrackRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="VerticalDecreaseRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreaseDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="VerticalTrackRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="HorizontalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="HorizontalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="VerticalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="VerticalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbDisabledBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="TopTickBar"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalInlineTickBar"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkInlineDisabledForegroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="BottomTickBar"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="LeftTickBar"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="VerticalInlineTickBar"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkInlineDisabledForegroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="RightTickBar"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTickMarkOutsideDisabledForegroundThemeBrush}"/></ObjectAnimationUsingKeyFrames></Storyboard></VisualState><VisualState x:Name="PointerOver"><Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalDecreaseRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePointerOverBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="HorizontalTrackRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPointerOverBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="VerticalDecreaseRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackDecreasePointerOverBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="VerticalTrackRect"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderTrackPointerOverBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="HorizontalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="HorizontalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBorderThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="VerticalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBackgroundThemeBrush}"/></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="VerticalThumb"><DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource SliderThumbPointerOverBorderThemeBrush}"/></ObjectAnimationUsingKeyFrames></Storyboard></VisualState></VisualStateGroup><VisualStateGroup x:Name="FocusStates"><VisualState x:Name="Focused"><Storyboard><DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualWhiteHorizontal"/><DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualBlackHorizontal"/><DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualWhiteVertical"/><DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisualBlackVertical"/></Storyboard></VisualState><VisualState x:Name="Unfocused"/></VisualStateGroup></VisualStateManager.VisualStateGroups><Grid x:Name="HorizontalTemplate" Background="Transparent"><Grid.ColumnDefinitions><ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/><ColumnDefinition Width="*"/></Grid.ColumnDefinitions><Grid.RowDefinitions><RowDefinition Height="17"/><RowDefinition Height="Auto"/><RowDefinition Height="32"/></Grid.RowDefinitions><!--原滑动条进度的整体背景,通过修改使其具有圆角效果<Rectangle x:Name="HorizontalTrackRect" Grid.ColumnSpan="3" Fill="{TemplateBinding Background}" Grid.Row="1"/>--><Rectangle x:Name="HorizontalTrackRect" Grid.ColumnSpan="3" Fill="{TemplateBinding Background}" Grid.Row="1" RadiusX="5" RadiusY="5"/><!--原滑动条进度的 Loaded 背景,通过修改使其具有圆角效果(需要增加一个 HorizontalBorderCustom 做辅助,详见后)<Rectangle x:Name="HorizontalDecreaseRect" Fill="{TemplateBinding Foreground}" Grid.Row="1"/>--><Rectangle x:Name="HorizontalDecreaseRect" Fill="{TemplateBinding Foreground}" Grid.Row="1" RadiusX="5" RadiusY="5"/><TickBar x:Name="TopTickBar" Grid.ColumnSpan="3" Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" Height="{StaticResource SliderOutsideTickBarThemeHeight}" Margin="0,0,0,2" Visibility="Collapsed" VerticalAlignment="Bottom"/><TickBar x:Name="HorizontalInlineTickBar" Grid.ColumnSpan="3" Fill="{StaticResource SliderTickMarkInlineBackgroundThemeBrush}" Height="{StaticResource SliderTrackThemeHeight}" Grid.Row="1" Visibility="Collapsed"/><TickBar x:Name="BottomTickBar" Grid.ColumnSpan="3" Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" Height="{StaticResource SliderOutsideTickBarThemeHeight}" Margin="0,2,0,0" Grid.Row="2" Visibility="Collapsed" VerticalAlignment="Top"/><Rectangle x:Name="HorizontalBorder" Grid.ColumnSpan="3" Grid.Row="1" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}" /><!--HorizontalBorderCustom 是新增的,通过其来实现滑动条进度的 Loaded 的圆角效果--><Rectangle x:Name="HorizontalBorderCustom" Grid.ColumnSpan="3" Grid.Row="1" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}" Fill="{TemplateBinding Foreground}" RadiusX="5" RadiusY="5" Width="0"/><Thumb x:Name="HorizontalThumb" Background="{StaticResource SliderThumbBackgroundThemeBrush}" Grid.Column="1" DataContext="{TemplateBinding Value}" Height="{StaticResource SliderTrackThemeHeight}" Grid.Row="1" Style="{StaticResource SliderThumbStyle}" Width="{StaticResource SliderTrackThemeHeight}"/><Rectangle x:Name="FocusVisualWhiteHorizontal" Grid.ColumnSpan="3" IsHitTestVisible="False" Opacity="0" Grid.RowSpan="3" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashArray="1,1"/><Rectangle x:Name="FocusVisualBlackHorizontal" Grid.ColumnSpan="3" IsHitTestVisible="False" Opacity="0" Grid.RowSpan="3" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" StrokeDashArray="1,1"/></Grid><Grid x:Name="VerticalTemplate" Background="Transparent" Visibility="Collapsed"><Grid.ColumnDefinitions><ColumnDefinition Width="17"/><ColumnDefinition Width="Auto"/><ColumnDefinition Width="17"/></Grid.ColumnDefinitions><Grid.RowDefinitions><RowDefinition Height="*"/><RowDefinition Height="Auto"/><RowDefinition Height="Auto"/></Grid.RowDefinitions><Rectangle x:Name="VerticalTrackRect" Grid.Column="1" Fill="{TemplateBinding Background}" Grid.RowSpan="3"/><Rectangle x:Name="VerticalDecreaseRect" Grid.Column="1" Fill="{TemplateBinding Foreground}" Grid.Row="2"/><TickBar x:Name="LeftTickBar" Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" HorizontalAlignment="Right" Margin="0,0,2,0" Grid.RowSpan="3" Visibility="Collapsed" Width="{StaticResource SliderOutsideTickBarThemeHeight}"/><TickBar x:Name="VerticalInlineTickBar" Grid.Column="1" Fill="{StaticResource SliderTickMarkInlineBackgroundThemeBrush}" Grid.RowSpan="3" Visibility="Collapsed" Width="{StaticResource SliderTrackThemeHeight}"/><TickBar x:Name="RightTickBar" Grid.Column="2" Fill="{StaticResource SliderTickmarkOutsideBackgroundThemeBrush}" HorizontalAlignment="Left" Margin="2,0,0,0" Grid.RowSpan="3" Visibility="Collapsed" Width="{StaticResource SliderOutsideTickBarThemeHeight}"/><Rectangle x:Name="VerticalBorder" Grid.Column="1" Grid.RowSpan="3" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/><Thumb x:Name="VerticalThumb" Background="{StaticResource SliderThumbBackgroundThemeBrush}" Grid.Column="1" DataContext="{TemplateBinding Value}" Height="{StaticResource SliderTrackThemeHeight}" Grid.Row="1" Style="{StaticResource SliderThumbStyle}" Width="{StaticResource SliderTrackThemeHeight}"/><Rectangle x:Name="FocusVisualWhiteVertical" Grid.ColumnSpan="3" IsHitTestVisible="False" Opacity="0" Grid.RowSpan="3" StrokeDashOffset="1.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashArray="1,1"/><Rectangle x:Name="FocusVisualBlackVertical" Grid.ColumnSpan="3" IsHitTestVisible="False" Opacity="0" Grid.RowSpan="3" StrokeDashOffset="0.5" StrokeEndLineCap="Square" Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}" StrokeDashArray="1,1"/></Grid></Grid></ControlTemplate></Setter.Value></Setter></Style>
</ResourceDictionary>

OK
[源码下载]

posted on 2014-03-08 15:08 NET未来之路 阅读(...) 评论(...) 编辑 收藏

转载于:https://www.cnblogs.com/lonelyxmas/p/3587942.html

重新想象 Windows 8 Store Apps (4) - 控件之提示控件: ProgressRing; 范围控件: ProgressBar, Slider...相关推荐

  1. 重新想象 Windows 8 Store Apps (10) - 控件之 ScrollViewer 特性: Chaining, Rail, Inertia, Snap, Zoom...

    原文:重新想象 Windows 8 Store Apps (10) - 控件之 ScrollViewer 特性: Chaining, Rail, Inertia, Snap, Zoom [源码下载] ...

  2. 重新想象 Windows 8 Store Apps (9) - 控件之 ScrollViewer 基础

    原文:重新想象 Windows 8 Store Apps (9) - 控件之 ScrollViewer 基础 [源码下载] 重新想象 Windows 8 Store Apps (9) - 控件之 Sc ...

  3. 重新想象 Windows 8 Store Apps (49) - 输入: 获取输入设备信息, 虚拟键盘, Tab 导航, Pointer, Tap, Drag, Drop...

    重新想象 Windows 8 Store Apps (49) - 输入: 获取输入设备信息, 虚拟键盘, Tab 导航, Pointer, Tap, Drag, Drop 原文:重新想象 Window ...

  4. 重新想象 Windows 8 Store Apps (52) - 绑定: 与 Element Model Indexer Style RelativeSource 绑定, 以及绑定中的数据转换...

    重新想象 Windows 8 Store Apps (52) - 绑定: 与 Element Model Indexer Style RelativeSource 绑定, 以及绑定中的数据转换 原文: ...

  5. 重新想象 Windows 8 Store Apps (61) - 通信: http, oauth

    重新想象 Windows 8 Store Apps (61) - 通信: http, oauth 原文:重新想象 Windows 8 Store Apps (61) - 通信: http, oauth ...

  6. 重新想象 Windows 8 Store Apps (27) - 选取器: 联系人选取窗口, 自定义联系人选取窗口...

    原文:重新想象 Windows 8 Store Apps (27) - 选取器: 联系人选取窗口, 自定义联系人选取窗口 [源码下载] 重新想象 Windows 8 Store Apps (27) - ...

  7. 重新想象 Windows 8 Store Apps (59) - 锁屏

    原文:重新想象 Windows 8 Store Apps (59) - 锁屏 [源码下载] 重新想象 Windows 8 Store Apps (59) - 锁屏 作者:webabcd 介绍 重新想象 ...

  8. Unity Game Starter Kit for Windows Store and Windows Phone Store games

    原地址:http://digitalerr0r.wordpress.com/2013/09/30/unity-game-starter-kit-for-windows-store-and-window ...

  9. 重新想象 Windows 8.1 Store Apps (79) - 控件增强: MediaElement, Frame

    重新想象 Windows 8.1 Store Apps (79) - 控件增强: MediaElement, Frame 原文:重新想象 Windows 8.1 Store Apps (79) - 控 ...

最新文章

  1. 剑指offer:面试题30. 包含min函数的栈
  2. Boyang Tex上海帛扬时装面料有限公司
  3. Activity返回数据给上一个活动
  4. python显示无效语法怎么处理-Python不支持 i ++ 语法的原因解析
  5. python简介怎么写-python简历模板范文
  6. matlab数组操作
  7. Linux(Redhat5.5)配置时间服务器(Ntp)法
  8. r软件说明lib文件未指明_软件说明文件
  9. 8-4:C++继承之子类的默认构造函数如何使用
  10. (zt)Flash与C++交互
  11. python模拟百度搜索点击链接_python采集百度搜索结果带有特定URL的链接代码实例...
  12. oracle中的case when then else end 用法
  13. html语言中bodyalink表示,HTML语言中,
  14. 完全背包问题python_令人头疼的背包九讲(2)完全背包问题
  15. 南京邮电大学-IP网络技术重难点突破(江凌云老师课程)
  16. cad卸载不干净_如何才能干净的卸载顽固软件?不给恶意软件留机会!
  17. MyEclipse10破解过程
  18. win python虚拟环境安装
  19. 思科《计算机网络》第三章考试答案
  20. 【看表情包学Linux】环境安装 | 安装XShell | 基本的账号管理

热门文章

  1. 剑指offer03-数组中重复的数字(java)|leetcode刷题
  2. linux shell 等待输入_linux运维——基础篇
  3. cvc降噪和主动降噪_市面上的降噪耳机,物理降噪和主动降噪,你会怎么选择?...
  4. python参数估计_用python求参数估计的置信区间
  5. 最美教师颁奖词计算机,[最美教师张玉滚颁奖词]最美教师颁奖词
  6. python父进程调用子进程_Python2.7下,调用subprocess启动子进程,读取子进程标准输出若干问题...
  7. python找出矩阵中的马鞍点_矩阵的马鞍点
  8. 子组件调用父组件方法_Vuejs组件(一)组件的注册使用方法
  9. 干货 | 深度剖析C语言的main函数
  10. 在阿里、腾讯、美团工作有什么区别?