构建 Plumbi：与 Reddit Devvit 一起玩的有趣益智游戏
您是否曾想过在 Reddit 中发挥您的创造力？借助 Reddit 的 **Devvit 框架**，您可以直接在平台内为用户构建交互式体验。在这篇博客中，我将分享我如何创建 Plumbi，这是一款简单但令人上瘾的益智游戏，玩家可以连接管道部件让水流动。
Plumbi 将解谜的乐趣与 Reddit 的社区驱动生态系统相结合，使用 Devvit 和 Redis 进行数据存储，提供无缝的游戏体验。
Plumbi 是什么？
Plumbi 是一款基于关卡的益智游戏，用户必须旋转并对齐网格上的管道部件以创建连续的水路。
该游戏会跟踪进度、得分和完成时间，让用户在排行榜上相互竞争。它轻量级、易于使用，并且旨在直接集成到 Reddit 帖子和评论中。
点击这里玩游戏 Plumbi 游戏
为什么选择 Devvit？
Reddit 的 Devvit 框架允许开发人员创建在 Reddit 平台内无缝运行的应用程序和交互式面板。对于 Plumbi，Devvit 提供了：
**面板支持**：创建游戏界面。
用户交互：处理诸如旋转管件之类的输入。
**无缝集成**：使游戏在 Reddit 帖子中可用，让用户无需离开平台即可参与。
我如何建造 Plumbi
**1. 设置 Devvit 环境**
为了开始使用 Devvit，我按照官方文档设置了我的开发环境：
安装了 Devvit CLI。
`npm install -g devvit`
2.游戏逻辑
Plumbi 的核心是管理管道网格。下面是我实现它的方法：
**网格表示：**游戏网格是一个二维数组，其中每个单元格代表一个管道件，具有类型（直、弯）和方向等属性。
`const [gameBoard，setGameBoard] = useState(() => {
返回初始化GameBoard（currentLevelIndex）；
});`
**管道旋转**：每根管道可以以 90 度为增量旋转。单击某根管道即可触发旋转功能：
`
导出函数 rotatePipe（pipeType：EmptyPipe）：EmptyPipe {
开关（管道类型）{
案例EmptyPipe ['═']：
返回 EmptyPipe['║'];
案例EmptyPipe ['║']：
返回EmptyPipe['═'];
案例EmptyPipe ['╔']：
返回 EmptyPipe['╗'];
案例EmptyPipe ['╗']：
返回 EmptyPipe['╝'];
案例EmptyPipe ['╚']：
返回 EmptyPipe['╔'];
案例EmptyPipe ['╝']：
返回 EmptyPipe['╚'];
案例EmptyPipe ['╠']：
返回 EmptyPipe['╦'];
案例EmptyPipe ['╣']：
返回 EmptyPipe['╩'];
案例EmptyPipe ['╦']：
返回 EmptyPipe['╣'];
案例EmptyPipe ['╩']：
返回 EmptyPipe['╠'];
默认：
返回管道类型；//对于不旋转的管道（如'╬'）
}
}
`
**路径验证**：一个简单的遍历算法检查水是否可以从起点流到终点。
`
const checkForPath = (map: string[], x: number, y: number, direction: string, visited: boolean[][]): boolean => {
如果 (y < 0 || y >= map.length || x < 0 || x >= map[y].length) 返回 false;
如果 (visited[y][x]) 返回 false ;
访问过[y][x] = true;
const char = map[y][x];
if (char === 'S' || char === 'F') return true;
if (char in DirectionPipe) {
if (char === direction) {
return checkForPath(map, x + (direction === '═' ? 1 : 0), y + (direction === '║' ? 1 : 0), direction, visited);
}
return false;
}
return false;
};`**3. 使用 Redis 存储游戏状态**
为了管理玩家数据、级别和排行榜，我使用了 Redis，因为它速度快、简单易用：
**玩家进度**：存储每个玩家的当前级别和游戏状态。
**排行榜**：使用 Redis 排序集根据完成时间对玩家进行排名。
`异步函数 awardPoints（上下文：Devvit.Context，用户名：字符串，levelIndex：数字）{
const pointsForLevel = (levelIndex + 1) * 10; // 级别越高，奖励越多积分
等待 context.redis.zIncrBy（'leaderboard'，用户名，pointsForLevel）;
返回 pointsForLevel；
}`
`
结论
使用 Reddit Devvit 构建 Plumbi 是一次有益的经历，结合了创造力和技术挑战。通过利用 Devvit 的功能和 Redis 的速度，我能够为 Reddit 用户创建一款引人入胜的游戏。
如果您是一名开发人员，希望将自己的想法带到 Reddit，请尝试一下 Devvit——它是一个构建社区驱动应用程序的绝佳平台！