WPF 基础控件之 Slider 样式

最新推荐文章于 2024-08-09 15:24:56 发布
最新推荐文章于 2024-08-09 15:24:56 发布
阅读量890 收藏
点赞数
文章标签： wpf qml html animation ehcache
原文链接：https://mp.weixin.qq.com/s?__biz=MzAwNTMxMzg1MA==&mid=2654090608&idx=5&sn=4e07996d73a07d3a39809ad0e6de70c5&chksm=80d81125b7af9833d67592a8b9ce27ac29d38d3d53b6ff0b1fb26678df2653d95e5bdee0c23c&scene=126&&sessionid=0
版权

其他基础控件

1.Window
2.Button
3.CheckBox
4.ComboBox
5.DataGrid
6.DatePicker
7.Expander
8.GroupBox
9.ListBox
10.ListView
11.Menu
12.PasswordBox
13.TextBox
14.RadioButton
15.ToggleButton

Slider  实现下面的效果

d25d10c0271ddad774aca051611d2030.png

1）Slider来实现动画；

  • Grid嵌套 Border并设置ScaleTransform ，当鼠标移入MouseOver 将ScaleTransform.ScaleX 与 ScaleTransform.ScaleY值To = 1.2 放大；

  • 当Orientation设置为Horizontal水平方向走SliderHorizontal；

  • 当Orientation设置为Vertical垂直方向走SliderVertical；

