樣式1 拖拽進(jìn)度條<Style x:Key="StyleForRepeatButton" TargetType="{x:Type RepeatButton}"> <Style.Setters> <Setter Property="Background"> <Setter.Value> <LinearGradientBrush StartPoint="1,0" EndPoint="1,0"> <GradientStop Color="Silver" Offset="0"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Height" Value="5"/> <Setter Property="BorderBrush" Value="Transparent"/> <Setter Property="Focusable" Value="False"/> </Style.Setters> <Style.Triggers> <Trigger Property="IsPressed" Value="True"> <!--<Setter Property="Background"> <Setter.Value> <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,1"> <GradientStop Color="Silver" /> <GradientStop Color="Silver" /> </LinearGradientBrush> </Setter.Value> </Setter>--> </Trigger> <Trigger Property="IsMouseOver" Value="False"> <Setter Property="Background" Value="Silver"></Setter> </Trigger> </Style.Triggers> </Style> <ControlTemplate x:Key="tmpThumb" TargetType="{x:Type Thumb}"> <Ellipse Name="e" Width="13" Height="13" Fill="#AEDEE6"/> <ControlTemplate.Triggers> <!--<Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="e" Property="Fill" Value="#AEDEE6"/> </Trigger>--> </ControlTemplate.Triggers> </ControlTemplate> <ControlTemplate x:Key="tmp" TargetType="{x:Type Slider}"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="auto"/> <RowDefinition Height="auto" MinHeight="25"/> <RowDefinition Height="auto"/> </Grid.RowDefinitions> <TickBar x:Name="top" Fill="Magenta" Grid.Row="0" HorizontalAlignment="Stretch" Placement="Top" Height="8" Visibility="Collapsed"/> <Track x:Name="PART_Track" Grid.Row="1" HorizontalAlignment="Stretch"> <Track.IncreaseRepeatButton> <RepeatButton Style="{StaticResource StyleForRepeatButton}" Command="Slider.IncreaseLarge"/> </Track.IncreaseRepeatButton> <Track.DecreaseRepeatButton> <RepeatButton Style="{StaticResource StyleForRepeatButton}" Command="Slider.DecreaseLarge"/> </Track.DecreaseRepeatButton> <Track.Thumb> <Thumb Height="20" Template="{StaticResource tmpThumb}"/> </Track.Thumb> </Track> <TickBar x:Name="Bottom" Grid.Row="2" Fill="Magenta" HorizontalAlignment="Stretch" Visibility="Collapsed" Placement="Bottom" Height="8"/> </Grid> <ControlTemplate.Triggers> <Trigger Property="TickPlacement" Value="TopLeft"> <Setter TargetName="top" Property="Visibility" Value="Visible"/> </Trigger> <Trigger Property="TickPlacement" Value="BottomRight"> <Setter Property="Visibility" TargetName="Bottom" Value="Visible"/> </Trigger> <Trigger Property="TickPlacement" Value="Both"> <Setter TargetName="top" Property="Visibility" Value="Visible"/> <Setter TargetName="Bottom" Property="Visibility" Value="Visible"/> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> 樣式2 音樂(lè)進(jìn)度條,播放進(jìn)度條 <!--筆刷--> <LinearGradientBrush x:Key="SliderBackground" StartPoint="0,0" EndPoint="0,1"> <GradientStop Offset="0" Color="#59ccfc"/> <GradientStop Offset="0.5" Color="#00b3fe"/> <GradientStop Offset="1" Color="#59ccfc"/> </LinearGradientBrush> <LinearGradientBrush x:Key="SliderThumb" StartPoint="0,0" EndPoint="0,1"> <GradientStop Offset="0" Color="#FFD9D3E8"/> <!--<GradientStop Offset="1" Color="#dfdfdf"/>--> </LinearGradientBrush> <LinearGradientBrush x:Key="SliderText" StartPoint="0,0" EndPoint="0,1"> <GradientStop Offset="0" Color="#7cce45"/> <GradientStop Offset="1" Color="#4ea017"/> </LinearGradientBrush> <!--Slider模板--> <Style x:Key="Slider_RepeatButton" TargetType="RepeatButton"> <Setter Property="Focusable" Value="false" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Border Background="{StaticResource SliderBackground}" /> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="Slider_RepeatButton1" TargetType="RepeatButton"> <Setter Property="Focusable" Value="false" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Border Background="Transparent" /> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="Slider_Thumb" TargetType="Thumb"> <Setter Property="Focusable" Value="false" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Thumb"> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition/> <ColumnDefinition/> </Grid.ColumnDefinitions> <Border Background="{StaticResource SliderBackground}"/> <Border Grid.ColumnSpan="2" CornerRadius="4" Background="{StaticResource SliderThumb}" Width="15"> <!--<TextBlock Text="||" HorizontalAlignment="Center" VerticalAlignment="Center"/>--> </Border> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="Slider_CustomStyle" TargetType="Slider"> <Setter Property="Focusable" Value="false" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Slider"> <Grid> <Border Grid.Column="1" BorderBrush="Gray" BorderThickness="1" CornerRadius="8,0,0,8"> <Track Grid.Column="1" Name="PART_Track"> <Track.DecreaseRepeatButton> <RepeatButton Style="{StaticResource Slider_RepeatButton}" Command="Slider.DecreaseLarge"/> </Track.DecreaseRepeatButton> <Track.IncreaseRepeatButton> <RepeatButton Style="{StaticResource Slider_RepeatButton1}" Command="Slider.IncreaseLarge"/> </Track.IncreaseRepeatButton> <Track.Thumb> <Thumb Style="{StaticResource Slider_Thumb}"/> </Track.Thumb> </Track> </Border> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> 樣式 3 拖拽 左右有顏色進(jìn)度條 <Window.Resources> <LinearGradientBrush x:Key="SliderBackground" StartPoint="0,0" EndPoint="0,1"> <GradientStop Offset="0" Color="#59ccfc"/> <GradientStop Offset="0.5" Color="#00b3fe"/> <GradientStop Offset="1" Color="#59ccfc"/> </LinearGradientBrush> <LinearGradientBrush x:Key="SliderThumb" StartPoint="0,0" EndPoint="0,1"> <GradientStop Offset="0" Color="#FFD9D3E8"/> <!--<GradientStop Offset="1" Color="#dfdfdf"/>--> </LinearGradientBrush> <LinearGradientBrush x:Key="SliderText" StartPoint="0,0" EndPoint="0,1"> <GradientStop Offset="0" Color="#7cce45"/> <GradientStop Offset="1" Color="#4ea017"/> </LinearGradientBrush> <LinearGradientBrush x:Key="SliderBackground2" StartPoint="0,0" EndPoint="0,1"> <GradientStop Offset="0" Color="Gray"/> <GradientStop Offset="0.5" Color="Gray"/> <GradientStop Offset="1" Color="#59ccfc"/> </LinearGradientBrush> <!--Slider模板--> <Style x:Key="Slider_RepeatButton" TargetType="RepeatButton"> <Setter Property="Focusable" Value="false" /> <Setter Property="Height" Value="5"/> <Setter Property="BorderBrush" Value="Transparent"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Border Background="{StaticResource SliderBackground}" /> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="Slider_RepeatButton1" TargetType="RepeatButton"> <Setter Property="Focusable" Value="false" /> <Setter Property="Height" Value="5"/> <Setter Property="BorderBrush" Value="Transparent"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="RepeatButton"> <Border Background="Silver" /> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="Slider_Thumb" TargetType="Thumb"> <Setter Property="Focusable" Value="false" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Thumb"> <Ellipse Name="e" Width="15" Height="15" Fill="#AEDEE6"/> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style x:Key="Slider_CustomStyle" TargetType="Slider"> <Setter Property="Focusable" Value="false" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Slider"> <Grid> <!--<Grid.ColumnDefinitions> <ColumnDefinition Width="80"/> <ColumnDefinition/> <ColumnDefinition Width="40"/> </Grid.ColumnDefinitions>--> <!--<Border HorizontalAlignment="Right" BorderBrush="Gray" BorderThickness="1,1,0,1" Background="{StaticResource SliderText}" Width="80" CornerRadius="8,0,0,8"/> <Border Grid.Column="2" HorizontalAlignment="Right" BorderBrush="Gray" BorderThickness="0,1,1,1" Background="{StaticResource SliderText}" Width="40" CornerRadius="0,8,8,0"/> <TextBlock Grid.Column="2" Text="{Binding RelativeSource={RelativeSource TemplatedParent},Path=Tag}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="14"/> <TextBlock Grid.Column="0" Text="{Binding ElementName=PART_Track,Path=Value,StringFormat=/{0:N0/}}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="14" DataContext="{Binding}" />--> <Border Grid.Column="1" BorderBrush="Red" BorderThickness="0" CornerRadius="0,0,0,0"> <Track Grid.Column="1" Name="PART_Track"> <Track.DecreaseRepeatButton> <RepeatButton Style="{StaticResource Slider_RepeatButton}" Command="Slider.DecreaseLarge"/> </Track.DecreaseRepeatButton> <Track.IncreaseRepeatButton> <RepeatButton Style="{StaticResource Slider_RepeatButton1}" Command="Slider.IncreaseLarge"/> </Track.IncreaseRepeatButton> <Track.Thumb> <Thumb Style="{StaticResource Slider_Thumb}"/> </Track.Thumb> </Track> </Border> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> |
|
來(lái)自: 昵稱29515458 > 《WPF》