syncfusion-wpf-linear-progressbar

Name: syncfusion-wpf-linear-progressbar
Author: syncfusion

github.com/syncfusion设计与 UI5155 次安装1 周前更新

代码仓库

关于 syncfusion-wpf-linear-progressbar

面向 WPF 开发者的 SfLinearProgressBar 实现指南，涵盖进度状态、外观样式和分段配置。

主要功能

01确定与不确定进度状态
02次级缓冲进度
03分段显示进度
04范围颜色与渐变
05自定义颜色、间距和圆角

适用场景

01显示文件下载进度
02动画展示未知时长的加载
03显示视频缓冲进度
04跟踪离散步骤的完成情况

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/syncfusion/wpf-ui-components-skills --skill syncfusion-wpf-linear-progressbar

安装后在 Claude Code 中输入/syncfusion-wpf-linear-progressbar确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

references/

appearance-and-segments.md

getting-started.md

states.md

详细介绍

实现 SfLinearProgressBar（WPF）

何时使用此技能

在以下情况下使用此技能：

显示已知任务的水平进度条（确定进度）
进度未知时显示不确定进度的往返动画
同时显示主要进度和次要（缓冲）进度
将进度拆分为离散的分段
自定义颜色、渐变、内边距或圆角半径
在不同的进度值区间应用范围颜色

程序集： Syncfusion.SfProgressBar.WPF 命名空间： Syncfusion.UI.Xaml.ProgressBar XAML 架构： http://schemas.syncfusion.com/wpf 关键类： SfLinearProgressBar

快速入门

<Window xmlns:Syncfusion="http://schemas.syncfusion.com/wpf">
    <Grid x:Name="grid">
        <Syncfusion:SfLinearProgressBar
            Progress="70"
            Width="500"
            Height="20" />
    </Grid>
</Window>

using Syncfusion.UI.Xaml.ProgressBar;

SfLinearProgressBar linear = new SfLinearProgressBar();
linear.Progress = 70;
linear.Width = 500;
linear.Height = 20;
grid.Children.Add(linear);

文档与导航指南

入门

📄 阅读： references/getting-started.md

NuGet/程序集安装（Syncfusion.SfProgressBar.WPF）
XAML 命名空间和架构声明
在 XAML 和代码隐藏中声明
设置 Progress 属性
通过 SfSkinManager 集成主题

状态

📄 阅读： references/states.md

用于已知进度的确定进度状态（默认）
用于未知时长的不确定进度状态（IsIndeterminate="True"）
缓冲状态（SecondaryProgress、SecondaryProgressColor）
决策指南：何时使用哪种状态
通过 MVVM 绑定动态切换状态

外观与分段

📄 阅读： references/appearance-and-segments.md

IndicatorCornerRadius — 圆角端点
IndicatorPadding — 轨道与进度条之间的间隙
ProgressColor / TrackColor — 自定义纯色
RangeColors：包含 Start、End、Color 的 RangeColor
渐变：RangeColor.IsGradient
AnimationDuration / AnimationEasing（仅用于不确定进度）
SegmentCount — 将进度条拆分为多个区段
带圆角的分段

关键属性

属性	类型	默认值	用途
`Progress`	`double`	`0`	当前进度值（0–100）
`IsIndeterminate`	`bool`	`false`	不确定进度的往返动画
`SecondaryProgress`	`double`	`0`	缓冲/次要进度值
`SecondaryProgressColor`	`Brush`	主题	缓冲条的颜色
`ProgressColor`	`Brush`	主题	进度条的颜色
`TrackColor`	`Brush`	主题	背景轨道的颜色
`IndicatorCornerRadius`	`double`	`0`	进度条的圆角端点
`IndicatorPadding`	`Thickness`	`0`	轨道与指示器之间的间隙
`SegmentCount`	`int`	`0`	分段数量（0 = 无）
`AnimationDuration`	`TimeSpan`	`3000ms`	不确定进度动画的循环时长

常见用例

文件下载栏 — 将 Progress 绑定到下载百分比以显示确定进度
加载动画 — 不确定进度（IsIndeterminate="True"）
视频缓冲 — SecondaryProgress 超前于 Progress
步骤跟踪器 — SegmentCount 与步骤总数相匹配
健康值/电量栏 — 使用 RangeColors 映射绿色/黄色/红色区间
样式化进度胶囊 — 设置 IndicatorCornerRadius="10" 以显示圆角进度条

支持 Markdown

登录后评论