zoukankan      html  css  js  c++  java
  • wpf slider进度条的样式模板,带有进度颜色显示

    效果图:



    仅仅需在前台加上这段代码就可以:

    <UserControl.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>
    
            <!--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>
                                <!--<Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="80"/>
                                    <ColumnDefinition/>
                                    <ColumnDefinition Width="40"/>
                                </Grid.ColumnDefinitions>-->
                                <Grid.Effect>
                                    <DropShadowEffect BlurRadius="10" ShadowDepth="1" />
                                </Grid.Effect>
                                <!--<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 Text="{Binding RelativeSource={RelativeSource TemplatedParent},Path=Tag}" Foreground="White" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="14"/>-->
                                <!--<TextBlock Grid.Column="2" 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="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>
    </UserControl.Resources>


    在这里加入进度条的样式:

    <Grid>
            <Slider  Style="{StaticResource Slider_CustomStyle}"  />

     </Grid>

  • 相关阅读:
    09.MyBatis的逆向工程
    08.MyBatis整合Log4j
    07.MyBatis中的关联查询
    06.动态SQL和foreach
    05.MyBtais两种取值符号以及输入参数和输出参数
    04.MyBatis别名的设置和类型转换器
    03.Mybatis优化
    02.Mybatis的动态代理方式实现增删改查
    01.MyBatis入门
    网络安全之网络安全(数通安全)0
  • 原文地址:https://www.cnblogs.com/yjbjingcha/p/7267812.html
Copyright © 2011-2022 走看看