mcpField
S
syncfusion-maui-radial-gauge

syncfusion-maui-radial-gauge

github.com/syncfusion设计与 UI61207 次安装2 周前更新
代码仓库

关于 syncfusion-maui-radial-gauge

面向 .NET MAUI 开发者的 Syncfusion SfRadialGauge 实现指南,介绍圆形指标控件的轴、指针、范围、注释、动画和交互配置。

主要功能

  1. 01配置刻度范围、标签、刻度线和角度
  2. 02显示颜色区间和阈值
  3. 03使用四种指针类型及多个数值
  4. 04添加文本、图像或自定义视图注释
  5. 05为指针添加动画并支持拖动

适用场景

  1. 01创建速度计或温度计
  2. 02展示 KPI 和状态指标
  3. 03显示环形进度或完成状态
  4. 04构建可交互的音量或亮度控件

安装

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

$npx skills add https://github.com/syncfusion/maui-ui-components-skills --skill syncfusion-maui-radial-gauge

安装后在 Claude Code 中输入/syncfusion-maui-radial-gauge确认已加载。

包含的文件

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

references/
animation-and-interaction.md
annotation.md
axes.md
getting-started.md
pointers.md
ranges.md

详细介绍

实现 .NET MAUI Radial Gauges

概述

Syncfusion® .NET MAUI Radial Gauge(SfRadialGauge)是一款多用途的数据可视化控件,可在圆形刻度上显示数值。它非常适合用于创建速度计、温度监视器、仪表板、进度指示器、指南针和其他圆形指标显示。

何时使用此技能

当用户需要执行以下操作时,请使用此技能:

  • 创建圆形仪表 - 速度计、转速计、温度计、压力表
  • 构建仪表板可视化效果 - KPI 显示、指标监控、状态指示器
  • 显示进度 - 圆形进度条、完成指示器、加载状态
  • 显示范围 - 可视化区域(安全/警告/危险)、阈值指示器
  • 实现交互式控件 - 可拖动表盘、可调节设置、用户输入控件
  • 添加动画过渡效果 - 平滑的数值变化、实时数据更新
  • 构建指南针/方向显示 - 导航辅助工具、方向指示器

组件概述

SfRadialGauge 控件提供:

  • 多种指针类型:4 种指针样式(指针、形状、内容、范围),灵活指示数值
  • 灵活的轴配置:可自定义刻度范围、角度(整圆、半圆、弧形)、标签和刻度线
  • 可视化范围指示器:支持渐变的色彩编码区域,用于显示安全/警告/危险状态
  • 自定义注释:使用角度或轴值,在特定位置放置文本、图像或任意 .NET MAUI 视图
  • 动画系统:平滑的指针过渡效果,支持配置时长和缓动函数
  • 交互式控件:可拖动指针,并通过 ValueChanged/ValueChanging 事件接收用户输入
  • 多轴支持:在一个仪表上显示多个轴,实现复杂的多指标可视化效果
  • 样式选项:全面自定义颜色、渐变和粗细(基于像素或比例的尺寸)

主要功能一览

  • 灵活的轴 - 线性/自定义刻度、可自定义的标签、刻度线和样式
  • 可视化范围 - 色彩编码区域,便于快速解读数值
  • 4 种指针类型 - 指针、形状(标记)、内容(自定义视图)、范围(弧形)
  • 多个指针 - 在同一仪表上显示多个数值
  • 注释 - 在特定位置添加文本、图像或自定义视图
  • 动画 - 支持自定义缓动效果的平滑过渡
  • 交互功能 - 可拖动指针,支持用户输入
  • 高度可自定义 - 全面控制外观和行为

文档和导航指南

入门

📄 阅读: references/getting-started.md

当用户需要执行以下操作时:

  • 安装和设置 Radial Gauge 包
  • 配置 NuGet 包和依赖项
  • 在 MauiProgram.cs 中注册处理程序
  • 创建第一个基本的径向仪表
  • 了解基本结构和组件
  • 快速获取可运行示例
轴配置

📄 阅读: references/axes.md

当用户需要执行以下操作时:

  • 配置轴刻度(最小值、最大值、间隔)
  • 自定义轴的起始角度和结束角度(圆形、半圆形、弧形)
  • 设置轴线样式(粗细、颜色、渐变)
  • 配置标签(位置、旋转、格式、自定义文本)
  • 自定义刻度线(主刻度/次刻度、长度、位置、样式)
  • 为仪表添加背景内容
  • 在单个仪表上创建多个轴
  • 了解轴的位置和基于比例的布局
范围和可视化指示器

📄 阅读: references/ranges.md

当用户需要执行以下操作时:

  • 创建色彩编码范围(例如,安全/警告/危险区域)
  • 设置范围的起始值和结束值
  • 设置范围样式(颜色、渐变、宽度)
  • 设置范围位置(偏移量、位于轴内/轴外)
  • 添加多个范围以显示不同区域
  • 自定义范围端帽(圆角、平直)
  • 为 360° 仪表创建反向顺序的范围
  • 构建速度计式指示器
指针(所有类型)

📄 阅读: references/pointers.md

当用户需要:

  • 针式指针 - 带旋钮和尾部的经典仪表指针
  • 形状指针 - 标记符号(圆形、菱形、三角形等)
  • 内容指针 - 自定义视图(文本、图像、复杂布局)
  • 范围指针 - 从起点填充到当前值的彩色弧线
  • 设置指针值并为过渡添加动画
  • 在一个仪表盘上添加多个指针
  • 自定义指针外观(颜色、大小、形状)
  • 定位指针(相对于轴偏移)
  • 根据使用场景选择合适的指针类型
注释

📄 阅读: references/annotation.md

当用户需要:

  • 添加用于显示数值或单位的文本标签
  • 在仪表盘上放置图像或图标
  • 在特定位置添加自定义视图
  • 使用角度或轴值定位注释
  • 控制径向距离(位置因子)
  • 创建多个注释
  • 根据指针值显示动态内容
  • 构建包含标签和状态指示器的复杂仪表盘布局
动画与交互

📄 阅读: references/animation-and-interaction.md

当用户需要:

  • 启用流畅的指针动画
  • 配置动画时长和缓动效果
  • 创建弹簧或弹跳效果
  • 使指针可拖动,以便用户输入
  • 处理指针值变化
  • 响应用户交互
  • 构建交互式控件(音量、亮度、设置)
  • 优化动画性能

评论

支持 Markdown