MasterGo AI 通过理解上下文自动生成语义合理、视觉协调、符合规范的按钮，而非孤立绘制原子级元素；它依据页面功能与交互逻辑，结合需求描述、全局参数、无障碍标准生成按钮，并支持自然语言微调及带交互逻辑的代码导出。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
MasterGo AI 不是单独“生成按钮”这种原子级元素，而是通过理解上下文，在完整界面生成过程中自动设计出语义合理、视觉协调、符合规范的按钮。它不孤立画一个按钮，而是根据你描述的页面功能和交互逻辑，把按钮作为系统的一部分自然呈现出来。
按钮设计由需求描述驱动
你不需要说“加一个蓝色圆角按钮”，而是描述行为和目的：
- “登录页包含邮箱输入框、密码输入框和‘立即登录’主按钮”
- “商品列表每项下方有‘加入购物车’操作按钮，右侧带徽标数字”
- “订单确认弹窗底部有两个按钮：‘取消’（文字款）和‘确认支付’（填充款，主色）”
AI 会据此判断按钮类型（主按钮/次按钮/文本按钮）、状态（默认/悬停/禁用）、尺寸层级、颜色语义（如红色表危险操作、绿色表成功动作），并自动匹配当前整体风格（圆角值、阴影、字体粗细等）。
按钮样式受全局参数控制
在 AI 生成界面时，你可以提前设定影响按钮外观的关键参数：
- 主题色：输入 #FA2549，所有主按钮背景自动使用该色，文字反白
- 明暗模式：选“深色系”，按钮文字和边框自动适配高对比度
- 设计风格：选“iOS”或“Material Design”，按钮圆角、内边距、动效默认对齐对应规范
- 无障碍要求：AI 默认输出满足 WCAG 2.1 AA 级对比度的按钮文字与背景组合
生成后可精准微调按钮
如果初稿中按钮位置、大小或文案不合适，直接用自然语言指令修改：
- “把‘提交’按钮宽度设为 200px，右对齐”
- “所有操作按钮文字统一改为 16px 加粗”
- “‘删除’按钮改成红色描边+透明背景，悬停时填充浅红”
- “给‘查看更多’按钮添加右箭头图标”
AI 会定位到所有同类按钮，批量更新，同时保持与其他组件的间距、对齐和视觉权重一致。
导出代码时按钮已带完整交互逻辑
点击「导出代码」后，按钮不只是静态 HTML：
- React/Vue 组件中，按钮已封装为可复用的
Button组件，支持type="primary"、loading、disabled等常用 props - HTML/CSS 版本中，按钮自带 hover/focus/active 伪类样式，且 class 命名语义化（如
btn btn--secondary） - 若描述中含交互（如“点击弹出筛选面板”），导出代码里已含事件绑定和基础 JS 逻辑
