Browse Source

日常开发

林旭祥 1 month ago
parent
commit
b59c5ca112
1 changed files with 105 additions and 103 deletions
  1. 105 103
      src/views/game/football.vue

+ 105 - 103
src/views/game/football.vue

@@ -370,8 +370,8 @@ class GameScene extends Phaser.Scene {
         // 垂直移动(限制范围)
         this.player.y = Phaser.Math.Clamp(
           pointer.y,
-          GAME_HEIGHT * 0.6, // 最小Y值
-          GAME_HEIGHT - this.player.height - 30 // 最大Y值
+          0, // 最小Y值
+          GAME_HEIGHT// 最大Y值
         );
       }
     });
@@ -701,100 +701,100 @@ class GameScene extends Phaser.Scene {
     this.input.on('pointerdown', this.shootBall, this);
   }
 
-shootBall() {
-  if (!this.isShooting) return;
+  shootBall() {
+    if (!this.isShooting) return;
 
-  // 禁用输入
-  this.input.keyboard.off('keydown-SPACE', this.shootBall, this);
-  this.input.off('pointerdown', this.shootBall, this);
+    // 禁用输入
+    this.input.keyboard.off('keydown-SPACE', this.shootBall, this);
+    this.input.off('pointerdown', this.shootBall, this);
 
-  if (this.shootHint) {
-    this.shootHint.destroy();
-    this.shootHint = null;
-  }
+    if (this.shootHint) {
+      this.shootHint.destroy();
+      this.shootHint = null;
+    }
 
-  // 计算龙门网内的目标位置
-  const goalNetY = this.goal.y + 30;
-  const goalNetX = this.player.x;
-
-  // 创建射门动画
-  const ballTween = this.tweens.add({
-    targets: this.ball,
-    x: goalNetX,
-    y: goalNetY,
-    duration: 1000,
-    ease: 'Power1',
-    onComplete: () => {
-      if (!this.ball || !this.ball.active) return;
-
-      // 判断是否成功
-      const isSuccess = Phaser.Math.Between(0, 1) === 1;
-      if (isSuccess) {
-        this.score += 3;
-        this.updateScore();
-        this.ball.setDepth(6.5); // 成功:足球在守门员后方(网内)
-        this.successShoot();
-      } else {
-        this.ball.setDepth(7.5); // 失败:足球在守门员前方
-        this.failShoot();
+    // 计算龙门网内的目标位置
+    const goalNetY = this.goal.y + 30;
+    const goalNetX = this.player.x;
+
+    // 创建射门动画
+    const ballTween = this.tweens.add({
+      targets: this.ball,
+      x: goalNetX,
+      y: goalNetY,
+      duration: 1000,
+      ease: 'Power1',
+      onComplete: () => {
+        if (!this.ball || !this.ball.active) return;
+
+        // 判断是否成功
+        const isSuccess = Phaser.Math.Between(0, 1) === 1;
+        if (isSuccess) {
+          this.score += 3;
+          this.updateScore();
+          this.ball.setDepth(6.5); // 成功:足球在守门员后方(网内)
+          this.successShoot();
+        } else {
+          this.ball.setDepth(7.5); // 失败:足球在守门员前方
+          this.failShoot();
+        }
+        ballTween.remove();
       }
-      ballTween.remove();
-    }
-  });
-}
+    });
+  }
   // 射门成功处理
-successShoot() {
-  this.isShooting = false;
-
-  // 显示成功提示
-  const successText = this.add.text(GAME_WIDTH / 2, GAME_HEIGHT / 2, '射门成功!+3分', {
-    fontSize: '24px',
-    fill: '#0f0',
-    stroke: '#000000',
-    strokeThickness: 2
-  }).setOrigin(0.5);
-  successText.setDepth(10);
-
-  // 2秒后返回奔跑场景
-  this.time.addEvent({
-    delay: 2000,
-    callback: () => {
-      if (successText && successText.active) {
-        successText.destroy();
-      }
-      this.ball.destroy();
-      this.resetToRunningScene();
-    },
-    callbackScope: this
-  });
-}
+  successShoot() {
+    this.isShooting = false;
+
+    // 显示成功提示
+    const successText = this.add.text(GAME_WIDTH / 2, GAME_HEIGHT / 2, '射门成功!+3分', {
+      fontSize: '24px',
+      fill: '#0f0',
+      stroke: '#000000',
+      strokeThickness: 2
+    }).setOrigin(0.5);
+    successText.setDepth(10);
+
+    // 2秒后返回奔跑场景
+    this.time.addEvent({
+      delay: 2000,
+      callback: () => {
+        if (successText && successText.active) {
+          successText.destroy();
+        }
+        this.ball.destroy();
+        this.resetToRunningScene();
+      },
+      callbackScope: this
+    });
+  }
 
   // 射门失败处理
-failShoot() {
-  this.isShooting = false;
-
-  // 显示失败提示
-  const failText = this.add.text(GAME_WIDTH / 2, GAME_HEIGHT / 2, '射门失败!', {
-    fontSize: '24px',
-    fill: '#f00',
-    stroke: '#000000',
-    strokeThickness: 2
-  }).setOrigin(0.5);
-  failText.setDepth(10);
-
-  // 2秒后返回奔跑场景
-  this.time.addEvent({
-    delay: 2000,
-    callback: () => {
-      if (failText && failText.active) {
-        failText.destroy();
-      }
-      this.ball.destroy();
-      this.resetToRunningScene();
-    },
-    callbackScope: this
-  });
-}
+  failShoot() {
+    this.isShooting = false;
+
+    // 显示失败提示
+    const failText = this.add.text(GAME_WIDTH / 2, GAME_HEIGHT / 2, '射门失败!', {
+      fontSize: '24px',
+      fill: '#f00',
+      stroke: '#000000',
+      strokeThickness: 2
+    }).setOrigin(0.5);
+    failText.setDepth(10);
+
+    // 2秒后返回奔跑场景
+    this.time.addEvent({
+      delay: 2000,
+      callback: () => {
+        if (failText && failText.active) {
+          failText.destroy();
+        }
+        this.ball.destroy();
+        this.resetToRunningScene();
+      },
+      callbackScope: this
+    });
+  }
 
   // 重置为奔跑场景
   resetToRunningScene() {
@@ -824,22 +824,22 @@ failShoot() {
     if (this.jerseyEvent) this.jerseyEvent.remove();
     if (this.broomEvent) this.broomEvent.remove();
 
-  // 彻底清理计时相关资源
-  if (this.timer) {
-    this.timer.destroy(); // 销毁计时器(比remove()更彻底)
-    this.timer = null; // 置空引用,防止残留
-  }
+    // 彻底清理计时相关资源
+    if (this.timer) {
+      this.timer.destroy(); // 销毁计时器(比remove()更彻底)
+      this.timer = null; // 置空引用,防止残留
+    }
 
     // 显示游戏结束画面
     this.add.image(GAME_WIDTH / 2, GAME_HEIGHT / 2, 'gameOver').setOrigin(0.5);
 
-  // 触发游戏结束事件
-  this.time.addEvent({
-    delay: 2000,
-    callback: () => {
-      this.game.events.emit('gameOver');
-    }
-  });
+    // 触发游戏结束事件
+    this.time.addEvent({
+      delay: 2000,
+      callback: () => {
+        this.game.events.emit('gameOver');
+      }
+    });
   }
 
   update() {
@@ -1074,6 +1074,7 @@ onUnmounted(() => {
   display: flex;
   justify-content: center;
   align-items: center;
+  font-size: 18px;
 }
 
 .rulebox {
@@ -1116,11 +1117,12 @@ onUnmounted(() => {
 .daoju_2,
 .daoju_3 {
   display: inline-block;
-  width: 30px;
-  height: 30px;
+  width: 60px;
+  height: 60px;
   margin-right: 10px;
   background-size: contain;
   background-repeat: no-repeat;
+  flex-shrink: 0;
 }
 
 .daoju_1 {