mcpField
S
syncfusion-maui-carousel

syncfusion-maui-carousel

github.com/syncfusion开发61209 次安装2 周前更新
代码仓库

关于 syncfusion-maui-carousel

用于实现和定制 Syncfusion .NET MAUI Carousel(SfCarousel)的文档技能,面向构建图片库或内容轮播的开发者,介绍数据填充、布局、动画、虚拟化和滑动事件。

主要功能

  1. 01线性与 3D 视图模式
  2. 02数据绑定和项目模板
  3. 03可配置的切换动画
  4. 04加载更多与 UI 虚拟化
  5. 05选择和滑动事件

适用场景

  1. 01构建图片库或幻灯片
  2. 02展示卡片或自定义内容
  3. 03动态加载更多项目
  4. 04处理选择和滑动交互

安装

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

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

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

包含的文件

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

references/
advanced-features.md
animation.md
getting-started.md
howto.md
populating-data.md
swipe-events.md
view-modes.md

详细介绍

实现 .NET MAUI Carousel

一份全面的指南,介绍如何实现和自定义 Syncfusion .NET MAUI Carousel(SfCarousel)控件。Carousel 支持用户以交互方式浏览图像数据或内容,并提供多种项目排列自定义选项。

何时使用此指南

在以下情况下使用此指南:

  • 为 .NET MAUI 应用实现轮播/幻灯片组件
  • 浏览图像、卡片或自定义内容集合
  • 创建交互式图片库或产品展示
  • 以线性或默认(3D)视图排列方式显示内容
  • 实现用于浏览内容的滑动手势
  • 添加用于动态加载内容的加载更多功能
  • 通过 UI 虚拟化优化大型数据集的性能
  • 自定义轮播动画和过渡效果
  • 处理轮播选择和滑动事件

组件概述

SfCarousel 控件提供:

  • 多种视图模式:线性排列或默认(3D 透视)布局
  • 灵活的数据填充方式:通过数据绑定或直接创建项目
  • 动画控制:可自定义过渡时长和效果
  • 支持加载更多:按需动态加载其他项目
  • UI 虚拟化:优化大型项目集合的性能
  • 丰富的事件:选择更改、滑动开始/结束、滑动过程事件
  • 自定义选项:项目模板、旋转角度、间距、变换效果

文档与导航指南

入门

📄 阅读: references/getting-started.md

  • 安装和 NuGet 包设置
  • 在 MauiProgram.cs 中注册处理程序
  • 使用最少代码实现基本轮播
  • 添加轮播项目(通过绑定或直接添加)
  • 设置项目尺寸(ItemHeight、ItemWidth)
  • 配置 SelectedIndex 以显示所需项目
填充数据

📄 阅读: references/populating-data.md

  • 使用 ItemsSource 和 ItemTemplate 进行数据绑定
  • 为轮播数据创建模型和 ViewModel
  • 为轮播项目自定义 DataTemplate
  • 使用带有 ItemContent 属性的 SfCarouselItem
  • 使用 ImageName 属性创建简单的图像轮播
  • 使用 ObservableCollection 实现动态数据
视图模式与布局

📄 阅读: references/view-modes.md

  • 使用线性排列(ViewMode.Linear)创建堆叠布局
  • 使用默认排列(ViewMode.Default)创建 3D 透视效果
  • 使用 Offset 属性设置未选中项目之间的间距
  • 设置旋转角度以实现视觉效果
  • 配置 ItemSpacing
动画

📄 阅读: references/animation.md

  • 使用 Duration 属性设置过渡时长
  • 控制动画速度(毫秒)
  • 平滑或快速过渡
  • 默认动画行为(600ms)
高级功能

📄 阅读: references/advanced-features.md

  • 加载更多功能(AllowLoadMore、LoadMoreItemsCount)
  • 自定义 LoadMoreView 外观
  • 使用 UI 虚拟化(EnableVirtualization)提升性能
  • 变换效果(旋转、缩放)
  • 性能优化技巧
滑动事件

📄 阅读: references/swipe-events.md

  • 处理 SwipeStarted 事件
  • 使用 SwipeEnded 事件执行滑动后的操作
  • 使用 Swiping 事件提供滑动过程中的反馈
  • 实现自定义滑动行为
  • 事件参数属性
操作指南

📄 阅读: references/howto.md

  • 在项目更改期间执行操作
  • 使用 SelectionChanged 事件
  • 最佳实践与提示

评论

支持 Markdown