用途
该技能用于初始化基于 uView 2.x 规范的设计系统,具体工作是设置全局调色板,并在 .pen 文件中创建初始组件库框架。
使用约束:仅当用户明确提及“Pencil”和“uView”(2.x,而非 uView Pro),或在编排 Pencil 设计系统初始化任务时,才使用本技能。
工作方式
该技能输出一个 PENCIL_PLAN。随后 Agent 按顺序调用 Pencil MCP 工具:open_document、set_variables、batch_design,并可选调用 get_screenshot。
步骤一:初始化变量(set_variables)
使用 mcp__pencil__set_variables 注册 uView 2.x 设计令牌,遵循 .pen 文件 schema。
主要 / 语义色:
- u-type-primary: #3c9cff
- u-type-success: #5ac725
- u-type-warning: #f9ae3d
- u-type-error: #f56c6c
- u-type-info: #909399
文字与边框:
- u-main-color: #303133
- u-content-color: #606266
- u-tips-color: #909399
- u-border-color: #e4e7ed
- u-radius: 4px
字体:
- u-font-size-base: 14px (28rpx)
如需更多令牌,从 uView 2.x 文档补充。
步骤二:创建组件概览结构(batch_design)
使用 mcp__pencil__batch_design 创建一个“Components Overview”框架,其分区基于 uView 2.x 文档:
基础(Basic):Icon、Button、Layout、Cell、Badge、Tag
表单(Form):Form、Input、Textarea、Radio、Checkbox、Switch、Rate、Upload、Picker、Select、DatetimePicker、Search、NumberBox、CodeInput
数据(Data):Table、List、Calendar、CountDown、CountTo、Progress、CircleProgress
反馈(Feedback):ActionSheet、Modal、Toast、Notify、SwipeAction、Collapse、Popup
布局(Layout):Grid、Divider、Sticky、IndexList、Swiper、Waterfall
导航(Navigation):Navbar、Tabbar、Tabs、BackTop、Link、Section
使用 Auto Layout 组织框架。每次 batch_design 调用最多 25 个操作。
最佳实践
- 对照 uView 2.x 文档核验令牌取值(与 uView Pro 区分)。
- 使用 set_variables 时,除非请求完全重置,否则 replace: false。
- 组件概览框架使用 Auto Layout。
关键词
pencil, uview, uview 2, design system, init, variables, components
参考资料
- references/contract.md – 设计令牌与组件命名。
- references/official.md – 官方文档链接。
- references/examples.md – 示例 PENCIL_PLAN。
- references/components.md – 组件规范。
限制
该技能面向 Pencil 设计系统初始化,依赖 Pencil MCP 工具链。关于具体的安装命令、价格、平台支持范围等,资料中暂未提供。