如何编辑屏幕

已经有屏幕了？用 screen.edit() 以自然语言对它进行迭代。SDK 会负责工具调用，返回一个新的 Screen 对象，并保持原屏幕不变。

找到要编辑的屏幕

首先，从已有的项目中取一个屏幕：

import { stitch } from "@google/stitch-sdk";

const projects = await stitch.projects();
const project = projects.at(0);
const screens = await project.screens();
const screen = screens.at(0);

console.log(`Editing screen ${screen.id} in project ${project.id}`);

编辑它

向 screen.edit() 传入一条自然语言指令：

const edited = await screen.edit("Change the color scheme to dark mode");

这会返回一个新的 Screen 对象，原来的 screen 保持不变。

生成可能需要长达一分钟。超时后不要重试——服务器仍在工作。

对比结果

const originalHtml = await screen.getHtml();
const editedHtml = await edited.getHtml();

console.log(`Original: ${originalHtml}`);
console.log(`Edited:   ${editedHtml}`);

指定设备类型或模型

如果需要特定的目标设备或模型，把它们作为可选参数传入：

const edited = await screen.edit(
  "Add a bottom navigation bar",
  "MOBILE",          // deviceType
  "GEMINI_3_PRO"     // modelId
);

查看参考文档，了解所有可用的 deviceType 和 modelId 取值。