https://github.com/IIs-fanta/ComfyUI-SnakeGameNode
用ComfyUI玩贪吃蛇的节点
https://github.com/IIs-fanta/ComfyUI-SnakeGameNode
Last synced: about 2 months ago
JSON representation
用ComfyUI玩贪吃蛇的节点
- Host: GitHub
- URL: https://github.com/IIs-fanta/ComfyUI-SnakeGameNode
- Owner: IIs-fanta
- License: gpl-3.0
- Created: 2025-05-08T09:09:38.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2025-05-08T09:16:46.000Z (about 2 months ago)
- Last Synced: 2025-05-08T10:26:08.399Z (about 2 months ago)
- Language: JavaScript
- Size: 27.3 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-comfyui - **ComfyUI-SnakeGameNode** - tier Snake game node developed for ComfyUI. It lets you play a mini Snake game within the ComfyUI workflow, so you won’t get bored while waiting for image generation (or slacking off at work). Playing is not allowed by Han Cheng. (All Workflows Sorted by GitHub Stars)
README
# ComfyUI 贪吃蛇游戏节点
这是一个为 ComfyUI 开发的顶级贪吃蛇游戏节点。在 ComfyUI 工作流中添加一个可以玩贪吃蛇的小游戏,让你在等待图片生成(上班摸鱼)的过程中不会感到无聊。
韩铖不允许玩## 功能特点
- 经典的贪吃蛇游戏玩法
- 支持键盘方向键控制
- 支持鼠标点击方向按钮控制
- 实时显示得分
- 游戏速度随得分提升
- 支持一键重启游戏## 安装方法
1. 进入 ComfyUI 的 `custom_nodes` 目录
2. 克隆或下载本仓库到该目录
3. 重启 ComfyUI```bash
cd custom_nodes
git clone [repository_url] ComfyUI-SnakeGameNode
```## 使用方法
1. 启动 ComfyUI
2. 在节点菜单中找到 "fun" 分类
3. 添加 "Play Snake Game" 节点到画布
4. 点击 "Start/Restart Game" 按钮开始游戏## 游戏控制
- **键盘控制**:
- ↑ (上箭头):向上移动
- ↓ (下箭头):向下移动
- ← (左箭头):向左移动
- → (右箭头):向右移动
- 空格键:重启游戏- **鼠标控制**:
- 点击方向按钮控制移动方向
- 点击 "Start/Restart Game" 按钮重启游戏## 游戏规则
1. 控制蛇吃到红色食物可以增加长度和得分
2. 每得 5 分,游戏速度会提升一次
3. 撞到墙壁或自己会导致游戏结束
4. 游戏结束后自动重置,或手动点击重启按钮开始新游戏## 注意事项
- 游戏节点可以同时添加多个,每个都是独立的游戏实例
- 关闭或删除节点时会自动清理游戏资源
- 建议将节点放在工作流的空闲位置,避免遮挡其他重要节点## 更新日志
### v1.0.0
- 初始版本发布
- 实现基础贪吃蛇游戏功能
- 添加键盘和按钮双重控制方式### v1.0.1
2025-5-9 更新内容
### 1. 画布自适应
- 游戏画布(canvas)宽度自适应父容器,支持不同分辨率和窗口大小。
- 保持画布宽高比为 14:9,视觉效果更佳。### 2. 游戏内容自适应
- 游戏格子数固定,单格像素动态计算,确保蛇和食物在任意尺寸下都能正常显示。
- 解决了因画布像素宽高为0导致黑屏的问题。### 3. 事件与性能优化
- 修复了窗口缩放时游戏内容不刷新或消失的问题。
- 优化了事件绑定与解绑,避免多次绑定导致的异常。
- 重置游戏时速度等参数恢复初始值,避免多次重启后速度异常。### 4. 其它
- 代码结构优化,便于后续维护和扩展。## 2025-5-9节点框自适应优化说明
### 问题描述
遇到的问题是节点框(即游戏区域的外部容器)显示异常,不能自适应内容宽高。
原本 `gameContainer` 设置了固定高度 280px,canvas 也是固定宽高,这样在不同分辨率或缩放下容易出现显示不协调。### 具体优化方法
- 去掉 gameContainer 的固定高度:删除 `gameContainer.style.height = "280px";` 这一行。
- 让 canvas 宽度自适应父容器:把 canvas 的 `width="280"` 和 `height="180"` 改为用 CSS 控制宽度100%,高度用 `aspect-ratio` 保持比例(如 14:9),并设置最大宽度。
- 优化样式:用 flex 或 margin 让内容居中。### 优化效果
- 外部容器高度自适应内容。
- canvas 宽度自适应父容器,最大宽度420px,始终保持 14:9 比例。
- 其它内容自动居中,整体更美观。---
如有问题请联系或提交 issue。