import { _decorator, Component, instantiate, Node, Prefab, Size, tween, UIOpacity, UITransform, Vec2, Vec3 } from 'cc'; import { Singleton } from '../Tools/Singleton'; import { BasePanel } from './BasePanel'; import { SettingsPanel } from './SettingsPanel'; import { RankPanel } from './RankPanel'; import { InforPanel } from './InforPanel'; const { ccclass, property } = _decorator; //大厅和游戏内公用一套方案 @ccclass('UIManager') export class UIManager extends Component { public static Instance: UIManager; //管理不同UI界面,根据名字查找节点 private UI_Map: Map = new Map(); //使用栈保证仅有顶层UI能被触摸 private UIPanel_Stack: Node[] = []; onLoad() { UIManager.Instance = this; } //显示UI public ShowUI(uiName: string, prefab: Prefab) { let uiNode = this.UI_Map.get(uiName); if (!uiNode) { //加载UI console.log(this.node); console.log("实例化设置界面"); uiNode = instantiate(prefab); uiNode.setParent(this.node); this.UI_Map.set(uiName, uiNode); console.log(uiNode.name, uiNode.position, uiNode.parent); // 打印节点信息 } uiNode.active = true; let opacity = uiNode.getComponent(UIOpacity); opacity.opacity = 0; tween(opacity).to(0.5, { opacity: 255 }, { easing: 'fade' }).start(); let scaleUp = tween(uiNode).to(0.4, { scale: new Vec3(1.02, 1.02, 1.02) }, { easing: 'quadOut' }); let scaleDown = tween(uiNode).to(0.1, { scale: new Vec3(1.0, 1.0, 1.0) }, { easing: 'quadOut' }); tween(uiNode).sequence(scaleUp, scaleDown).start(); this.pushUIPanel(uiNode); let basePanel = uiNode.getComponent(BasePanel); if (basePanel) { basePanel.onEnter(); } } //隐藏UI public hideUI(callback) { let uiNode = this.UIPanel_Stack[this.UIPanel_Stack.length - 1]; let opacity = uiNode.getComponent(UIOpacity); tween(opacity).to(0.3, { opacity: 0 }, { easing: 'fade' }).call(() => { this.popUIPanel(); let basePanel = uiNode.getComponent(BasePanel); if (basePanel) { basePanel.onExit(); } if(callback!==null) callback(); }).start(); } // 将UI面板压入栈中 private pushUIPanel(uiNode: Node): void { this.UIPanel_Stack.push(uiNode); this.updateUIPanelStack(); } // 从栈中弹出UI面板 private popUIPanel(): void { if (this.UIPanel_Stack.length > 0) { const topUI = this.UIPanel_Stack.pop(); if (topUI) { topUI.active = false; } this.updateUIPanelStack(); } } // 更新UI面板栈 private updateUIPanelStack(): void { for (let i = 0; i < this.UIPanel_Stack.length; i++) { const uiNode = this.UIPanel_Stack[i]; uiNode.active = i === this.UIPanel_Stack.length - 1;//保证栈顶为可活动 } } //清除栈 public clearStack() { this.UIPanel_Stack = []; } }