WPF----进度条ProgressBar(渐变色)

news2024/11/15 22:58:49

ProgressBar 是一种用于指示进程或任务的进度的控件,通常在图形用户界面(GUI)中使用。它提供了一种视觉反馈,显示任务的完成程度,帮助用户了解任务的进展情况。

基本特性

  1. MinimumMaximum 属性:

    • 这些属性定义进度的范围。默认情况下,Minimum 为 0,Maximum 为 100。
  2. Value 属性:

    • 这个属性表示当前进度。它应该在 MinimumMaximum 之间。
  3. IsIndeterminate 属性:

    • 如果设置为 TrueProgressBar 将显示一个动画条,而不是实际的进度值。这通常用于无法确定进度百分比的任务。

示例:自定义渐变色 ProgressBar

1. 定义渐变色 ProgressBar 样式

在资源字典或窗口资源中定义 ProgressBar 的样式:

 <Style x:Key="RoundedProgressBar" TargetType="ProgressBar">
     <Setter Property="Height" Value="28"></Setter>
     <!--<Setter Property="Width" Value="600"></Setter>-->
     <Setter Property="Foreground" Value="#E6E6E6"></Setter>
     <Setter Property="Template">
         <Setter.Value>
             <ControlTemplate TargetType="ProgressBar">
                 <Grid>
                     <Border x:Name="PART_Track"
                             Background="#404040"
                             CornerRadius="7"
                             BorderBrush="#666"
                             BorderThickness="1">
                         <Border x:Name="PART_Indicator"
                                 CornerRadius="7,0,0,7"
                                 HorizontalAlignment="Left"
                                 Width="0">
                             <Border.Background>
                                 <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                                     <GradientStop Color="#FF669FB1"  Offset="1.0" />
                                     <GradientStop Color="#90669FB3" Offset="0.5" />
                                     <GradientStop Color="#A6669FB1" Offset="0.35" />
                                     <GradientStop Color="#00669FB1" Offset="0.0" />
                                 </LinearGradientBrush>
                             </Border.Background>
                         </Border>
                     </Border>
                 </Grid>
                 <ControlTemplate.Triggers>
                     <Trigger Property="IsIndeterminate" Value="True">
                         <Setter TargetName="PART_Indicator" Property="Background" Value="Green"/>
                     </Trigger>
                     <Trigger Property="IsIndeterminate" Value="False">
                         <!--<Setter TargetName="PART_Indicator" Property="Width" 
                                 Value="{Binding RelativeSource={RelativeSource TemplatedParent}, 
                                 Path=ActualWidth, Converter={StaticResource ProgressWidthConverter}}"/>-->
                     </Trigger>
                 </ControlTemplate.Triggers>
             </ControlTemplate>
         </Setter.Value>
     </Setter>
 </Style>
2. 在 XAML 中使用 ProgressBar 控件:
 <Grid >
     <ProgressBar Style="{StaticResource RoundedProgressBar}"  HorizontalAlignment="Stretch"   Value="{Binding ProgressValue}"  Minimum="0" Maximum="100"  />
     <TextBlock TextAlignment="Center" Foreground="#E6E6E6" VerticalAlignment="Center" >
         <Run Text="{Binding ProgressValue}"></Run>
         <Run>%</Run></TextBlock>
 </Grid>
3. ViewModel

ViewModel 中定义一个绑定到 ProgressBar 的属性ProgressValue:

 [ObservableProperty]
 private int _progressValue = 0;
4.渐变色颜色解析

设置颜色与透明度关系

在 WPF 中,颜色的透明度是通过 ARGB (Alpha, Red, Green, Blue) 值表示的,其中 Alpha 值控制透明度。Alpha 值范围是 0 到 255,其中 0 表示完全透明,255 表示完全不透明。

如果你想要 35% 的透明度,你可以计算相应的 Alpha 值。35% 透明度意味着 65% 不透明度,因此你可以使用以下公式来计算 Alpha 值:

Alpha=255×65100=255×0.65≈166\text{Alpha} = 255 \times \frac{65}{100} = 255 \times 0.65 \approx 166Alpha=255×10065​=255×0.65≈166

因此,Alpha 值大约是 166,对应的十六进制值是 A6

