feat(menu) 为选项都添加倒影效果

scenes/MenuScene.js

@@ -37,7 +37,7 @@ export default class MenuScene extends Phaser.Scene {
         // 添加菜单文本 - 使用多语言
         this.titleText = this.add.text(
             cam.centerX,  // 文本在x轴上的位置，相机中心
-            cam.centerY - this.unit * 8,  // 文本在y轴上的位置，相机中心上方
+            cam.centerY - this.unit * 12,  // 文本在y轴上的位置，相机中心上方
             LanguageManager.t('title'),
             { fontSize: this.unit * 2.4, color: '#ffffff', fontFamily: 'monospace'}
         ).setOrigin(0.5, 0.5);
@@ -59,7 +59,7 @@ export default class MenuScene extends Phaser.Scene {
         // 添加退出按钮文本 - 使用多语言
         this.exitText = this.add.text(
             cam.centerX,  // 文本在x轴上的位置，相机中心
-            cam.centerY + this.unit * 5,  // 文本在y轴上的位置，开始按钮下方
+            cam.centerY + this.unit * 10,  // 文本在y轴上的位置，开始按钮下方
             LanguageManager.t('exit'),
             { fontSize: this.unit * 2.4, color: '#ffffff', fontFamily: 'monospace'}
         ).setOrigin(0.5, 0.5);
@@ -89,7 +89,7 @@ export default class MenuScene extends Phaser.Scene {
         let currentLangIndex = languages.indexOf(LanguageManager.currentLanguage);
 
         // 按钮基础位置（在退出按钮下方）
-        const baseY = cam.centerY + this.unit * 11;
+        const baseY = cam.centerY + this.unit * 18;
 
         // 创建主按钮文本
         const toggleText = this.add.text(
@@ -105,9 +105,9 @@ export default class MenuScene extends Phaser.Scene {
         // 创建透明的点击区域（与文本大小匹配）
         const clickArea = this.add.rectangle(
             cam.centerX,
-            baseY + this.unit,
+            baseY + this.unit * 0.5,
             toggleText.width,
-            toggleText.height + this.unit * 2,
+            toggleText.height + this.unit,
             0x000000,
             0 // 完全透明
         ).setOrigin(0.5, 0.5);
@@ -128,17 +128,33 @@ export default class MenuScene extends Phaser.Scene {
 
             // 重新计算点击区域大小
             clickArea.width = toggleText.width + 20;
-            clickArea.height = toggleText.height + 40;
+            clickArea.height = toggleText.height + 20;
 
             // 直接更新菜单文本以显示新语言
             this.titleText.setText(LanguageManager.t('title'));
             this.startText.setText(LanguageManager.t('start'));
             this.exitText.setText(LanguageManager.t('exit'));
 
+            // 同步更新倒影文本
+            if (this.titleText.reflection) {
+                this.titleText.reflection.setText(LanguageManager.t('title'));
+            }
+            if (this.startText.reflection) {
+                this.startText.reflection.setText(LanguageManager.t('start'));
+            }
+            if (this.exitText.reflection) {
+                this.exitText.reflection.setText(LanguageManager.t('exit'));
+            }
+
             // 更新雨天控制按钮文本
             const rainText = LanguageManager.t('rain');
             const stateText = this.isRainEnabled ? LanguageManager.t('on') : LanguageManager.t('off');
             this.rainToggleText.setText(`${rainText} ${stateText}`);
+
+            // 同步更新雨天控制按钮的倒影文本
+            if (this.rainToggleText.reflection) {
+                this.rainToggleText.reflection.setText(`${rainText} ${stateText}`);
+            }
         });
     }
     
@@ -149,7 +165,7 @@ export default class MenuScene extends Phaser.Scene {
         const cam = this.cameras.main;
 
         // 按钮基础位置（在语言切换按钮下方）
-        const baseY = cam.centerY + this.unit * 17;
+        const baseY = cam.centerY + this.unit * 26;
 
         // 创建主按钮文本
         this.rainToggleText = this.add.text(
@@ -165,7 +181,7 @@ export default class MenuScene extends Phaser.Scene {
         // 创建透明的点击区域（与文本大小匹配）
         this.rainClickArea = this.add.rectangle(
             cam.centerX,
-            baseY,
+            baseY + this.unit * 0.5,
             this.rainToggleText.width + 40,
             this.rainToggleText.height + 20,
             0x000000,
@@ -191,6 +207,11 @@ export default class MenuScene extends Phaser.Scene {
         // 更新按钮文本
         this.rainToggleText.setText(this.isRainEnabled ? `${LanguageManager.t('rain')} ${LanguageManager.t('on')}` : `${LanguageManager.t('rain')} ${LanguageManager.t('off')}`);
 
+        // 同步更新倒影文本
+        if (this.rainToggleText.reflection) {
+            this.rainToggleText.reflection.setText(this.isRainEnabled ? `${LanguageManager.t('rain')} ${LanguageManager.t('on')}` : `${LanguageManager.t('rain')} ${LanguageManager.t('off')}`);
+        }
+
         // 控制雨滴和涟漪的显示/隐藏
         this.updateRainEffectVisibility();
         
@@ -517,7 +538,7 @@ export default class MenuScene extends Phaser.Scene {
         // 创建倒影文本
         const reflectionText = this.add.text(
             text.x,
-            text.y + text.height + this.unit * 0.5, // 倒影位置在主文本下方
+            text.y + text.height, // 倒影位置在主文本下方，间隔为0
             text.text,
             { fontSize: text.style.fontSize, color: '#ffffff', fontFamily: text.style.fontFamily}
         ).setOrigin(0.5, 0.5);
@@ -530,6 +551,9 @@ export default class MenuScene extends Phaser.Scene {
         this.textContainer.add(text);
         this.textContainer.add(reflectionText);
 
+        // 将倒影文本引用存储在主文本对象中，便于后续同步更新
+        text.reflection = reflectionText;
+
         // 添加动态波纹效果
         this.createRippleEffect(reflectionText);