# SinleUI > SinleUI 是一个基于 uni-app x 的移动端 UI 框架，提供 100+ 组件与配套 API。 下面每个链接都是文档站（https://sinleui.pages.dev）一个页面的 Markdown 版本。组件页包含 API 与示例源码。所有页面合在一个文件里：https://sinleui.pages.dev/llms-full.txt。 ## AI 开发 - [AI 开发](https://sinleui.pages.dev/ai/index.md): SinleUI 为 Vibe Coding Harness（Claude Code、Codex、ZCode、DeepSeek Harness、Cursor… - [Skill](https://sinleui.pages.dev/ai/skill.md): sinleui-app-dev 是供 AI 编码助手使用的 SinleUI Skill。安装后，AI 可以查阅框架规范，减少每次对话中重复说明的内容 - [适配指南](https://sinleui.pages.dev/ai/setup.md): 安装 SinleUI 的 Skill 后，就可以向 AI 描述需要开发的页面或功能 - [实践经验](https://sinleui.pages.dev/ai/practices.md): 用 AI 编写 SinleUI 页面时，除了说明需求，还需要提供框架资料和项目约定。下面整理了一些任务安排和检查方法，供开发时参考 ## 开始 - [介绍](https://sinleui.pages.dev/get-started/introduction.md): SinleUI - [安装](https://sinleui.pages.dev/get-started/setup.md): 点我去插件市场下载😀 - [快速上手](https://sinleui.pages.dev/get-started/get-started.md): 本节将介绍如何在项目中使用 SinleUI - [注意事项](https://sinleui.pages.dev/get-started/notes.md): 例如 - [框架设计](https://sinleui.pages.dev/get-started/framework.md): 本页详细介绍 SinleUI 的整体架构、核心机制与设计理念，帮助您理解框架如何工作、为何这样设计 - [CSS 变量](https://sinleui.pages.dev/get-started/css-variables.md): SinleUI 通过页面根组件 sn-page 向页面注入一整套 CSS 变量，页面内所有子组件（含 `sn-popup`、`sn-modal`… ## API - [API](https://sinleui.pages.dev/api/index.md): SinleUI 向外暴露全局可操作的框架对象 `$snui`（框架配置与全局能力）、`snu`（工具库聚合门面）、一系列钩子、核心库（颜色库… ## 钩子 - [钩子](https://sinleui.pages.dev/api/hooks/index.md): SinleUI 采用 Vue3 组合式 API 设计，向组件与开发者暴露一组钩子，用于获取框架状态并在组件内响应式使用。所有 hooks 统一从插件入口导出 - [useTheme](https://sinleui.pages.dev/api/hooks/use-theme.md): 获取与切换当前主题（亮色 / 暗色 / 自动跟随系统） - [useStyle](https://sinleui.pages.dev/api/hooks/use-style.md): 获取当前风格（Style，应用皮肤）与切换风格 - [useFactors](https://sinleui.pages.dev/api/hooks/use-factors.md): 响应式读取五个全局尺寸乘数（修改 `$snui.*Factor` 后自动更新） - [useHover](https://sinleui.pages.dev/api/hooks/use-hover.md): 统一点击态（按下反馈）机制。组件的按下/抬起/过渡状态管理，替代旧版 `hover-class`。本 hook 为组件内部使用，也可用于自定义组件 - [useResolve](https://sinleui.pages.dev/api/hooks/use-resolve.md): `$` 前缀动态尺寸解析与颜色简写解析 - [useHistory](https://sinleui.pages.dev/api/hooks/use-history.md): 增量操作日志式的撤销/重做存储引擎 - [useTabbarHeights](https://sinleui.pages.dev/api/hooks/use-tabbar-heights.md): 读取当前 `sn-page` 作用域内的 Tabbar 实际高度，用于在子页面滚动内容末尾放置占位，使内容能经过固定导航栏背后呈现毛玻璃效果 - [useI18n](https://sinleui.pages.dev/api/hooks/use-i18n.md): 组件语言（插件 i18n）响应式读取 - [useExternalStyle](https://sinleui.pages.dev/api/hooks/use-external-style.md): 外部样式透传转字符串 - [useBacktop](https://sinleui.pages.dev/api/hooks/use-backtop.md): 滚动容器与返回顶部联动机制 ## 类型 - [类型](https://sinleui.pages.dev/api/types/index.md): SinleUI 的全部类型（含扩展组件类型）均统一从 `@/uni_modules/sinle-ui` 导出，使用时从插件入口导入即可，例如 - [API 类型](https://sinleui.pages.dev/api/types/api.md): 组件与 API 公用、或仅 API 使用的框架级类型。全部类型从 `@/uni_modules/sinle-ui` 导入 - [组件类型](https://sinleui.pages.dev/api/types/component.md): SinleUI 组件专属类型的统一参考。全部类型（含扩展组件类型）均统一从 `@/uni_modules/sinle-ui` 导出，使用时从插件入口导入即可 ## 错误和日志 - [错误处理机制](https://sinleui.pages.dev/api/error/error.md): SinleUI 的错误处理完全遵循 uni 错误规范，统一使用 `UniError` 对象 - [日志管理机制](https://sinleui.pages.dev/api/error/logger.md): 框架（及 SinleUI 相关插件）的日志统一经 `sinle-logger` 插件输出，带 `[Snui]` 前缀，可通过全局开关控制 - [错误码对照表](https://sinleui.pages.dev/api/error/standard.md): SinleUI 相关插件统一错误码与错误信息对照 ## 基础组件 - [Button 按钮](https://sinleui.pages.dev/components/sn-button.md): 按钮组件，用于触发操作或提交表单 - [Icon 图标](https://sinleui.pages.dev/components/sn-icon.md): 字体图标组件，内置开源图标库 Remix Icon 全量图标，组件加载时自动注册字体 - [Image 图片](https://sinleui.pages.dev/components/sn-image.md): 增强版图片组件，相比内置 `image` 组件更易用 - [Link 链接](https://sinleui.pages.dev/components/sn-link.md): 可点击跳转的文本链接，默认以主题深主色显示 - [Text 文本](https://sinleui.pages.dev/components/sn-text.md): 文本组件，既支持通过属性传值，也支持通过默认插槽放置内容（使用插槽时优先显示插槽内容） - [View 视图容器](https://sinleui.pages.dev/components/sn-view.md): 最基础的视图容器，用于包裹各种元素内容、搭建页面结构，用法与内置 `view` 组件类似 ## 表单组件 - [Rate 评分](https://sinleui.pages.dev/components/sn-rate.md): 评分组件，通过点击图标（默认星星）打分 - [Slider 滑动选择](https://sinleui.pages.dev/components/sn-slider.md): 滑动选择器，通过拖动滑块在一个数值区间内选择数值 - [SliderDouble 双向滑动选择](https://sinleui.pages.dev/components/sn-slider-double.md): 双向（区间）滑动选择器，轨道上有两个滑块，绑定长度为 2 的数值数组表示区间 `[较小值, 较大值]` - [ArcSlider 环形滑块](https://sinleui.pages.dev/components/sn-arc-slider.md): 沿圆弧拖动的滑动选择器，用于角度或数值选择 - [Switch 开关](https://sinleui.pages.dev/components/sn-switch.md): 开关选择器，点击在开 / 关之间切换，小球带滑动动画 - [SwitchButton 切换按钮](https://sinleui.pages.dev/components/sn-switch-button.md): 可切换选中状态的按钮，内部基于 `sn-button` 扩展 - [Stepper 步进器](https://sinleui.pages.dev/components/sn-stepper.md): 步进器，由减按钮、数值输入框与加按钮组成 - [Input 输入框](https://sinleui.pages.dev/components/sn-input.md): 基于内置 `input` 组件封装的输入框，输入内容支持双向绑定 - [Mention 提及输入框](https://sinleui.pages.dev/components/sn-mention.md): 用于在文本输入中通过提及符号插入并管理标签的输入框，常见于 @ 好友、# 话题等场景 - [InputField 标签输入框](https://sinleui.pages.dev/components/sn-input-field.md): 自带标签与错误提示的单行输入框，用于移动端表单的文本录入 - [CodeInput 验证码输入框](https://sinleui.pages.dev/components/sn-code-input.md): 验证码 / 密码输入框，由若干独立单元格组成 - [SlideCaptcha 滑块验证](https://sinleui.pages.dev/components/sn-slide-captcha.md): 滑块验证码组件 - [Textarea 文本域](https://sinleui.pages.dev/components/sn-textarea.md): 基于内置 `textarea` 组件封装的多行文本输入域，输入内容支持双向绑定 - [TextareaField 标签文本域](https://sinleui.pages.dev/components/sn-textarea-field.md): 自带标签与错误提示的多行文本域，用于表单中的长文本录入 - [FormField 表单项](https://sinleui.pages.dev/components/sn-form-field.md): 通用表单项容器基座，是 `sn-input-field`、`sn-textarea-field` 等字段组件的布局外壳，提供「标签 + 内容 + 底部错误提示」… - [Keyboard 自定义键盘](https://sinleui.pages.dev/components/sn-keyboard.md): 基于底部弹层封装的安全键盘，由组件接管输入，适合替代系统键盘的场景 - [Radio 单选](https://sinleui.pages.dev/components/sn-radio.md): 单选组件，由单选组、圆球形态选项与标签形态选项三部分组成 - [Agreement 协议](https://sinleui.pages.dev/components/sn-agreement.md): 用户协议勾选组件，用于协议文本展示与勾选确认 - [Checkbox 复选](https://sinleui.pages.dev/components/sn-checkbox.md): 复选组件，用于在一组选项中选中任意多项 - [Tree 树形选择](https://sinleui.pages.dev/components/sn-tree.md): 树形结构数据的选择与浏览组件 - [Label Radio 标签单选](https://sinleui.pages.dev/components/sn-label-radio.md): 标签形式的单选组件，只需提供数据即可使用，比 Radio 更简单 - [Label Checkbox 标签多选](https://sinleui.pages.dev/components/sn-label-checkbox.md): 标签形式的多选组件，只需提供数据即可使用，比 Checkbox 更简单 - [Select 选择框](https://sinleui.pages.dev/components/sn-select.md): 用于简单单选的数据选择器，点击选择框后在锚点附近弹出选项列表，点选即完成选择 - [Cascader 级联选择器](https://sinleui.pages.dev/components/sn-cascader.md): 从底部弹出的多级联动选择器，适合多层级数据的逐级选择 - [Picker 选择器](https://sinleui.pages.dev/components/sn-picker.md): 从底部弹出的多列滚动选择器，适合数据量大或结构较复杂的选择场景 - [DatetimePicker 日期时间选择器](https://sinleui.pages.dev/components/sn-datetime-picker.md): 从底部弹出的日期时间滚动选择器，用于选择日期与时间 - [Calendar 日历选择器](https://sinleui.pages.dev/components/sn-calendar.md): 从底部弹出的日历选择器，支持单选、范围与多选三种选择模式 - [CalendarView 月历视图](https://sinleui.pages.dev/components/sn-calendar-view.md): 内联在页面中的可滑动月历视图（无弹层），支持单选、范围与多选三种模式 - [CalendarWeek 周日历](https://sinleui.pages.dev/components/sn-calendar-week.md): 一次只显示一周的周日历，可左右滑动切换 - [RegionPicker 地区选择器](https://sinleui.pages.dev/components/sn-region-picker.md): 从底部弹出的省/市/县三级行政区划滚动选择器，内置中国省市区数据，无需业务传入数据源 - [ColorPicker 颜色选择器](https://sinleui.pages.dev/components/sn-color-picker.md): 弹出式颜色选择器，用于在底部抽屉中完成颜色选取与确认 - [Form 表单](https://sinleui.pages.dev/components/sn-form.md): 数据收集与校验组件，三层结构配合完成表单项的注册、校验与错误展示 - [UploadMedia 媒体上传](https://sinleui.pages.dev/components/sn-upload-media.md): 用于快速选择并上传图片 / 视频媒体文件，分为基础版（`sn-upload-media`）与 uniCloud… ## 展示组件 - [Cell 单元格](https://sinleui.pages.dev/components/sn-cell.md): 列表项单元格，左侧为标题与描述，右侧为值与箭头图标 - [Album 相册](https://sinleui.pages.dev/components/sn-album.md): 用于以九宫格形式展示一组图片，常见于动态、详情页的图片列表 - [Line 分割线](https://sinleui.pages.dev/components/sn-line.md): 分割线组件，可包含文本或圆点 - [ArcProgress 环形进度](https://sinleui.pages.dev/components/sn-arc-progress.md): 环形（圆弧）进度展示组件 - [Badge 徽标](https://sinleui.pages.dev/components/sn-badge.md): 未读消息与消息提示徽标，包裹在目标内容右上角显示 - [Avatar 头像](https://sinleui.pages.dev/components/sn-avatar.md): 用户头像组件，支持图片、文本与图标三种展示形式 - [AvatarGroup 头像组](https://sinleui.pages.dev/components/sn-avatar-group.md): 将多个头像组合成头像组，用于展示参与者 - [Card 卡片](https://sinleui.pages.dev/components/sn-card.md): 通用内容卡片容器，用于收纳展示一组相关信息 - [PostCard 动态卡片](https://sinleui.pages.dev/components/sn-post-card.md): 用于展示社交动态 / 帖子卡片，常见于动态流与详情页 - [Skeleton 骨架屏](https://sinleui.pages.dev/components/sn-skeleton.md): 骨架屏组件，在真实数据加载之前展示页面的大致结构 - [Tag 标签](https://sinleui.pages.dev/components/sn-tag.md): 标签组件，用于标记和分类 - [More 查看更多](https://sinleui.pages.dev/components/sn-more.md): 可折叠的长内容容器，内容高度超过最小高度时显示「展开查看更多」 - [Loading 加载](https://sinleui.pages.dev/components/sn-loading.md): 加载中状态指示组件 - [Progress 进度条](https://sinleui.pages.dev/components/sn-progress.md): 进度条组件，用于显示一个任务或过程的进度 - [Dateformat 日期格式化](https://sinleui.pages.dev/components/sn-dateformat.md): 时间格式化组件，将时间戳格式化为指定格式的日期字符串或相对时间 - [Empty 缺省页](https://sinleui.pages.dev/components/sn-empty.md): 缺省页组件，在页面异常、无内容或加载状态时给出友好提示 - [HighlightText 高亮文本](https://sinleui.pages.dev/components/sn-highlight-text.md): 高亮文本组件，将文本中匹配关键词的片段以主题主色高亮，常用于搜索结果与关键词标注 - [Ellipsis 文本省略](https://sinleui.pages.dev/components/sn-ellipsis.md): 多行文本省略组件，内容超出行数限制时自动截断并显示省略号 - [Watermark 水印](https://sinleui.pages.dev/components/sn-watermark.md): 在页面或卡片内容上方平铺一层倾斜重复的水印文本 - [Alert 警告信息](https://sinleui.pages.dev/components/sn-alert.md): 页面内的重要提示信息条，用于展示警告、成功等状态提示 - [Amount 金额](https://sinleui.pages.dev/components/sn-amount.md): 金额格式化展示组件，将数值拆分为货币符号、整数与小数三部分渲染 - [NoticeBar 通知栏](https://sinleui.pages.dev/components/sn-notice-bar.md): 通知栏组件，用于展示通知信息 - [Table 表格](https://sinleui.pages.dev/components/sn-table.md): 表格组件，由表格容器、行与单元格三部分配合组成 ## 反馈组件 - [Result 结果页](https://sinleui.pages.dev/components/sn-result.md): 结果页组件，用于展示成功、失败、警告等操作结果 - [Popup 弹出层](https://sinleui.pages.dev/components/sn-popup.md): 通用弹出层容器，只负责遮罩、显隐与动画，内容完全由插槽自定义 - [Modal 模态框](https://sinleui.pages.dev/components/sn-modal.md): 自带完整 UI 模板的模态对话框：标题 + 内容 + 确定 / 取消按钮 - [Overlay 遮罩层](https://sinleui.pages.dev/components/sn-overlay.md): 全屏遮罩层，用于强调特定元素或拦截页面交互，常与弹出层、模态框搭配使用 - [Toast 轻提示](https://sinleui.pages.dev/components/sn-toast.md): 轻提示（吐司），默认居中显示、2 秒后自动消失，可配置图标、加载状态与显示位置 - [Message 消息条](https://sinleui.pages.dev/components/sn-message.md): 全局消息条组件，在页面顶部 / 底部弹出轻量消息提示，支持多条消息依次排列成队列并自动消失 - [Notification 通知](https://sinleui.pages.dev/components/sn-notification.md): 全局通知组件，从页面顶部或底部弹出带标题与内容的通知卡片，适合订单状态、系统消息等重要提醒 - [Tooltip 提示框](https://sinleui.pages.dev/components/sn-tooltip.md): 提示框，点击触发器后在附近弹出说明文字，常用于解释某个按钮或操作的用途 - [LoadingPage 加载页](https://sinleui.pages.dev/components/sn-loading-page.md): 页面级加载占位组件，页面信息尚未加载完成时使用，避免出现视觉空白 - [Drawer 抽屉](https://sinleui.pages.dev/components/sn-drawer.md): 从屏幕四个方向滑出的半屏面板，常用于导航菜单、筛选、购物车等场景 - [DrawerList 抽屉长列表](https://sinleui.pages.dev/components/sn-drawer-list.md): 底部滑出的抽屉式长列表，适合在抽屉中展示大量数据的场景（如播放列表、消息列表、评论区） - [Actionsheet 操作菜单](https://sinleui.pages.dev/components/sn-actionsheet.md): 从底部弹出的操作菜单，用于展示一组操作项供用户选择 - [Popover 定位弹出层](https://sinleui.pages.dev/components/sn-popover.md): 在指定屏幕坐标处弹出的轻量弹出层，常用于长按菜单、点击气泡等场景 ## 布局组件 - [Page 页面](https://sinleui.pages.dev/components/sn-page.md): 页面根组件，占据整个页面并内置纵向滚动的内容区（不显示滚动条），无需手动管理滚动容器 - [ScrollView 滚动视图](https://sinleui.pages.dev/components/sn-scroll-view.md): 通用滚动视图容器，适用于页面内容、长列表等需要滚动与加载状态的场景 - [ListView 长列表](https://sinleui.pages.dev/components/sn-list-view.md): 数据驱动的长列表组件，适合展示大量同类数据 - [Refresher 下拉刷新](https://sinleui.pages.dev/components/sn-refresher.md): 下拉刷新条，用于自定义滚动容器的下拉刷新样式，也可单独使用 - [Backtop 回到顶部](https://sinleui.pages.dev/components/sn-backtop.md): 长页面 / 长列表的回到顶部按钮，滚动超过阈值后浮现 - [Grid 宫格](https://sinleui.pages.dev/components/sn-grid.md): 宫格组件，用于同时展示多个同类项目，常作为首页「金刚区」入口 - [Drag 拖拽排序](https://sinleui.pages.dev/components/sn-drag.md): 拖拽排序组件，通过双向绑定数组数据调整顺序 - [Gap 占位间隔](https://sinleui.pages.dev/components/sn-gap.md): 单纯用于占位的间隔组件 - [KeyboardTop 键盘上方区域](https://sinleui.pages.dev/components/sn-keyboard-top.md): 把任意内容固定在系统键盘上方的容器组件，常用于评论输入栏、回复框与工具栏 - [Float Board 浮动面板](https://sinleui.pages.dev/components/sn-float-board.md): 固定吸附在屏幕四边之一的浮动面板，始终显示 - [Float Button 浮动按钮](https://sinleui.pages.dev/components/sn-float-button.md): 固定定位的悬浮按钮，可用于悬浮操作入口、回到顶部等场景 - [Swipe Action 滑动操作](https://sinleui.pages.dev/components/sn-swipe-action.md): 列表项的滑动操作组件：左滑露出右侧操作区，右滑露出左侧操作区 - [Loadmore 加载更多](https://sinleui.pages.dev/components/sn-loadmore.md): 用于标识页面底部加载数据时的状态 - [Pagination 分页器](https://sinleui.pages.dev/components/sn-pagination.md): 分页器，用于列表内容的分页导航 - [Waterflow 瀑布流](https://sinleui.pages.dev/components/sn-waterflow.md): 数据驱动的瀑布流组件，按多列排布不定高条目，支持下拉刷新与滚动加载 - [Footer 页脚](https://sinleui.pages.dev/components/sn-footer.md): 页脚组件，常用于页面底部展示品牌 Logo、导航链接与版权信息 ## 导航组件 - [Topbar 导航栏](https://sinleui.pages.dev/components/sn-topbar.md): 页面顶部导航栏，包含标题、返回按钮与右侧功能区 - [Tabbar 底部导航栏](https://sinleui.pages.dev/components/sn-tabbar.md): 底部导航栏，用于在页面底部切换子页面，支持文字、字体图标与图片子项，样式可自由定制 - [Sidebar 侧边栏](https://sinleui.pages.dev/components/sn-sidebar.md): 侧边导航栏，适用于商城选购等场景 - [Tabs 标签页](https://sinleui.pages.dev/components/sn-tabs.md): 标签页组件，用于切换不同标签内容，一般用于顶部导航 - [Subsection 分段器](https://sinleui.pages.dev/components/sn-subsection.md): 分段器，用于用户从几个选项中选择某一个，常作为视图切换控件 - [Steps 步骤条](https://sinleui.pages.dev/components/sn-steps.md): 步骤条，用于展示流程进度，由 `sn-steps`（容器）与 `sn-step`（步骤项）组合使用 - [Menu 菜单](https://sinleui.pages.dev/components/sn-menu.md): 锚点菜单，在触发元素（按钮、图标等）旁弹出一组操作选项，常用于「更多操作」场景 - [Search 搜索框](https://sinleui.pages.dev/components/sn-search.md): 基于 `sn-input` 二次封装的搜索框，键盘确认按钮固定为 search，开箱即用 ## 功能组件 - [Collapse 折叠面板](https://sinleui.pages.dev/components/sn-collapse.md): 折叠面板，用于收纳内容区域 - [Sorter 排序](https://sinleui.pages.dev/components/sn-sorter.md): 排序组件，常用于列表排序切换 - [Timer 计时器](https://sinleui.pages.dev/components/sn-timer.md): 正向计时器，从 0 开始累计计时 - [Countdown 倒计时](https://sinleui.pages.dev/components/sn-countdown.md): 倒计时组件，用于展示一段剩余时间 - [Countto 数字滚动](https://sinleui.pages.dev/components/sn-countto.md): 数字滚动组件，常用于数据大屏、经营数据展示等场景 - [Fullscreen 原位展开全屏](https://sinleui.pages.dev/components/sn-fullscreen.md): 让一块内容“原位”拉伸占满整个视口的容器（如卡片、模拟播放器），收起时动画回到原位置 - [Clipper 图片裁剪](https://sinleui.pages.dev/components/sn-clipper.md): 内置完整裁剪交互的图片裁剪器，可卡片内嵌，也可作为整页裁剪器使用 - [Signature 签名](https://sinleui.pages.dev/components/sn-signature.md): 手写签名板，适用于电子签署与自由书写 - [Sketchpad 画板](https://sinleui.pages.dev/components/sn-sketchpad.md): 独立的手写画板组件，适用于签名、涂鸦、笔记等自由绘制场景 - [CalendarPunch 签到日历](https://sinleui.pages.dev/components/sn-calendar-punch.md): 签到打卡日历，是日历组件的打卡形态 ## 扩展插件（部分须额外下载） - [Barcode 一维码](https://sinleui.pages.dev/components/sn-barcode.md): 纯 Canvas 自绘的一维码组件，不依赖原生条码库 - [Qrcode 二维码](https://sinleui.pages.dev/components/sn-qrcode.md): 纯 Canvas 自绘的二维码组件，不依赖任何原生二维码库，跨平台可用 - [Scan 扫码](https://sinleui.pages.dev/components/sn-scan.md): 基于 `sn-e-scan-provider` 扩展插件重构的一体化扫码组件，内置完整扫码界面，支持二维码 / 条码识别 - [Scankit 华为扫码](https://sinleui.pages.dev/components/sn-e-scankit.md): 基于华为统一扫码服务（Scan Kit）封装的扩展插件，当前仅支持 Android 平台 - [Blurview 高斯模糊](https://sinleui.pages.dev/components/sn-e-blurview.md): 毛玻璃（高斯模糊）容器，对组件背后的内容进行模糊处理 - [Gesture 手势](https://sinleui.pages.dev/components/sn-gesture.md): SinleUI 手势库组件，基于 AlloyFinger 实现，Web 与 Android 均可用 - [Markdown 富文本](https://sinleui.pages.dev/components/sn-e-markdown.md): Markdown 渲染组件，Web 端与 Android 端使用各自的解析与渲染引擎 - [Scan Provider 扫码核心](https://sinleui.pages.dev/components/sn-e-scan-provider.md): SinleUI 扫码插件的核心模块，基于 CameraX + ML Kit 实现摄像头预览与扫码解析，仅支持 Android 平台 ## Utils 工具库 - [SnUI 工具库](https://sinleui.pages.dev/libs/utils/index.md): `snu` 是 SinleUI 提供的工具库聚合门面（facade） ## Color 颜色库 - [ColorLib 颜色库](https://sinleui.pages.dev/libs/color/index.md): 颜色库是 SinleUI 内置的一套轻量级颜色处理工具，基于 TinyColor 思路实现，提供颜色的解析、计算、格式转换、变换与配色方案生成等能力，并附带… - [TinyColor 颜色实例](https://sinleui.pages.dev/libs/color/TinyColor.md): `TinyColor` 是颜色库中对单个颜色的实例化封装，用于颜色的解析、计算与变换。构造后可读取 r/g/b/a 等通道，并调用方法获取指定格式或完成颜色运算 - [LColorOptions](https://sinleui.pages.dev/libs/color/types.md): `TinyColor` 构造函数与 `ColorLib.tinyColor()` 方法可接收的选项对象，用于指定颜色格式与渐变类型 ## Date 日期库 - [日期库 Date](https://sinleui.pages.dev/libs/date/index.md): SinleUI 内置的日期/时间处理库，基于 uni-app x 原生能力构建，提供日期解析、格式化、加减、区间计算、相对时间、国际化等能力。整个库分为三层 - [日期库 Dayuts](https://sinleui.pages.dev/libs/date/Dayuts.md): `Dayuts` 是 SinleUI 日期库的核心实例类，封装了日期解析、格式化、读取/设置、加减运算、区间计算、相对时间、类型转换与本地化等全部能力 - [format 格式模板说明](https://sinleui.pages.dev/libs/date/format.md): `Dayuts.format(formatStr)` 通过格式模板将日期渲染为字符串 - [日期库 dayutsIntl](https://sinleui.pages.dev/libs/date/intl.md): `dayutsIntl` 是日期库的国际化管理器，负责语言包的注册与全局默认语言的切换 - [日期库 类型定义](https://sinleui.pages.dev/libs/date/types.md): 本篇列出日期库导出的全部类型定义。类型从 `@/uni_modules/sinle-ui` 导入 ## Store 状态管理库 - [Store 状态管理库](https://sinleui.pages.dev/libs/store/index.md): 一个轻量简洁的全局响应式状态管理库 - [Store 用法](https://sinleui.pages.dev/libs/store/usage.md): 本文档介绍 `StoreLib` 的典型使用场景与最佳实践 - [Store 过期策略](https://sinleui.pages.dev/libs/store/expire.md): Store 库内置数据过期机制，用于管理验证码、临时票据、限时缓存等带时效性的数据 ## Optional - [更新日志](https://sinleui.pages.dev/differences/changelog.md) - [API 新旧版本差异](https://sinleui.pages.dev/differences/api/index.md): SinleUI 2.0 对框架 API 做了结构性重构：旧版以 `$snui` 挂载 `configs / utils / store / libs`… - [配置体系差异](https://sinleui.pages.dev/differences/api/config.md): 旧版将全局配置收敛在 `$snui.configs` 下的六个子配置对象中（… - [类型体系差异](https://sinleui.pages.dev/differences/api/types.md): 字段整体保持不变，仅 新增 `shadow`（阴影色）字段 - [错误与日志体系差异](https://sinleui.pages.dev/differences/api/error.md): 旧版错误类型为 `SnError`（自定义类），2.0 起移除，统一遵循 uni 错误规范 使用运行时内置 `UniError` 对象 - [组件差异索引](https://sinleui.pages.dev/differences/components/index.md): SinleUI 2.0 各组件相对 1.x 版本的差异说明索引。各组件的完整用法请见组件文档 - [工具库（snu）差异](https://sinleui.pages.dev/differences/libs/utils.md) - [颜色库（Color）差异](https://sinleui.pages.dev/differences/libs/color.md): 方法名与主要行为保留，实现全部重写 - [日期库（Date）差异](https://sinleui.pages.dev/differences/libs/date.md): `isValid` / `isSame` / `isAfter` / `isBefore` / `isSameOrBefore` /… - [Store 状态管理库差异](https://sinleui.pages.dev/differences/libs/store.md): 旧版的 Store 状态管理库在 SinleUI 2.0 中以 新实现回归（此前曾随 2.0 重构整体移除）