本文同步发表于我的微信公众号，微信搜索程语新视界即可关注，每个工作日都有文章更新
DevEco Studio 内置的AI编程辅助工具（一）
DevEco Studio 内置的AI编程辅助工具（二）
一、页面生成
1.1 使用方式
1.1.1 访问入口
两种访问方式：
输入框下拉菜单：在输入框左下角下拉框选择"Generate UI Code"
命令触发：在输入框输入"/"调出命令面板，选择"Generate UI Code"
1.1.2 输入方式
支持三种输入方式：
自由输入：手动输入页面主题和具体需求
快捷模板：使用预设的模板快速生成
图片参考：上传页面参考图片，AI解析生成对应代码
当前支持五大垂直领域：美食、旅游、购物、新闻、教育。
1.2.1 标签辅助
支持勾选：
行业领域标签
常用功能标签
1.2.2 多轮对话
持续优化：通过多轮对话新增或修改页面内容
关键字修改：可修改页面中的具体关键字信息
历史回溯：点击历史对话中的"回到本次"可回退到之前的页面状态
1.3 保存流程
1.3.1 保存设置
点击"Save to Project"后弹出设置窗口：
页面名称：设置生成的页面名称
模块指定：指定页面保存的目标模块
1.3.2 文件状态标识
保存时文件状态通过颜色标识：
绿色文件：新增文件
蓝色文件：已有文件但有更改
1.3.3 完成步骤
点击"Next"将代码和资源保存到工程
点击"Finish"完成添加
二、卡片生成
2.1 使用约束
2.1.1 需求描述维度建议
| 序号 | 描述维度 | 说明 | 举例 |
|---|---|---|---|
| 1 | 卡片用途 | 卡片的业务场景和用途 | "电商购物卡片"、"娱乐类卡片" |
| 2 | 卡片功能 | 包含的组件及其状态 | "新品上市主标题"、"商品搜索按钮" |
| 3 | 卡片尺寸 | 可选尺寸：1*2、2*2、2*4、4*4 | "2*2尺寸卡片"、"中卡片" |
注意：卡片尺寸为非必选项，AI会根据需求智能选择最佳尺寸。
2.1.2 限制说明
不支持在生成预览图后继续进行增量修改
2.2 使用流程
2.2.1 访问方式
两种访问方式：
命令触发：输入"/"后选择"Service Widget"
下拉菜单：在输入框左下角下拉框选择"Service Widget"
版本兼容性：
DevEco Studio 6.0.0 Beta1之前版本：在对话区域下拉框中选择"Service Widget"
2.2.2 交互过程
多轮交互：根据AI提示不断完善需求
生成数量：每次生成1-3张卡片
预览效果：生成卡片预览效果图
2.3 卡片保存
2.3.1 查看选项
点击查看图标可查看：
卡片UI代码
配置信息
静态资源文件
2.3.2 保存方式
方式一：手动保存
复制：复制代码到剪贴板
插入：插入到当前文件
创建文件：创建新文件保存
方式二：自动保存
点击"保存工程"按钮
自动保存以下内容到工程对应目录：
卡片代码
配置信息
静态资源文件
默认勾选：保存逻辑代码（用于配置卡片事件和数据）
2.4 逻辑代码配置
2.4.1 逻辑代码功能（包含两类）:
卡片数据交互：触发卡片页面刷新
应用工程：支持数据库或网络请求方式
元服务工程：仅支持网络请求方式
卡片事件：
router事件：跳转到指定UIAbility
call事件：拉起UIAbility到后台
message事件：刷新卡片内容
2.4.2 目录结构
module > src > main > ets └── formcommon # 卡片逻辑代码目录 ├── formsetting # 用户可配置文件 │ ├── formdbsetting # 数据库刷新方式配置 │ │ ├── formdbinfo # 卡片信息文件 │ │ └── UserSettings.ets # 数据规则配置 │ ├── formhttpsetting # 网络请求刷新方式配置 │ │ ├── formhttpinfo # URL信息文件 │ │ └── UserSettings.ets # 请求规则配置 │ └── FormAction.ets # 卡片事件配置 └── utils # 工具类目录（用户不可修改）2.4.3 说明
网络请求方式：需要在EntryFormAbility.ets中注释FormDbUpdate接口，启用FormHttpUpdate接口
工具目录：utils目录用户不可修改，再次生成时会刷新
2.5 自定义配置
2.5.1 卡片事件配置
FormAction.ets：配置卡片router事件的具体页面分发规则
EntryAbility.ets：在onWindowStageCreate方法中插入页面分发接口调用
接口位置调整：
默认插入到方法开头
可根据工程逻辑移动至合适位置
确保页面能正常跳转
