syncfusion-maui-range-slider

实现 .NET MAUI 范围滑块

Syncfusion .NET MAUI 范围滑块（SfRangeSlider）是一种高度交互的 UI 控件，允许用户在定义的最小值和最大值之间选择一个范围。它提供丰富的功能，包括轨道自定义、标签、刻度、分隔线和工具提示，可帮助创建直观且视觉效果出色的范围选择体验。

何时使用此技能

当用户需要以下功能时，请使用此技能：

• 实现带有两个滑块，用于选择最小值和最大值的范围滑块
• 创建价格范围选择器（例如，在 $50-$500 之间筛选商品）
• 构建日期/时间范围选择控件
• 实现音量、亮度或温度范围控件
• 创建用于数据可视化的数值范围筛选器
• 构建带标签、刻度和工具提示的自定义范围输入控件
• 实现带步长值的离散或连续范围选择
• 使用颜色、尺寸和样式自定义范围滑块外观
• 通过事件和命令处理范围值更改
• 创建支持 ARIA 的无障碍范围选择界面

主要功能：双滑块交互、数值范围、间隔、离散选择、自定义样式、工具提示、标签、刻度、分隔线、事件、MVVM 命令、RTL 支持和液态玻璃效果。

组件概览

Syncfusion .NET MAUI 范围滑块（SfRangeSlider）是一种交互式 UI 控件，用于在最小值和最大值之间选择一个范围。它提供两个滑块，用户可通过拖动来定义起始值和结束值，并包含轨道样式、标签、刻度、分隔线和工具提示等丰富的视觉功能。

包：Syncfusion.Maui.Sliders
命名空间：Syncfusion.Maui.Sliders
控件：SfRangeSlider

文档和导航指南

入门

📄 阅读： references/getting-started.md
首次实现范围滑块时阅读。内容包括：

• NuGet 包安装（Syncfusion.Maui.Sliders）
• 处理程序注册（ConfigureSyncfusionCore）
• SfRangeSlider 基本初始化
• 命名空间导入和最简示例
• 特定 IDE 的设置（Visual Studio、VS Code、Rider）

轨道自定义

📄 阅读： references/track.md
自定义滑块轨道的外观和行为时阅读。内容包括：

• 设置 Minimum、Maximum、RangeStart、RangeEnd
• 轨道颜色（ActiveFill、InactiveFill）
• 轨道尺寸（ActiveSize、InactiveSize）
• 用于延伸边缘的轨道范围
• 方向（Horizontal、Vertical）
• 用于反转方向的 IsInversed 属性

滑块和覆盖层

📄 阅读： references/thumbs-and-overlays.md
自定义滑块外观和交互反馈时阅读。内容包括：

• 滑块尺寸（Radius）
• 自定义滑块图标（StartThumbIcon、EndThumbIcon）
• 滑块颜色（Fill、Stroke、StrokeThickness）
• 用于滑块重叠的 OverlapStroke
• 滑块覆盖层配置
• 禁用滑块的视觉状态

标签和格式设置

📄 阅读： references/labels.md
显示和设置数值标签格式时阅读。内容包括：

• ShowLabels 属性
• 用于自定义格式的 NumberFormat
• 标签位置（OnTicks、BetweenTicks）
• 边缘标签位置
• 标签样式（颜色、字体、偏移量）
• 用于动态格式设置的 LabelCreated 事件

刻度配置

📄 阅读： references/ticks.md
在轨道上添加视觉标记时阅读。内容包括：

• 用于显示主刻度的 ShowTicks
• 用于显示次刻度的 MinorTicksPerInterval
• 刻度颜色（ActiveFill、InactiveFill）
• 刻度尺寸（ActiveSize、InactiveSize）
• 刻度偏移量和样式
• 禁用刻度的视觉状态

分隔线

📄 阅读： references/dividers.md
在间隔点添加视觉分隔线时阅读。内容包括：

• ShowDividers 属性
• 分隔线半径和颜色
• 分隔线描边和粗细
• DividerStyle 配置
• 禁用分隔线的视觉状态

间隔和选择

📄 阅读： references/intervals-and-selection.md
配置间隔行为和选择模式时。涵盖：

• 用于设置间距的 Interval 属性
• 用于离散选择的 StepSize
• EnableIntervalSelection
• DragBehavior（OnThumb、BetweenThumbs、Both）
• 用于提升性能的 EnableDeferredUpdate
• DeferredUpdateDelay 配置

工具提示

📄 阅读： references/tooltips.md
在交互过程中显示数值工具提示时。涵盖：

• 启用工具提示（SliderTooltip）
• ShowAlways 属性
• 工具提示样式（Fill、Stroke、TextColor）
• 字体和内边距自定义
• 用于格式化的 TooltipLabelCreated 事件

事件和命令

📄 阅读： references/events-and-commands.md
处理数值更改和用户交互时。涵盖：

• ValueChangeStart、ValueChanging、ValueChanged、ValueChangeEnd
• LabelCreated 和 TooltipLabelCreated 事件
• DragStartedCommand、DragCompletedCommand
• 命令参数和 MVVM 模式
• 事件参数和自定义逻辑

Liquid Glass 效果

📄 阅读： references/liquid-glass-effect.md
实现现代半透明设计时。涵盖：

• EnableLiquidGlassEffect 属性
• 平台要求（.NET 10、iOS 26、macOS 26）
• 背景图像设置
• 视觉交互反馈
• 使用场景和最佳实践