Dev View 简介

Dev View 目前处于 Beta 测试阶段 — 界面和可用功能可能会发生变化，某些功能需要符合条件的计划。

什么是 Dev View？

Dev View 是 ProtoPie Cloud 中的一个视图，开发人员可以在其中检查原型的设计和交互细节，并通过 Code MCP 将这些上下文传递给 AI 编码代理。打开确切的原型，读取其结构和属性，并复制一个链接，为代理提供精确的规范。有关完整工作流程，请参阅上面的 Code MCP 部分。

打开 Dev View

在 ProtoPie Cloud 中，通过将鼠标悬停在 Pie 上并单击 < > Dev View，从 Pie 的上下文菜单或 Preview 顶部菜单中选择 Open Dev View，或者粘贴 Dev View URL 来打开它。Dev View 始终显示 Pie 的最新版本。

要求和访问权限

• 查看功能需要 Pro、Pro Plus 或 Enterprise 计划（个人或团队空间）。在 Free/Basic（免费/基础版）上，< > Dev View 按钮可见但处于锁定状态。

• MCP 链接有单独的门槛 — 仅当您对 Pie 拥有下载权限时才会出现。请参阅上文的 访问与权限。

Dev View 界面

选择场景、容器或图层会更新每个面板。

• 图层面板（左侧） — Pie 的图层层级结构，与 Studio 中相同。

• 画布（中间） — 所选场景的预览；悬停以查看间距/距离，缩放以检查元素。

• 检查器 — 属性（右侧） — 设计细节：布局、填充（HEX/RGB/HSL）和文本样式。

• 交互 — 属性（右侧） — 触发器 → 响应树，显示顺序、延迟、并行计时和隐藏交互。

• MCP 选项卡 — 复制所选内容的上下文链接并打开设置指南。

MCP 选项卡

不选择任何内容（视作整个 Pie）、选择场景、组件或图层，然后点击 Copy link（复制链接）— 它会固定您正在查看的版本。如果没有下载权限，该链接将被隐藏（“MCP 链接需要 Pro 或 Enterprise 计划以及下载权限。请咨询 Pie 所有者。”）。有关完整流程，请参阅上文的 快速入门。

分享

使用顶部栏中的 Copy Link 共享直接打开 Dev View 的链接。预览和 Dev View 链接是分开的。

想在演示中查看 ProtoPie MCP 吗？立即预订您的演示课程！