所以对应的颜色值为#A6669FB1。

最终结果如下:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1869676.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

智能充电桩网关,构建高效充电网络

近年来我国新能源汽车的增长速度出现明显的上升趋势&#xff0c;但是其充电桩的发展还比较缓慢。目前在充电桩系统设计期间仍存在一些问题&#xff0c;主要表现在充电设施短缺、充电难等问题&#xff0c;这些问题的发生均会在一定程度上限制新能源汽车的发展&#xff0c;这就需…

华宽通中标长沙市政务共性能力建设项目,助力智慧政务建设新飞跃

在数字化浪潮的推动下&#xff0c;长沙市政府正积极拥抱智慧城市建设&#xff0c;以科技力量提升政务服务效能。华宽通凭借其卓越的技术实力与丰富的项目经验&#xff0c;成功中标长沙市政务共性能力建设项目&#xff0c;这无疑是对华宽通在智慧城市领域实力的高度认可。 华宽…

基于springboot、vue汽车租赁系统

设计技术&#xff1a; 开发语言&#xff1a;Java数据库&#xff1a;MySQL技术&#xff1a;SpringbootMybatisvue工具&#xff1a;IDEA、Maven、Navicat 主要功能&#xff1a; 用户进入系统可以查看首页、个人中心、车辆信息管理、租赁订单列表管理、还车记录管理等操作 管理…

亚马逊卖家的ERP代理贴牌与独立部署策略

贴牌&#xff0c;就是将亚马逊ERP进行个性化定制&#xff0c;包括更换成自己公司的logo、域名、收款账户&#xff0c;同时支持与自己的物流渠道进行对接&#xff0c;以满足自建仓库的需求。 对于独立部署&#xff0c;这需要有自己的服务器、数据库和存储空间等基础设施。在贴牌…

向量化算法 doc2vec

第1关&#xff1a;认识 Doc2vec Doc2vec 算法简介 Doc2vec 又叫做 Paragraph2vec&#xff0c; Sentence embeddings&#xff0c;是一种非监督式算法&#xff0c;可以获得句子、段落、文档的向量表达&#xff0c;是 Word2vec 的拓展。学出来的向量可以通过计算距离来找句子、段…

别人工作8小时,我只需1小时!这些宝藏网站我都替你收集好了!

关注公众号【程序员世杰】&#xff0c;回复【宝藏网站】即可获得跳转链接 软件 mac应用下载 很多破解版应该都可以找到 snipaste&#xff1a; 截图工具&#xff0c;快捷截图&#xff0c;贴图等功能。 幕布&#xff1a; 快速编辑思维导图。 sublime text: 文档编辑器&…

吴恩达2022机器学习专项课程C2W3:2.27 选修_数据倾斜

目录 处理不平衡数据集1.分类需求描述2.计算精确率和召回率 权衡精确率和召唤率1.手动调整阈值2.F1分数 总结 处理不平衡数据集 1.分类需求描述 如果你在处理一个机器学习应用&#xff0c;其中正例和负例的比例&#xff08;用于解决分类问题&#xff09;非常不平衡&#xff0…

【b站-湖科大教书匠】3 数据链路层-计算机网络微课堂

课程地址&#xff1a;【计算机网络微课堂&#xff08;有字幕无背景音乐版&#xff09;】 https://www.bilibili.com/video/BV1c4411d7jb/?share_sourcecopy_web&vd_sourceb1cb921b73fe3808550eaf2224d1c155 3 数据链路层 3.1 数据链路层概述 3.1.1 数据链路层在网络体系结…

深度学习 --- stanford cs231学习笔记五(训练神经网络之数据的预处理)

数据的预处理(Data Preprocessing) 2 Data Preprocessing数据的预处理 数据预处理的几种方法 2&#xff0c;1 数据的零点中心化 数据的零点中心化的目的就是为了把数据的整体分布拉回到原点附近&#xff0c;也就是让数据的整体均值变为0。 ​ 2&#xff0c;2 数据的标准化 数据…

介绍ES6中的class类:(一) 类的基本语法

一、类的由来与简介 1. 简介 很早很早之前&#xff0c;在JavaScript的世界里&#xff0c;生成实例对象的传统方法是通过构造函数。 嗯哼&#xff1f; function Point(x, y) {this.x x;this.y y; }Point.prototype.toString function () {return ( this.x , this.y )…

