SuperAPI AI 工具集

pattern-ui

设计与创作

查看项目

更新于 10-16 05:03

技能介绍

用途:pattern-ui 用于在界面逻辑验证完毕、测试通过之后,为 UI 添加打磨效果,包括布局与样式调整。资料明确要求仅在所有逻辑验证且测试通过后才进行此阶段。

主要能力:提供一组可用的 ct-* 界面组件,分为四类。布局类包括 ct-screen、ct-vstack、ct-hstack、ct-box;输入类包括 ct-input、ct-textarea、ct-checkbox、ct-select;操作类包括 ct-button;展示类包括 ct-text、ct-status-pill。

使用方式:需先阅读参考资料,包括 docs/common/components/COMPONENTS.md(完整组件参考)、docs/common/patterns/style.md(样式模式)、docs/common/patterns/two-way-binding.md($value、$checked 绑定)。双向绑定写法如 <ct-input $value={field} />、<ct-checkbox $checked={done} />。布局结构以 ct-screen 为外层并设置 title,内层用 ct-vstack 与 ct-hstack 组合,并通过 gap 属性控制间距。可参考已有模式,但资料限定只搜索 packages/patterns/ 中的 UI 布局示例,不参考数据或操作模式。

适用场景:为已具备正确逻辑的界面做视觉与布局层面的润色,绑定输入与状态,组织页面结构。

完成标准:UI 正确渲染;绑定生效,即输入能更新状态;数据行为无回归。

限制:资料未提供该技能的价格、收费、平台支持、性能效果或安装命令等信息,暂未提供。