From 26ecd689c4b5c69c9916b66d3507098204621632 Mon Sep 17 00:00:00 2001 From: flykhan Date: Tue, 14 Feb 2023 18:36:01 +0800 Subject: [PATCH] =?UTF-8?q?=E7=BB=98=E5=88=B6=E8=9B=87=E7=9C=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/src/assets/scripts/Snake.js | 40 +++++++++++++++++++++++++++++++++ 1 file changed, 40 insertions(+) diff --git a/web/src/assets/scripts/Snake.js b/web/src/assets/scripts/Snake.js index b2a7a0f..0dbf7f5 100644 --- a/web/src/assets/scripts/Snake.js +++ b/web/src/assets/scripts/Snake.js @@ -37,6 +37,27 @@ export class Snake extends AcGameObject { // 定义允许的误差: 0.01 ,当误差为 0.01 以内时,就认为两个点已经重合 this.eps = 1e-2; + + // 蛇头的眼睛方向:(默认)左下角蛇初始方向朝上 + this.eye_direction = 0; + // 右上角蛇初始方向朝下 + if (this.id === 1) this.eye_direction = 2; + // 蛇眼睛四方向x偏移量 + this.eye_dx = [ + [-1, 1], + [1, 1], + [1, -1], + [-1, -1], + ]; + + // 蛇眼睛四方向y偏移量 + this.eye_dy = [ + [-1, -1], + [-1, 1], + [1, 1], + [1, -1], + ]; + } start() { @@ -65,6 +86,9 @@ export class Snake extends AcGameObject { // 下一节蛇身体的坐标计算 this.next_cell = new Cell(this.cells[0].r + this.dr[d], this.cells[0].c + this.dc[d]); + // 更新蛇眼睛的方向:就是下一步的蛇头方向 + this.eye_direction = d; + // 计算完坐标之后,清空方向 this.direction = -1; // 将状态从静止变为移动 @@ -192,5 +216,21 @@ export class Snake extends AcGameObject { ctx.fillRect(Math.min(a.x, b.x) * L, (a.y - snake_node_width / 2) * L, Math.abs(a.x - b.x) * L, L * snake_node_width); } } + + // 绘制蛇眼睛 + // 定义眼睛颜色 + ctx.fillStyle = "#fbff00"; + // 定义蛇眼睛大小 + const snake_eye_size = 0.07 * L; + // 画眼睛 + for (let i = 0; i < 2; i ++) { + // 眼睛的横纵坐标(乘以 L 是绝对距离) + const eye_x = (this.cells[0].x + this.eye_dx[this.eye_direction][i] * 0.15) * L; + const eye_y = (this.cells[0].y + this.eye_dy[this.eye_direction][i] * 0.15) * L; + + ctx.beginPath() + ctx.arc(eye_x, eye_y, snake_eye_size, 0, 2 * Math.PI); + ctx.fill(); + } } } \ No newline at end of file