MATLAB2024a下的BP神经网络回归工具箱预测

1 打开BP神经网络回归工具箱GUI界面 图1-1 如图1-1所示&#xff0c;虽然叫神经网络拟合但确实是BP神经网络回归工具箱&#xff0c;如果想要使用其他神经网络模型&#xff0c;可以打开左边的深度网络网络设计器&#xff0c;如图1-2、图1-3所示&#xff1a; 图1-2 图1-3 2 导入训…

Java操作Word文档

文章目录 Java操作Word文档引言1、技术选型结论 2、基础文本填充2.1 引入依赖2.1.1. poi2.1.2. poi-ooxml2.1.3. poi-ooxml-schemas 总结2.2 业务思路2.3 业务层 OfficeService2.4 通用工具类 OfficeUtils2.5 控制层 OfficeController 3、表格3.1 准备模板3.2 业务层 OfficeSer…

NVIDIA控制面板3D设置一栏中不能通过预览更改图形设置的解决办法

今天因为GeForce Experience弹窗让我更新之后&#xff0c;手欠直接删掉了 然后图中标出的两个选项就没了 解决方法很简单&#xff0c;就是下回来&#xff0c;hhh https://www.nvidia.cn/geforce/drivers/ 直接下载就行&#xff0c;不用管版本&#xff0c;但是这种驱动千万不要…

本地项目上传到GitHub上(李豆)

本地项目上传到GitHub上(李豆) 准备工作&#xff1a; 本地需要有 git 也需要有一个 GitHub 账号 首先需要在 GitHub 新建一个空仓库 在想要上传项目的文件夹中使用 Git 命令操作 初始化&#xff1a; git init与 github 仓库进行链接 &#xff1a;git remote add origin …

妙手ERP正式接入Lazada 3PF,支持批量设置产品库存,管理多仓发货

Lazada平台近期又有大动作&#xff0c;上线了3PF一店多运模式&#xff01; 一、Lazada 3PF一店多运模式 在介绍3PF一店多运模式前&#xff0c;要先说明一下原有的Lazada履约模式&#xff0c;此前&#xff0c;Lazada为跨境商家提供两大类物流履约方案&#xff1a; 一类&#x…

谷歌网络营销中SEO的策略有哪些?

在网络营销中&#xff0c;SEO&#xff08;搜索引擎优化&#xff09;是一种关键策略&#xff0c;旨在提高网站在搜索引擎结果中的排名。首先&#xff0c;要进行关键词研究&#xff0c;找出潜在客户使用的搜索词。接下来&#xff0c;优化网站内容&#xff0c;使其包含这些关键词&…

Android高级面试_8_热修补插件化等

Android 高级面试&#xff1a;插件化和热修复相关 1、dex 和 class 文件结构 class 是 JVM 可以执行的文件类型&#xff0c;由 javac 编译生成&#xff1b;dex 是 DVM 执行的文件类型&#xff0c;由 dx 编译生成。 class 文件结构的特点&#xff1a; 是一种 8 位二进制字节…

“必答题”-中小制造企业如何做好数字化转型

实现数字化转型是当前中小制造企业生存下去的重要保障。通过数字化转型&#xff0c;中小企业可以充分利用数字技术对其生产、运营、管理等环节进行全链路的改造和应用&#xff0c;提升企业的竞争力。 那么&#xff0c;中小制造企业的数字化要如何做&#xff1f; 中小制造企业数…

LLM在软件测试中的革新应用

一、引言 随着人工智能技术的蓬勃发展&#xff0c;大语言模型&#xff08;Large Language Model&#xff0c;简称LLM&#xff09;如GPT系列&#xff0c;在自然语言处理领域取得了显著进展。LLM不仅能够处理复杂的自然语言任务&#xff0c;还在多个领域展现出广泛的应用潜力。在…

项目分层--简单图书管理系统

分层情况 实体类Book代码 //实体类 public class Book {private int id;private String name;private int bsum;public Book() {}public Book(int id, String name, int bsum) {this.id id;this.name name;this.bsum bsum;}public int getId() {return id;}public void set…