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>
wpf slider进度条的样式模板,带有进度颜色显示的更多相关文章
- ProgressBar学习笔记,自定义横向进度条的样式(包含ActionBar上面的进度条)
点显示进度条后→ android:max="100" 进度条的最大值 android:progress 进度条已经完成的进度值 android:progressDrawab ...
- C# WPF 进度条,根据读取数据显示进度条进度,根据Excel文件读取数据,进度条样式
后台代码: //导入 private void Border_MouseLeftButtonUp_2(object sender, MouseButtonEventArgs e) { var path ...
- 圆形进度条css3样式
<view class="con"> <view class="percent-circle percent-circle-left"> ...
- progress进度条的样式修改
由于公司在做的公众号上需要进度条,我就想着用progress标签,可是progress标签很难修改样式,因而在网上查询了一番. 现在总结一下. progress是H5新标签,主要用于显示进度条.由于他 ...
- HTML5 CSS3 诱人的实例 : 网页载入进度条的实现,下载进度条等
今天给大家带来一个比較炫的进度条,进度条在一耗时操作上给用户一个比較好的体验,不会让用户认为在盲目等待,对于没有进度条的长时间等待,用户会任务死机了,毫不犹豫的关掉应用:一般用于下载任务,删除大量任务 ...
- HTML5 CSS3 诱人的实例 : 网页加载进度条的实现,下载进度条等
今天给大家带来一个比较炫的进度条,进度条在一耗时操作上给用户一个比较好的体验,不会让用户觉得在盲目等待,对于没有进度条的长时间等待,用户会任务死机了,毫不犹豫的关掉应用:一般用于下载任务,删除大量任务 ...
- css绘制进度条,持续转动的进度条
//只有 progress pregress-par bar,进度条不会转, //增加 active 这个类,进度条会转, //html结构 <div class='progress activ ...
- js进度条源码下载—js进度条代码
现在很多网站会用到进入网站特效,到网页没有加载完成的时候,会有一个loding特效,加载完了之后才能看到页面,今天就带着做一个js进度条效果,今天要做的效果是纯js进度条加载,没有用到框架,方便大家进 ...
- Python进度条模块tqdm实现任务进度可视化
一.前言 tqdm 是一个易用性强.扩展性高的 Python 进度条库,可以在 Python 长循环中添加一个进度提示信息,我们只需要封装任意的迭代器 tqdm(iterator) 即可. 二.安装 ...
随机推荐
- PHP安装yaf在ubuntu下面的问题解决
1.在执行make的时候出现如下错误: In file included from /root/yaf-2.1.2/yaf_router.c:28: /usr/include/php/ext/pcre ...
- jboss项目设置域名
1.在jboss-web.xml中添加<virtual-host>www.ceshi.com</virtual-host> <jboss-web> <cont ...
- sqlserver如何查询一个表的主键都是哪些表的外键
select object_name(a.parent_object_id) 'tables' from sys.foreign_keys a where a.referenced_object_ ...
- bootstrap datatable 数据刷新问题
在项目中,页面初始化的时候,通过通过向后台请求数据,页面初始化完之后,datatable是有数据的,当我点击页面的搜索按钮(按照时间过滤数据),datatable的数据要能重新刷新或者重载:这一点,我 ...
- centos7服务器安装fail2ban配合Firewalld防护墙防止SSH爆破与防护网站CC攻击
centos7服务器安装fail2ban配合Firewalld防护墙防止SSH爆破与防护网站CC攻击 1.检查firewalld是否启用 #如果您已经安装iptables建议先关闭 service i ...
- Apache Maven 3.0.3 (yum) 安裝 (CentOS 6.4 x64)
介紹http://maven.apache.org/ Maven是一個專案的開發,管理和綜合工具. 下載http://maven.apache.org/download.cgi 參考http://ma ...
- ThinkPHP---TP功能类之联表查询
[一]介绍 在原生的sql中使用join 语法进行数据的联表查询, 在ThinkPHP里支持联表查询操作,但是可以归纳成两种方式:table方法.join方法 (1)table方法:在TP中对应SQL ...
- PHP数据乱码
本文主要总结下PHP数据乱码的解决方案 要点:多个不同文件系统里一定要统一编码 [注意] (1)HTML编码与MySQL编码一致: (2)PHP编码与MySQL编码一致: (3)header头发送字符 ...
- 题解 洛谷P3203/BZOJ2002【[HNOI2010]弹飞绵羊】
裸的LCT,关键是要怎么连边,怎么将这种弹飞关系转化成连边就行了. 那么我们可以这样连边: 一个节点i的爸爸就是i+ki. 没有i+ki那么就被弹飞了,即\(i\)的爸爸是虚拟节点n+1. 那么怎么求 ...
- 支持向量机(SVM)原理浅析
因为网页博客输入公式很麻烦,所以就在word上面写了,然后截图发上来. 后续关于SVM和FC在深度学习当中得使用对比分析,我再补充.