<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">
    
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="../Themes/Basic/ControlBasic.xaml"/>
        <ResourceDictionary Source="../Themes/Basic/Animations.xaml"/>
    </ResourceDictionary.MergedDictionaries>
  
    <sys:Double x:Key="ThumbWidth">16</sys:Double>
    <sys:Double x:Key="ThumbCornerRadius">8</sys:Double>
    <sys:Double x:Key="RepeatButtonSize">5</sys:Double>
    
    <ControlTemplate x:Key="SliderThumbHorizontalTop" TargetType="{x:Type Thumb}">
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryPressedSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource BackgroundSolidColorBrush}"
                    SnapsToDevicePixels="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8" Margin="-1,0,0,0"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="RenderTransform" TargetName="PART_Border">
                    <Setter.Value>
                        <ScaleTransform  ScaleX="1.2" ScaleY="1.2"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <ControlTemplate x:Key="SliderThumbHorizontalBottom" TargetType="{x:Type Thumb}">
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryNormalSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource BackgroundSolidColorBrush}"
                    SnapsToDevicePixels="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8" Margin="-1,0,0,0"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="RenderTransform" TargetName="PART_Border">
                    <Setter.Value>
                        <ScaleTransform  ScaleX="1.2" ScaleY="1.2"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <ControlTemplate x:Key="SliderThumbHorizontal" TargetType="{x:Type Thumb}">
        <ControlTemplate.Resources>
            <!--<Storyboard x:Key="ThumbMouseOut">
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
                                 To="1" Duration="00:00:0.1"/>
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
                                 To="1" Duration="00:00:0.1"/>
            </Storyboard>-->
            <Storyboard x:Key="ThumbMouseOver">
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
                                 From="1"
                                 To="1.2" Duration="00:00:0.1"/>
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
                                 From="1"
                                 To="1.2" Duration="00:00:0.1"/>
            </Storyboard>
        </ControlTemplate.Resources>
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryNormalSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource WindowForegroundColorBrush}"
                    SnapsToDevicePixels="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8" Margin="-1,0,0,0"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
                <Border.RenderTransform>
                    <ScaleTransform/>
                </Border.RenderTransform>
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard x:Name="BeginStoryboard"  Storyboard="{StaticResource ThumbMouseOver}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <StopStoryboard BeginStoryboardName="BeginStoryboard"/>
                    <!--<BeginStoryboard Storyboard="{StaticResource ThumbMouseOut}" />-->
                </Trigger.ExitActions>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <Style x:Key="RepeatButtonTransparent" TargetType="{x:Type RepeatButton}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Focusable" Value="False"/>
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type RepeatButton}">
                    <Rectangle Fill="{TemplateBinding Background}" 
                                   Height="{TemplateBinding Height}" 
                                   Width="{TemplateBinding Width}"/>
                    <!--<Border Background="{TemplateBinding Background}"
                            Height="{TemplateBinding Height}" 
                            Width="{TemplateBinding Width}"
                            CornerRadius="4,4,0,0"/>-->
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <ControlTemplate x:Key="SliderThumbHorizontalDefault" TargetType="{x:Type Thumb}">
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryNormalSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource BackgroundSolidColorBrush}"
                    SnapsToDevicePixels="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8" Margin="-1,0,0,0"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="RenderTransform" TargetName="PART_Border">
                    <Setter.Value>
                        <ScaleTransform  ScaleX="1.2" ScaleY="1.2"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <ControlTemplate x:Key="SliderHorizontal" TargetType="{x:Type Slider}">
        <Border x:Name="border"
                    BorderBrush="{TemplateBinding BorderBrush}" 
                    BorderThickness="{TemplateBinding BorderThickness}" 
                    Background="{TemplateBinding Background}" 
                    SnapsToDevicePixels="True"
                    Padding="2">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <TickBar x:Name="TopTick" Fill="{TemplateBinding Foreground}" Height="4" Margin="0,0,0,2" Placement="Top" Grid.Row="0" Visibility="Collapsed"/>
                <TickBar x:Name="BottomTick" Fill="{TemplateBinding Foreground}" Height="4" Margin="0,2,0,0" Placement="Bottom" Grid.Row="2" Visibility="Collapsed"/>
                <Border x:Name="TrackBackground" 
                        Height="6.0" 
                        Margin="5,0" 
                        Grid.Row="1" 
                        VerticalAlignment="center">
                    <Canvas Margin="-6,-1">
                        <Rectangle x:Name="PART_SelectionRange" 
                                       Fill="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" 
                                       Height="4.0" Visibility="Hidden"/>
                    </Canvas>
                </Border>
                <Track x:Name="PART_Track" Grid.Row="1">
                    <Track.DecreaseRepeatButton>
                        <RepeatButton Command="{x:Static Slider.DecreaseLarge}" 
                                          Style="{DynamicResource RepeatButtonTransparent}" 
                                          Background="{DynamicResource PrimaryNormalSolidColorBrush}" 
                                          Height="{StaticResource RepeatButtonSize}"/>
                    </Track.DecreaseRepeatButton>
                    <Track.IncreaseRepeatButton>
                        <RepeatButton Command="{x:Static Slider.IncreaseLarge}" 
                                      Style="{StaticResource RepeatButtonTransparent}"
                                      Background="{DynamicResource LightSolidColorBrush}" 
                                      Height="{StaticResource RepeatButtonSize}"/>
                    </Track.IncreaseRepeatButton>
                    <Track.Thumb>
                        <Thumb x:Name="Thumb" Focusable="False" 
                                   OverridesDefaultStyle="True" 
                                   Template="{StaticResource SliderThumbHorizontal}" 
                                   VerticalAlignment="Center"/>
                    </Track.Thumb>
                </Track>
            </Grid>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="TickPlacement" Value="TopLeft">
                <Setter Property="Visibility" TargetName="TopTick" Value="Visible"/>
                <Setter Property="Template" TargetName="Thumb" Value="{StaticResource SliderThumbHorizontal}"/>
                <Setter Property="Margin" TargetName="TrackBackground" Value="5,2,5,0"/>
            </Trigger>
            <Trigger Property="TickPlacement" Value="BottomRight">
                <Setter Property="Visibility" TargetName="BottomTick" Value="Visible"/>
                <Setter Property="Template" TargetName="Thumb" Value="{StaticResource SliderThumbHorizontal}"/>
                <Setter Property="Margin" TargetName="TrackBackground" Value="5,0,5,2"/>
            </Trigger>
            <Trigger Property="TickPlacement" Value="Both">
                <Setter Property="Visibility" TargetName="TopTick" Value="Visible"/>
                <Setter Property="Visibility" TargetName="BottomTick" Value="Visible"/>
            </Trigger>
            <Trigger Property="IsSelectionRangeEnabled" Value="True">
                <Setter Property="Visibility" TargetName="PART_SelectionRange" Value="Visible"/>
            </Trigger>
            <Trigger Property="IsKeyboardFocused" Value="True">
                <Setter Property="Foreground" TargetName="Thumb" Value="{DynamicResource PrimaryNormalSolidColorBrush}"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <ControlTemplate x:Key="SliderThumbVerticalLeft" TargetType="{x:Type Thumb}">
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryNormalSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource BackgroundSolidColorBrush}"
                    SnapsToDevicePixels="True" UseLayoutRounding="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="RenderTransform" TargetName="PART_Border">
                    <Setter.Value>
                        <ScaleTransform  ScaleX="1.2" ScaleY="1.2"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <ControlTemplate x:Key="SliderThumbVerticalRight" TargetType="{x:Type Thumb}">
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryNormalSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource BackgroundSolidColorBrush}"
                    SnapsToDevicePixels="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="RenderTransform" TargetName="PART_Border">
                    <Setter.Value>
                        <ScaleTransform  ScaleX="1.2" ScaleY="1.2"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <ControlTemplate x:Key="SliderThumbVerticalDefault" TargetType="{x:Type Thumb}">
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryNormalSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource BackgroundSolidColorBrush}" 
                    SnapsToDevicePixels="True" UseLayoutRounding="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8" Margin="0,0,0,-1"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="RenderTransform" TargetName="PART_Border">
                    <Setter.Value>
                        <ScaleTransform  ScaleX="1.2" ScaleY="1.2"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <ControlTemplate x:Key="SliderThumbVertical" TargetType="{x:Type Thumb}">
        <ControlTemplate.Resources>
            <!--<Storyboard x:Key="ThumbMouseOut">
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
                                 To="1" Duration="00:00:0.1"/>
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
                                 To="1" Duration="00:00:0.1"/>
            </Storyboard>-->
            <Storyboard x:Key="ThumbMouseOver">
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)"
                                 From="1"
                                 To="1.2" Duration="00:00:0.1"/>
                <DoubleAnimation Storyboard.TargetName="PART_Border"
                                 Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)"
                                 From="1"
                                 To="1.2" Duration="00:00:0.1"/>
            </Storyboard>
        </ControlTemplate.Resources>
        <Grid HorizontalAlignment="Center" UseLayoutRounding="True" VerticalAlignment="Center">
            <Border BorderBrush="{DynamicResource PrimaryNormalSolidColorBrush}" 
                    BorderThickness="2" Background="{DynamicResource BackgroundSolidColorBrush}" 
                    SnapsToDevicePixels="True" UseLayoutRounding="True"
                    Height="{StaticResource ThumbWidth}" Width="{StaticResource ThumbWidth}" CornerRadius="8" Margin="0,0,0,-1"
                    Name="PART_Border" RenderTransformOrigin=".5,.5">
                <Border.RenderTransform>
                    <ScaleTransform/>
                </Border.RenderTransform>
            </Border>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard x:Name="BeginStoryboard" Storyboard="{StaticResource ThumbMouseOver}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <StopStoryboard BeginStoryboardName="BeginStoryboard"/>
                    <!--<BeginStoryboard Storyboard="{StaticResource ThumbMouseOut}" />-->
                </Trigger.ExitActions>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    
    
    <ControlTemplate x:Key="SliderVertical" TargetType="{x:Type Slider}">
        <Border x:Name="border" 
                    BorderBrush="{TemplateBinding BorderBrush}" 
                    BorderThickness="{TemplateBinding BorderThickness}" 
                    Background="{TemplateBinding Background}" 
                    SnapsToDevicePixels="True"
                    Padding="2">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition MinWidth="{TemplateBinding MinWidth}" Width="Auto"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <TickBar x:Name="TopTick" Grid.Column="0" Fill="{TemplateBinding Foreground}" Margin="0,0,2,0" Placement="Left" Visibility="Collapsed" Width="4"/>
                <TickBar x:Name="BottomTick" Grid.Column="2" Fill="{TemplateBinding Foreground}" Margin="2,0,0,0" Placement="Right" Visibility="Collapsed" Width="4"/>
                <Border x:Name="TrackBackground" 
                        HorizontalAlignment="center" 
                        Margin="0,5"
                        Width="6.0">
                    <Canvas Margin="-1,-6">
                        <Rectangle x:Name="PART_SelectionRange" 
                                   Fill="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" 
                                   Visibility="Hidden" Width="4.0"/>
                    </Canvas>
                </Border>
                <Track x:Name="PART_Track" Grid.Column="1">
                    <Track.DecreaseRepeatButton>
                        <RepeatButton Command="{x:Static Slider.DecreaseLarge}"
                                          Style="{StaticResource RepeatButtonTransparent}"
                                          Background="{DynamicResource PrimaryNormalSolidColorBrush}" 
                                          Width="{StaticResource RepeatButtonSize}"/>
                    </Track.DecreaseRepeatButton>
                    <Track.IncreaseRepeatButton>
                        <RepeatButton Command="{x:Static Slider.IncreaseLarge}" 
                                          Style="{StaticResource RepeatButtonTransparent}"
                                          Background="{DynamicResource LightSolidColorBrush}" 
                                          Width="{StaticResource RepeatButtonSize}"/>
                    </Track.IncreaseRepeatButton>
                    <Track.Thumb>
                        <Thumb x:Name="Thumb" Focusable="False" 
                                   OverridesDefaultStyle="True" 
                                   Template="{StaticResource SliderThumbVertical}" 
                                   VerticalAlignment="Top"/>
                    </Track.Thumb>
                </Track>
            </Grid>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="TickPlacement" Value="TopLeft">
                <Setter Property="Visibility" TargetName="TopTick" Value="Visible"/>
                <Setter Property="Template" TargetName="Thumb" Value="{StaticResource SliderThumbVertical}"/>
                <Setter Property="Margin" TargetName="TrackBackground" Value="2,5,0,5"/>
            </Trigger>
            <Trigger Property="TickPlacement" Value="BottomRight">
                <Setter Property="Visibility" TargetName="BottomTick" Value="Visible"/>
                <Setter Property="Template" TargetName="Thumb" Value="{StaticResource SliderThumbVertical}"/>
                <Setter Property="Margin" TargetName="TrackBackground" Value="0,5,2,5"/>
            </Trigger>
            <Trigger Property="TickPlacement" Value="Both">
                <Setter Property="Visibility" TargetName="TopTick" Value="Visible"/>
                <Setter Property="Visibility" TargetName="BottomTick" Value="Visible"/>
            </Trigger>
            <Trigger Property="IsSelectionRangeEnabled" Value="True">
                <Setter Property="Visibility" TargetName="PART_SelectionRange" Value="Visible"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <Style TargetType="{x:Type Slider}" BasedOn="{StaticResource ControlBasicStyle}">
        <Setter Property="Stylus.IsPressAndHoldEnabled" Value="False"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="Foreground" Value="{DynamicResource PrimaryNormalSolidColorBrush}"/>
        <Setter Property="Template" Value="{StaticResource SliderHorizontal}"/>
        <Style.Triggers>
            <Trigger Property="Orientation" Value="Vertical">
                <Setter Property="Template" Value="{StaticResource SliderVertical}"/>
            </Trigger>
            <!--<Trigger Property="IsEnabled" Value="False">
                <Setter Property="Opacity" Value="{StaticResource EnabledOpacity}" />
            </Trigger>-->
        </Style.Triggers>
    </Style>

