update framework

src/ui/promisesLaya.js

@@ -0,0 +1,34 @@
+Laya.promises = {
+    Tween: {
+        from: async function (target, props, duration, ease, delay, coverBefore) {
+            return new Promise(function (resolve, reject) {
+                try {
+                    Laya.Tween.from(target, props, duration, ease, Laya.Handler.create(null, ()=>resolve(), null, true), delay, coverBefore);
+                } catch (e) {
+                    reject(e);
+                }
+            });
+        },
+        to: async function (target, props, duration, ease, delay, coverBefore) {
+            return new Promise(function (resolve, reject) {
+                try {
+                    Laya.Tween.to(target, props, duration, ease, Laya.Handler.create(null, ()=>resolve(), null, true), delay, coverBefore);
+                } catch (e) {
+                    reject(e);
+                }
+            });
+        },
+    },
+    loader: {
+        load: async function (url, progress, type) {
+            return new Promise(function (resolve, reject) {
+                try {
+                    Laya.loader.load(url, Laya.Handler.create(null, ret=>resolve(ret), null, true), progress, type);
+                } catch (e) {
+                    reject(e);
+                }
+            });
+        }
+
+    }
+};

src/ui/runtime.js

@@ -0,0 +1,22 @@
+class ScaleButton extends Laya.Button {
+    constructor() {
+        super();
+        this.on(Laya.Event.MOUSE_DOWN, this, this.onMouse, [Laya.Event.MOUSE_DOWN]);
+        this.on(Laya.Event.MOUSE_OUT, this, this.onMouse, [Laya.Event.MOUSE_OUT]);
+        this.on(Laya.Event.MOUSE_UP, this, this.onMouse, [Laya.Event.MOUSE_UP]);
+    }
+
+    onMouse(type) {
+        switch (type) {
+            case Laya.Event.MOUSE_DOWN:
+                Laya.Tween.to(this, { scaleX: 0.9, scaleY: 0.9 }, 100);
+                break;
+            case Laya.Event.MOUSE_OUT:
+            case Laya.Event.MOUSE_UP:
+                Laya.Tween.to(this, { scaleX: 1, scaleY: 1 }, 100);
+                break;
+            default:
+                break;
+        }
+    }
+}

src/ui/uiManager.js

@@ -0,0 +1,130 @@
+class UIManager {
+    constructor(stage) {
+        if(!stage) {
+            stage = Laya.stage;
+        }
+
+        this.#stage = stage;
+
+        stage.addChild(this.#viewLayer);
+        this.#viewLayer.zOrder = 1;
+        stage.addChild(this.#dialogLayer);
+        this.#dialogLayer.zOrder = 2;
+        this.#viewLayer.top =
+        this.#viewLayer.bottom =
+        this.#viewLayer.left =
+        this.#viewLayer.right =
+        this.#dialogLayer.top =
+        this.#dialogLayer.bottom =
+        this.#dialogLayer.left =
+        this.#dialogLayer.right = 0;
+    }
+
+    static #instance = {};
+    #stage;
+    #loading;
+    #currentView;
+    #viewLayer = new Laya.Panel();
+    #dialogLayer = new Laya.Panel();
+    #viewMap = new Map();
+    theme;
+
+    static getInstance(name="default") {
+        return this.#instance[name] || (this.#instance[name] = new UIManager());
+    }
+
+    async setLoading(loading) {
+        const view = await this.getView(loading);
+        this.#loading = view;
+        this.#loading.zOrder = 3;
+    }
+
+    async switchView(viewName, args, actions) {
+        // get view instance
+        const view = await this.getView(viewName, args, actions?.load);
+
+        // close current view
+        this.clearAllDialog();
+        await this.#currentView?.close?.(view);
+        this.#viewLayer.removeChildren();
+
+        // open new view
+        await view.init?.(args);
+
+        this.#currentView = view;
+        this.#viewLayer.addChild(view);
+
+        view.close = actions?.close;
+        await actions?.open?.(view);
+        await view.show?.();
+    }
+
+    async getView(viewName, args, preload) {
+        // check if view is already loaded
+        let view = await this.#viewMap.get(viewName);
+
+        if(this.#loading) {
+            this.#stage.addChild(this.#loading);
+        }
+        const onProgress = this.#loading?.onProgress;
+
+        if(!view) {
+            // load view
+            const ViewClass = await this.loadView(viewName);
+            const resourceList = await ViewClass.load?.(args);
+            await this.loadRes(resourceList, preload, onProgress);
+
+            // create view
+            view = new ViewClass();
+            // add view to map
+            this.#viewMap.set(viewName, view);
+        } else {
+            // load resource
+            const resourceList = await view.constructor.load?.(args);
+            await this.loadRes(resourceList, preload, onProgress);
+        }
+
+        this.#loading?.removeSelf();
+
+        // return view
+        return view;
+    }
+
+    async loadView(viewName) {
+        // load view
+        return (await import(`../view/${viewName}.js`)).default;
+    }
+
+    async loadRes(resourceList, preload, onProgress) {
+        let list = [];
+        if(resourceList) list = list.concat(resourceList);
+        if(preload) list = list.concat(preload);
+
+        if(list.length) {
+            await Laya.promises.loader.load(list, Laya.Handler.create(null, onProgress));
+        }
+    }
+
+    async showDialog(dialogName, args, actions) {
+        const dialog = await this.getView(dialogName, args, actions?.load);
+
+        dialog.init(args);
+        this.#dialogLayer.addChild(dialog);
+
+        const open = actions?.open || (async () => {
+            this.#dialogLayer.scaleX = 0;
+            this.#dialogLayer.scaleY = 0;
+            await Laya.promises.Tween.to(dialog, { scaleX: 1, scaleY: 1 }, 300, Laya.Ease.backOut);
+        });
+        await open(dialog);
+        dialog.close = actions?.close || (async () => {
+            await Laya.promises.Tween.to(dialog, { scaleX: 0, scaleY: 0 }, 300, Laya.Ease.backOut);
+        });;
+
+        this.#dialogLayer.addChild(dialog);
+    }
+
+    clearAllDialog() {
+        this.#dialogLayer.removeChildren();
+    }
+}