关于 syncfusion-maui-toolkit-linear-progressbar
该技能为 .NET MAUI 开发者提供 Syncfusion SfLinearProgressBar 的实现与定制指南。它涵盖确定、非确定和缓冲状态,以及分段、动画、范围颜色和进度事件。
主要功能
- 01确定、非确定与缓冲状态
- 02多段进度显示
- 03颜色、渐变和尺寸自定义
- 04动画时长与缓动设置
- 05按进度范围设置颜色
- 06进度变化与完成事件
适用场景
- 01显示文件上传或下载进度
- 02呈现时长未知任务的进展
- 03展示视频缓冲与主要进度
- 04用分段条跟踪多步骤任务
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ syncfusion/ maui-toolkit-ui-components-skills --skill syncfusion-maui-toolkit-linear-progressbar安装后在 Claude Code 中输入/syncfusion-maui-toolkit-linear-progressbar确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
references/animation.mdappearance.mdevents.mdgetting-started.mdrange.mdsegments.mdstates.md详细介绍
实现线性进度条
本指南全面介绍如何实现和自定义 Syncfusion .NET MAUI 线性进度条(SfLinearProgressBar)控件。此组件以矩形形状显示任务进度,支持确定和不确定状态、分段、平滑动画,以及包括范围颜色在内的可自定义视觉效果。
何时使用此技能
在以下情况下使用此技能:
- 实现进度指示器,用于文件上传、下载或数据处理任务
- 显示确定进度,已知完成百分比(0-100%)
- 显示不确定进度,任务时长未知或无法计算
- 可视化缓冲状态,同时显示主要和次要进度(例如视频缓冲)
- 创建多段进度条,用于顺序任务或多步骤任务
- 自定义进度外观,包括颜色、渐变、尺寸、圆角或动画
- 应用基于范围的颜色,显示不同的进度区间(成功、警告、危险)
- 添加进度动画,自定义时长和缓动效果
- 处理进度事件,以便在进度变化或完成时作出响应
组件概述
SfLinearProgressBar 是一个 .NET MAUI 控件,可通过矩形水平条显示任务进度。它支持:
- 多种状态:确定(进度已知)、不确定(时长未知)、缓冲(双进度)
- 分段:将进度拆分为多个部分,用于顺序任务
- 丰富的自定义选项:颜色、渐变、粗细、内边距、圆角
- 平滑动画:可配置时长和缓动函数
- 范围颜色:为不同进度范围设置不同颜色
- 事件:跟踪进度变化和完成状态
文档和导航指南
开始使用
📄 阅读: references/getting-started.md
在以下情况下阅读:
- 安装并设置线性进度条控件
- 添加 NuGet 包(
Syncfusion.Maui.Toolkit) - 注册 Syncfusion Core 处理程序
- 创建第一个基础进度条
- 了解命名空间导入和初始化
进度状态
📄 阅读: references/states.md
在以下情况下阅读:
- 了解确定状态(默认状态,进度已知)
- 为时长未知的任务启用不确定状态
- 使用次要进度实现缓冲状态
- 根据使用场景选择合适的状态
- 为复杂场景组合使用不同状态
分段
📄 阅读: references/segments.md
在以下情况下阅读:
- 在一个进度条中显示多个顺序任务
- 使用 SegmentCount 将进度条拆分为多个部分
- 使用 SegmentGapWidth 自定义分段间距
- 显示逐步推进的多步骤进度
外观自定义
📄 阅读: references/appearance.md
在以下情况下阅读:
- 使用 GradientStops 应用范围颜色(纯色或渐变)
- 自定义轨道、进度和次要进度的高度
- 调整进度指示器周围的内边距
- 设置圆角半径以实现圆角边缘
- 更改进度填充、轨道填充和次要进度的颜色
动画
📄 阅读: references/animation.md
在以下情况下阅读:
- 为不同状态配置动画时长
- 应用缓动效果(Linear、CubicInOut、BounceIn 等)
- 使用 SetProgress() 方法一次性覆盖动画设置
- 自定义不确定动画行为
- 创建平滑且交互流畅的进度过渡效果
范围自定义
📄 阅读: references/range.md
在以下情况下阅读:
- 定义自定义最小值和最大值
- 使用因子值(0.0 到 1.0)代替百分比
- 针对特定场景调整进度范围
- 使用非标准进度刻度
事件
📄 阅读: references/events.md
需要执行以下操作时:
- 处理 ProgressChanged 事件以响应进度更新
- 进度达到最大值时处理 ProgressCompleted 事件
- 根据进度值动态更改外观
- 实现由进度里程碑触发的自定义逻辑
评论
支持 Markdown