NavBarController.ts 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. import { _decorator, Color, Component, Node, Sprite } from 'cc';
  2. import EventBus, { GameEvents } from '../Core/EventBus';
  3. const { ccclass, property } = _decorator;
  4. @ccclass('NavBarController')
  5. export class NavBarController extends Component {
  6. @property({ type: [Node] }) panels: Node[] = []; // 依次给 Main、Shop、Upgrade、Skill
  7. @property({ type: [Node] }) buttons: Node[] = []; // 依次给 Battle、Shop、Upgrade、Skill
  8. private normalColor = new Color(255, 255, 255, 255);
  9. private activeColor = new Color(255, 0, 0, 255); // 红色
  10. private lockedColor = new Color(128, 128, 128, 255); // 灰色(锁定状态)
  11. // 按钮锁定状态数组 - 对应 Battle、Shop、Upgrade、Skill 四个按钮
  12. private buttonLockStates: boolean[] = [false, true, false, false]; // 默认只锁定Shop按钮
  13. start () {
  14. // 默认打开 MainUI
  15. this.switchTo(0);
  16. // 初始化按钮状态,设置shop按钮为锁定状态
  17. this.updateButtonStates();
  18. }
  19. onBattleClick () {
  20. // 检查Battle按钮是否被锁定(索引0)
  21. if (this.buttonLockStates[0]) {
  22. console.log('[NavBarController] Battle按钮被锁定,无法点击');
  23. // 发送Toast事件显示锁定提示
  24. EventBus.getInstance().emit(GameEvents.SHOW_TOAST, {
  25. message: '暂未解锁该功能!',
  26. duration: 2.0
  27. });
  28. return;
  29. }
  30. this.switchTo(0);
  31. }
  32. onUpgradeClick () {
  33. // 检查Upgrade按钮是否被锁定(索引2)
  34. if (this.buttonLockStates[2]) {
  35. console.log('[NavBarController] Upgrade按钮被锁定,无法点击');
  36. // 发送Toast事件显示锁定提示
  37. EventBus.getInstance().emit(GameEvents.SHOW_TOAST, {
  38. message: '暂未解锁该功能!',
  39. duration: 2.0
  40. });
  41. return;
  42. }
  43. this.switchTo(1);
  44. }
  45. onShopClick () {
  46. // 检查shop按钮是否被锁定(索引1)
  47. if (this.buttonLockStates[1]) {
  48. console.log('[NavBarController] Shop按钮被锁定,无法点击');
  49. // 发送Toast事件显示锁定提示
  50. EventBus.getInstance().emit(GameEvents.SHOW_TOAST, {
  51. message: '暂未解锁该功能!',
  52. duration: 2.0
  53. });
  54. return;
  55. }
  56. this.switchTo(2);
  57. }
  58. onSkillClick () {
  59. // 检查Skill按钮是否被锁定(索引3)
  60. if (this.buttonLockStates[3]) {
  61. console.log('[NavBarController] Skill按钮被锁定,无法点击');
  62. // 发送Toast事件显示锁定提示
  63. EventBus.getInstance().emit(GameEvents.SHOW_TOAST, {
  64. message: '暂未解锁该功能!',
  65. duration: 2.0
  66. });
  67. return;
  68. }
  69. this.switchTo(3);
  70. // 注意:滚动功能现在由SkillNodeGenerator组件通过装饰器直接处理
  71. }
  72. private switchTo (index: number) {
  73. // 显示对应面板
  74. this.panels.forEach((p, i) => p.active = i === index);
  75. // 按钮索引到面板索引的映射:根据实际的点击事件调用
  76. // 按钮索引: [0:Battle, 1:Shop, 2:Upgrade, 3:Skill]
  77. // 面板索引: [0:Main, 1:Shop, 2:Upgrade, 3:Skill]
  78. // 实际映射: Battle->Main(0), Shop->Upgrade(2), Upgrade->Shop(1), Skill->Skill(3)
  79. const buttonToPanelMap = [0, 2, 1, 3]; // Battle->Main(0), Shop->Upgrade(2), Upgrade->Shop(1), Skill->Skill(3)
  80. // 设置按钮颜色,考虑锁定状态
  81. this.buttons.forEach((btn, buttonIndex) => {
  82. const sp = btn.getComponent(Sprite);
  83. if (sp) {
  84. // 检查按钮是否被锁定
  85. if (this.buttonLockStates[buttonIndex]) {
  86. sp.color = this.lockedColor; // 锁定状态显示灰色
  87. } else {
  88. // 检查当前按钮对应的面板是否是激活的面板
  89. const panelIndex = buttonToPanelMap[buttonIndex];
  90. sp.color = (panelIndex === index) ? this.activeColor : this.normalColor;
  91. }
  92. }
  93. });
  94. }
  95. /**
  96. * 更新按钮状态,主要用于设置锁定按钮的视觉效果
  97. */
  98. private updateButtonStates() {
  99. // 按钮索引到面板索引的映射:根据实际的点击事件调用
  100. const buttonToPanelMap = [0, 2, 1, 3]; // Battle->Main(0), Shop->Upgrade(2), Upgrade->Shop(1), Skill->Skill(3)
  101. this.buttons.forEach((btn, buttonIndex) => {
  102. const sp = btn.getComponent(Sprite);
  103. if (sp) {
  104. if (this.buttonLockStates[buttonIndex]) {
  105. sp.color = this.lockedColor; // 设置锁定按钮为锁定颜色
  106. } else {
  107. // 对于未锁定的按钮,设置为正常颜色(除非它是当前激活的)
  108. // 这里我们需要知道当前激活的面板,但为了简化,先设置为正常颜色
  109. // 实际的激活状态会在switchTo中正确设置
  110. sp.color = this.normalColor;
  111. }
  112. }
  113. });
  114. }
  115. /**
  116. * 解锁指定按钮
  117. * @param buttonIndex 按钮索引 (0:Battle, 1:Shop, 2:Upgrade, 3:Skill)
  118. */
  119. public unlockButton(buttonIndex: number) {
  120. if (buttonIndex >= 0 && buttonIndex < this.buttonLockStates.length) {
  121. this.buttonLockStates[buttonIndex] = false;
  122. this.updateButtonStates();
  123. const buttonNames = ['Battle', 'Shop', 'Upgrade', 'Skill'];
  124. console.log(`[NavBarController] ${buttonNames[buttonIndex]}按钮已解锁`);
  125. }
  126. }
  127. /**
  128. * 锁定指定按钮
  129. * @param buttonIndex 按钮索引 (0:Battle, 1:Shop, 2:Upgrade, 3:Skill)
  130. */
  131. public lockButton(buttonIndex: number) {
  132. if (buttonIndex >= 0 && buttonIndex < this.buttonLockStates.length) {
  133. this.buttonLockStates[buttonIndex] = true;
  134. this.updateButtonStates();
  135. const buttonNames = ['Battle', 'Shop', 'Upgrade', 'Skill'];
  136. console.log(`[NavBarController] ${buttonNames[buttonIndex]}按钮已锁定`);
  137. }
  138. }
  139. /**
  140. * 检查指定按钮是否被锁定
  141. * @param buttonIndex 按钮索引 (0:Battle, 1:Shop, 2:Upgrade, 3:Skill)
  142. */
  143. public isButtonLocked(buttonIndex: number): boolean {
  144. if (buttonIndex >= 0 && buttonIndex < this.buttonLockStates.length) {
  145. return this.buttonLockStates[buttonIndex];
  146. }
  147. return false;
  148. }
  149. /**
  150. * 批量设置按钮锁定状态
  151. * @param lockStates 锁定状态数组 [Battle, Shop, Upgrade, Skill]
  152. */
  153. public setButtonLockStates(lockStates: boolean[]) {
  154. if (lockStates.length === 4) {
  155. this.buttonLockStates = [...lockStates];
  156. this.updateButtonStates();
  157. console.log('[NavBarController] 按钮锁定状态已更新:', lockStates);
  158. }
  159. }
  160. /**
  161. * 获取当前所有按钮的锁定状态
  162. */
  163. public getButtonLockStates(): boolean[] {
  164. return [...this.buttonLockStates];
  165. }
  166. }