Interactive Drawing MCP

交互式绘图 MCP

本项目是一个带有交互式绘图界面的 Model Context Protocol（MCP）服务示例。它展示了如何构建包含独立绘图窗口的 MCP 扩展，并使用 Tkinter 作为图形界面。

功能

• 绘图网格界面：

  • 提供一个 16x16 网格，每个单元格可在两种状态（填充或空白）之间切换。
  • 提供清空网格按钮，可重置所有单元格。

• 服务功能：

  • 启动绘图会话：初始化新会话并启动 UI。
  • 切换单元格：通过命令界面切换各个单元格的颜色。
  • 获取网格状态：以文本形式获取当前网格配置。

• 持久化：网格状态会保存到 JSON 文件（board_state.json），以便在不同会话之间保持一致。

• UI 与状态同步：

  • 实时 UI 更新：后台线程持续监视网格状态文件的更新，并以可视化方式反映变化。

安装

选项 1：从源代码安装

1. 克隆此仓库：

   git clone https://github.com/AaronGoldsmith/interactive_draw_mcp
   cd interactive_draw_mcp
   

2. 安装此软件包：

   pip install -e .
   

使用方法

作为独立 MCP 服务

运行服务以打开绘图窗口：

interactive-draw-mcp

与 Goose 搭配使用

选项 1：使用 Goose CLI（推荐）

启用扩展并启动 Goose：

# Local Development
goose session --with-extension "python -m interactive-draw-mcp"

工具

• 服务工具：
  • start_drawing_session()：初始化绘图会话并打开 UI。
  • toggle_cell_color(row, col)：切换指定 row 和 col 处单元格的颜色。
  • get_grid_state()：以字符串形式提供网格的当前状态。

资源和参考资料

• 灵感来源：此 MCP 的灵感来自 Kvadratni/tik-tak-toe-mcp。

架构概述

本项目的架构展示了：

1. MCP 服务：通过定义明确的工具，管理 Goose AI 与绘图界面之间的通信。
2. 交互式 UI：提供网格的可视化界面。
3. 与 Goose AI 集成：来自 Goose AI 的工具调用会直接反映在网格状态上，反之亦然。

优势

• 职责分离：清晰区分服务逻辑和 UI 展示。
• 提升用户体验：在基于文本的命令界面之外，提供直观的视觉反馈。
• 适应性：可扩展到涉及 AI 和交互式 UI 的更复杂应用。