cocos creator ts 弹窗控制器

在Cocos Creator中使用TypeScript来创建弹窗控制器，你可以按照以下步骤进行操作：

1. 创建一个名为PopupManager的类，该类将负责管理所有弹窗的打开和关闭操作。

export class PopupManager {
    private static _instance: PopupManager = null;
    private _popupStack: cc.Node[] = [];
    private _popupLayer: cc.Node = null;
 
    public static getInstance(): PopupManager {
        if (PopupManager._instance == null) {
            PopupManager._instance = new PopupManager();
        }
        return PopupManager._instance;
    }
 
    private constructor() {
        this._popupLayer = new cc.Node();
        this._popupLayer.name = "PopupLayer";
        cc.director.getScene().addChild(this._popupLayer);
    }
 
    public pushPopup(popup: cc.Node) {
        if (popup == null) {
            return;
        }
        this._popupLayer.addChild(popup);
        this._popupStack.push(popup);
    }
 
    public popPopup() {
        if (this._popupStack.length > 0) {
            let popup = this._popupStack.pop();
            popup.removeFromParent(true);
        }
    }
}

2. 创建一个名为PopupBase的类，该类将作为所有弹窗的基类，提供弹窗的打开和关闭方法。你可以在该类的onLoad方法中进行初始化操作。

export class PopupBase extends cc.Component {
    public onLoad() {
        // 初始化弹窗界面
        this.initView();
    }
 
    public initView() {
        // 子类需要实现该方法，用于初始化弹窗界面
    }
 
    public show() {
        // 弹出弹窗
        PopupManager.getInstance().pushPopup(this.node);
    }
 
    public hide() {
        // 隐藏弹窗
        PopupManager.getInstance().popPopup();
    }
}

3. 创建一个名为MyPopup的类，该类将作为你的具体弹窗控制器，在该类中继承PopupBase类。

export class MyPopup extends PopupBase {
    private _closeBtn: cc.Node = null;
 
    public initView() {
        // 初始化弹窗界面
        this._closeBtn = this.node.getChildByName("CloseBtn");
        this._closeBtn.on(cc.Node.EventType.TOUCH_END, this.onCloseBtnClick, this);
    }
 
    private onCloseBtnClick() {
        // 关闭弹窗
        this.hide();
    }
}

4. 在场景中添加一个空节点作为弹窗容器，并将MyPopup预制体添加到该节点下。

const {ccclass, property} = cc._decorator;
 
@ccclass
export class MainScene extends cc.Component {
    @property(cc.Prefab)
    private _myPopupPrefab: cc.Prefab = null;
 
    private _myPopup: cc.Node = null;
 
    public onLoad() {
        // 加载弹窗预制体
        this._myPopup = cc.instantiate(this._myPopupPrefab);
    }
 
    public onBtnShowPopupClick() {
        // 显示弹窗
        this._myPopup.getComponent(MyPopup).show();
    }
}

现在你已经创建了一个弹窗控制器，可以通过该控制器来方便地管理多个弹窗，并在需要的时候打开或关闭它们。