|
|
@@ -1,4 +1,4 @@
|
|
|
-import { _decorator, Color, Component, Node, Sprite, find } from 'cc';
|
|
|
+import { _decorator, Color, Component, Node, Sprite, find, Vec3 } from 'cc';
|
|
|
import EventBus, { GameEvents } from '../Core/EventBus';
|
|
|
import { GameStartMove } from '../Animations/GameStartMove';
|
|
|
const { ccclass, property } = _decorator;
|
|
|
@@ -7,17 +7,26 @@ const { ccclass, property } = _decorator;
|
|
|
export class NavBarController extends Component {
|
|
|
@property({ type: [Node] }) panels: Node[] = []; // 依次给 Main、Shop、Upgrade、Skill
|
|
|
@property({ type: [Node] }) buttons: Node[] = []; // 依次给 Battle、Shop、Upgrade、Skill
|
|
|
+ @property({ type: [Node] }) buttonBorders: Node[] = []; // 按钮边框节点数组，需要手动配置
|
|
|
+
|
|
|
private normalColor = new Color(255, 255, 255, 255);
|
|
|
- private activeColor = new Color(255, 0, 0, 255); // 红色
|
|
|
private lockedColor = new Color(128, 128, 128, 255); // 灰色（锁定状态）
|
|
|
|
|
|
// 按钮锁定状态数组 - 对应 Battle、Shop、Upgrade、Skill 四个按钮
|
|
|
private buttonLockStates: boolean[] = [false, true, false, false]; // 默认只锁定Shop按钮
|
|
|
|
|
|
+ // 存储按钮原始位置
|
|
|
+ private buttonOriginalPositions: Vec3[] = [];
|
|
|
+
|
|
|
+ // 当前激活的按钮索引
|
|
|
+ private currentActiveButtonIndex: number = -1;
|
|
|
+
|
|
|
// GameStartMove组件引用，用于重置镜头位置
|
|
|
private gameStartMoveComponent: GameStartMove = null;
|
|
|
|
|
|
start () {
|
|
|
+ // 保存按钮原始位置
|
|
|
+ this.saveButtonOriginalPositions();
|
|
|
// 默认打开 MainUI
|
|
|
this.switchTo(0);
|
|
|
// 初始化按钮状态，设置shop按钮为锁定状态
|
|
|
@@ -50,6 +59,17 @@ export class NavBarController extends Component {
|
|
|
eventBus.off(GameEvents.RETURN_TO_MAIN_MENU, this.onReturnToMainMenu, this);
|
|
|
}
|
|
|
|
|
|
+ /**
|
|
|
+ * 保存按钮原始位置
|
|
|
+ */
|
|
|
+ private saveButtonOriginalPositions() {
|
|
|
+ this.buttonOriginalPositions = [];
|
|
|
+ this.buttons.forEach(btn => {
|
|
|
+ this.buttonOriginalPositions.push(btn.position.clone());
|
|
|
+ });
|
|
|
+ console.log('[NavBarController] 已保存按钮原始位置');
|
|
|
+ }
|
|
|
+
|
|
|
/**
|
|
|
* 处理返回主菜单事件
|
|
|
*/
|
|
|
@@ -149,39 +169,80 @@ export class NavBarController extends Component {
|
|
|
// 实际映射: Battle->Main(0), Shop->Upgrade(2), Upgrade->Shop(1), Skill->Skill(3)
|
|
|
const buttonToPanelMap = [0, 2, 1, 3]; // Battle->Main(0), Shop->Upgrade(2), Upgrade->Shop(1), Skill->Skill(3)
|
|
|
|
|
|
- // 设置按钮颜色，考虑锁定状态
|
|
|
+ // 重置所有按钮到原始位置和状态
|
|
|
this.buttons.forEach((btn, buttonIndex) => {
|
|
|
const sp = btn.getComponent(Sprite);
|
|
|
if (sp) {
|
|
|
- // 检查按钮是否被锁定
|
|
|
+ // 重置按钮位置到原始位置
|
|
|
+ if (this.buttonOriginalPositions[buttonIndex]) {
|
|
|
+ btn.position = this.buttonOriginalPositions[buttonIndex].clone();
|
|
|
+ }
|
|
|
+
|
|
|
+ // 设置按钮颜色（只处理锁定状态）
|
|
|
if (this.buttonLockStates[buttonIndex]) {
|
|
|
sp.color = this.lockedColor; // 锁定状态显示灰色
|
|
|
} else {
|
|
|
- // 检查当前按钮对应的面板是否是激活的面板
|
|
|
- const panelIndex = buttonToPanelMap[buttonIndex];
|
|
|
- sp.color = (panelIndex === index) ? this.activeColor : this.normalColor;
|
|
|
+ sp.color = this.normalColor; // 正常状态显示白色
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
+
|
|
|
+ // 隐藏所有边框
|
|
|
+ this.buttonBorders.forEach(border => {
|
|
|
+ if (border) {
|
|
|
+ border.active = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 找到当前激活的按钮索引
|
|
|
+ let activeButtonIndex = -1;
|
|
|
+ for (let buttonIndex = 0; buttonIndex < buttonToPanelMap.length; buttonIndex++) {
|
|
|
+ if (buttonToPanelMap[buttonIndex] === index) {
|
|
|
+ activeButtonIndex = buttonIndex;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 如果找到激活按钮且未被锁定，则应用激活效果
|
|
|
+ if (activeButtonIndex !== -1 && !this.buttonLockStates[activeButtonIndex]) {
|
|
|
+ const activeBtn = this.buttons[activeButtonIndex];
|
|
|
+ if (activeBtn && this.buttonOriginalPositions[activeButtonIndex]) {
|
|
|
+ // 向上移动20px
|
|
|
+ const newPos = this.buttonOriginalPositions[activeButtonIndex].clone();
|
|
|
+ newPos.y += 20;
|
|
|
+ activeBtn.position = newPos;
|
|
|
+
|
|
|
+ // 显示对应的边框
|
|
|
+ if (this.buttonBorders[activeButtonIndex]) {
|
|
|
+ this.buttonBorders[activeButtonIndex].active = true;
|
|
|
+ }
|
|
|
+
|
|
|
+ this.currentActiveButtonIndex = activeButtonIndex;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.currentActiveButtonIndex = -1;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
* 更新按钮状态，主要用于设置锁定按钮的视觉效果
|
|
|
*/
|
|
|
private updateButtonStates() {
|
|
|
- // 按钮索引到面板索引的映射：根据实际的点击事件调用
|
|
|
- const buttonToPanelMap = [0, 2, 1, 3]; // Battle->Main(0), Shop->Upgrade(2), Upgrade->Shop(1), Skill->Skill(3)
|
|
|
-
|
|
|
this.buttons.forEach((btn, buttonIndex) => {
|
|
|
const sp = btn.getComponent(Sprite);
|
|
|
if (sp) {
|
|
|
if (this.buttonLockStates[buttonIndex]) {
|
|
|
sp.color = this.lockedColor; // 设置锁定按钮为锁定颜色
|
|
|
+ // 确保锁定的按钮在原始位置
|
|
|
+ if (this.buttonOriginalPositions[buttonIndex]) {
|
|
|
+ btn.position = this.buttonOriginalPositions[buttonIndex].clone();
|
|
|
+ }
|
|
|
+ // 隐藏锁定按钮的边框
|
|
|
+ if (this.buttonBorders[buttonIndex]) {
|
|
|
+ this.buttonBorders[buttonIndex].active = false;
|
|
|
+ }
|
|
|
} else {
|
|
|
- // 对于未锁定的按钮，设置为正常颜色（除非它是当前激活的）
|
|
|
- // 这里我们需要知道当前激活的面板，但为了简化，先设置为正常颜色
|
|
|
- // 实际的激活状态会在switchTo中正确设置
|
|
|
- sp.color = this.normalColor;
|
|
|
+ sp.color = this.normalColor; // 设置未锁定按钮为正常颜色
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
@@ -242,4 +303,11 @@ export class NavBarController extends Component {
|
|
|
public getButtonLockStates(): boolean[] {
|
|
|
return [...this.buttonLockStates];
|
|
|
}
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 获取当前激活的按钮索引
|
|
|
+ */
|
|
|
+ public getCurrentActiveButtonIndex(): number {
|
|
|
+ return this.currentActiveButtonIndex;
|
|
|
+ }
|
|
|
}
|
181404010226
