Rive MCP

官方

Rive MCP 让 AI 处理重复性任务,例如创建复杂的视图模型、包含数百个状态/层的状态机、布局、形状等。

你可以用 Rive MCP 做什么?

  • 管理 Rive 文件 — 在打开的 Rive 文件中添加、重命名、调整大小、排列和聚焦画板。
  • 编辑场景 — 查询层级结构、选择对象、更新属性、重命名、复制、重新排序、重新设置父级或删除元素。
  • 构建设计 — 创建形状、路径、布局、组件实例、组件列表和基于资源的元素。
  • 使用骨骼绑定 — 按长度和旋转角度或头尾点创建根骨骼和骨骼链,然后绑定并设置权重。
  • 制作动画并添加交互 — 编辑线性动画、状态机、状态、过渡、条件、关键帧和插值。
  • 使用数据绑定 — 创建视图模型、属性、实例、绑定和自定义属性组。

文档

Rive MCP 集成

[!NOTE]

MCP 集成目前仅适用于 Windows 和 macOS 上的桌面版 Editor。

你可以通过 MCP(Model Context Protocol)将 Rive Editor 连接到 AI 工具。首批工具旨在让 AI 处理重复性任务,例如创建复杂的 View Models、包含数百个状态/图层的 State Machines、Layouts、Shapes 等。

YouTube 视频播放器

支持的功能

  • 创建和管理 Rive 文件 — 添加、重命名、调整大小、排列和聚焦 artboards。
  • 检查和编辑场景 — 查询层级结构、选择对象、更新属性、重命名、复制、重新排序、重新设置父级或删除元素。
  • 构建设计 — 创建形状、路径、布局、组件实例、组件列表和基于资源的元素。
  • 使用骨骼绑定 — 创建根骨骼和骨骼链,可按长度和旋转创建,也可通过头部和尾部点创建,然后进行绑定和权重设置。
  • 创建动画和交互 — 编辑线性动画、状态机、状态、过渡、条件、关键帧和插值。
  • 使用数据绑定 — 创建视图模型、属性、实例、绑定和自定义属性组。
  • 编辑脚本和着色器 — 管理 Luau 脚本和 WGSL 着色器、更新源代码、运行诊断、重新编译、测试、搜索代码和读取控制台输出。

[!NOTE]

随着更多工具的加入,功能列表也会不断更新。

如果某些编辑会导致运行时拒绝打开文件或崩溃,例如在一个填充上设置两种颜色,或在填充或描边之外设置渐变,这些编辑会被拒绝并撤销。颜色的读取方式与十六进制字段相同:#fff 表示白色,而像 red 这样的名称会被拒绝。

安装

使用 Cursor

1. 打开 Rive

安装并打开适用于 Mac 或 Windows 的最新版 Rive 桌面应用。

2. 设置 Cursor

创建 Cursor 账户并安装应用。

3. 打开 Cursor 设置

打开 Cursor,然后前往右上角的设置面板。

Open cursor settings

4. 添加自定义 MCP

打开 Tools & MCPs 选项卡,然后点击 Add Custom MCP。

Open Cursor MCPs tab

5. 保存配置

将以下 JSON 代码片段保存到电脑,文件名为 mcp.json。

{
  "mcpServers": {
      "rive": {
          "url": "http://127.0.0.1:9791/mcp"
      }
  }
}

6. 启用连接

开启 MCP 连接 On

7. 验证连接

如果安装正确,你应该会看到 Rive 是一个可用的 MCP 服务器。

Cursor verified

[!NOTE]

要使用 Rive 服务器,必须保持 Rive 桌面应用处于打开状态。

有关设置 MCP 的更多信息,请参阅此处。

在终端中使用 Claude

YouTube 视频播放器

1. 打开 Rive

安装并打开适用于 macOS 或 Windows 的最新版 Rive 桌面应用。

2. 添加 MCP 服务器

在终端中运行以下命令:

claude mcp add --transport http rive http://127.0.0.1:9791/mcp

3. 启动 Claude

运行 Claude 并按照提示操作:

claude

它能做什么?

连接 AI 工具后,就可以开始向 AI 输入提示了。

1. 打开 Rive 文件

打开一个 Rive 文件,并创建一个 Artboard。

2. 输入提示

在聊天界面中输入提示,然后按 Enter。AI 会花一些时间处理请求,随后所做的更改会显示在打开的 Rive 文件中。

提示示例:

Create a State Machine about birds with 20 states and 2 layers