</ResourceDictionary>

2）Styles.Slider.xaml 代码如下；

<WrapPanel Margin="0,10">
           <Slider Width="200"/>
                    <Slider Width="200" Value="50" Maximum="100"  Margin="10,0"/>
                    <Slider Width="200" Value="50" Maximum="100" IsEnabled="False"/>
 </WrapPanel>

Nuget[1]Install-Package WPFDevelopers.Minimal

06427f713a147ec038891624927c754b.gif

[2][3]

参考资料

[1]

Nuget: https://www.nuget.org/packages/WPFDevelopers.Minimal/

[2]

GitHub: https://github.com/WPFDevelopersOrg

[3]

Gitee: https://gitee.com/WPFDevelopersOrg

dotNET跨平台
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
WPF Slider滑动条的颜色修改
dianguachen3172的博客
08-01 996
效果如下： 鄙人虽然开发WPF有些时间，但之前一直是一些简单Template和Style改改之类的工作，并没有深入研究过。此次为了完成工作，首先也是网上搜了半天，没有找到合适的代码直接拷贝（搜索能力待提高），干脆就直接静下心来琢磨琢磨。 一开始在界面上就放了Slider，挠挠头，怎么修改Template才能达到效果呢？后来想到了Blend，之前一直听说很强大的界面设计工具，但是一...
【WPF】WPF Slider 控件自定义样式
qq_37284394的博客
04-17 1583
WPF Slider 控件自定义样式 本文通过改写Slider 控件默认模板，实现自定义样式 一、创建Slider控件 提示：根据需要自行调整大小和位置 <Slider HorizontalAlignment="Left" Margin="0,0,0,0" VerticalAlignment="Top" Width="526" Height="55"/> 二、生成默认模板 1. 选中控件，右击选择“编辑模板”->“编辑副本”，并确定 2. 完成后会生成如下代码 提示：本文只针对水平S
WPF Slider 样式
weixin_45884724的博客
01-04 402
WPF Slider样式
WPF 双滑块自定义控件（RangeSlider）
最新发布
wynneira的博客
08-09 443
经常用到双滑块控件，但是，始终找不到一个特别满意的，然后就从handycontrol中提取出来了一个。给自己当个备份同时也帮助一些有需要的朋友。
WPF滑块控件(Slider)的自定义样式
10-16
主要介绍了WPF滑块控件(Slider)的自定义样式的相关知识，本文给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下
wpf精简风Slider样式资源文件
11-05
精简风的Slider，下载后请修改命名空间，并在App.xaml中引用该资源，可直接在页面中添加
WPF：Slider样式
weixin_34413065的博客
11-22 1627
简述    WPF中Slider分为三部分，滑块类型为Thumb；进度条类型为RepeatButton，其中：位于滑块左侧或下侧部分为DecreaseRepeatButton，位于滑块右侧或上侧部分为IncreaseRepeatButton。   设置Slider样式时，一般单独设置三部分的样式(Style)，然后在Sldier的样式(Style)中引用它们。 代码示例 <Style Tar...
WPF 之更改Slider样式
qq_39338658的博客
08-31 4526
样式添加，其中Thumb滑块的图片自定义，Slider横条的图片也是自定义的图片，引用非常方便 &lt;Window.Resources&gt; &lt;Style x:Key="Slider_Thumb" TargetType="Thumb"&gt; &lt;Setter Property="Focusable" Value="false&quot
slider wpf 垂直_WPF滑块控件(Slider)的自定义样式
weixin_39753674的博客
12-22 382
前言每次开发滑块控件的样式都要花很久去读样式代码，感觉有点记不牢，所以特此备忘。自定义滑块样式首先创建项目，添加Slider控件。然后获取Slider的Window样式，如下图操作。然后弹出界面如下.我们点击确定。点击确定后，我们的页面的Resources中，增加了一系列样式代码，而滑块代码会被修改为如下样子：可以看到，系统为我们的Slider控件增加了样式——Style="{DynamicRes...
WPF自定义进度条控件和slider 滑块控件
03-25
总之，WPF提供的强大样式和模板功能使得自定义`ProgressBar`和`Slider`变得容易且有趣。通过自定义这些控件，不仅可以满足设计需求，还能提升应用的整体用户体验。对WPF样式系统的深入理解和实践，对于任何希望在WPF...
wpf slider（滑块随时间滑动） 时间轴
11-05
WPF，Slider的应用，将滑动条作为时间轴，随时间滑动。 下载次数越多所需积分越高，不定期改低积分。
wpf自定义slider
12-21
一个简单的wpf自定义图片做背景的slider进度条。代码非常简单，高手勿喷。适合初学者读阅。
WPF 控件专题 Slider样式模板
^@^lemon tea^@^
08-08 687
WPF 控件专题 Slider样式模板改写
WPF Slider Styles
YouyoMei的博客
05-31 650
WPF Slider Styles 第一种样式- <Style x:Key="SliderRepeatButtonStyle" TargetType="{x:Type RepeatButton}"> <Setter Property="OverridesDefaultStyle" Value="true"/> <Setter Property="IsTabStop" Value="false"/> <Sett
WPF 控件专题 Slider样式模板二
^@^lemon tea^@^
09-18 609
WPF Slider样式模板二
WPF Slider自定义
m0_48915942的博客
03-12 298
由于Slider可以变换方向，本文只用“SliderHorizontal”水平方向的模板。其余方向可以删除，或者自定义。2. RepeatButton: 在Thumb两侧，共有两个，左边单击减少，右边单击增加。在微软的官方文档上可以看见，Slider由几个部分组成。1. TickBar ：作为Slider的基底。3. Thumb：最上层可以滑动的滑块。要自定义样式，可以分别修改上述各个部分。2. Tick Marks: 刻度。4. Track: 滑块滑动的轨迹。一、自定义样式结果图。二、解析Slider。
wpf 开发中的slider控件
ldd909的专栏
11-16 9542
<br />因为项目需要，在学习wpf,在这期间在用slider时遇到了一些问题，现整理如下，<br />slider控件模糊阴影<br /><Slider.Effect>                <br />                <DropShadowEffect BlurRadius="5" Color="White" Opacity="0.7" ShadowDepth="7"/><br /> </Slider.Effect><br />slider控件value值默认为Double类型
WPF控件详解：内容控件与界面主题
"WPF揭秘(中文版）第四章深入探讨...这一章深入讲解了WPF控件的基础知识，对于理解如何在WPF中创建和操作用户界面至关重要。无论是初学者还是有经验的开发者，都能从中受益，提升构建美观、功能丰富的应用程序的能力。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值