@cc-component/cc-ex-component 1.1.6 → 1.1.7

package/assets/core/BaseReference.ts

@@ -0,0 +1,40 @@
+import { _decorator, Component, Node } from 'cc';
+import { ReferenceComponent } from './ReferenceComponent';
+const { ccclass, property } = _decorator;
+
+@ccclass('BaseReference')
+export class BaseReference extends Component {
+    rc: ReferenceComponent;
+    isInit: boolean = false;
+    initReferenceCollector() {
+        this.rc = this.getComponent(ReferenceComponent);
+    }
+    //#endregion
+    defineProperty(propertyKey: string) {
+        Object.defineProperty(this, propertyKey, { get: () => this.rc.get(propertyKey) });
+    }
+
+
+    // // 在 test 类中添加
+    // protected _bindings: { uiProp: string; dataPath: string }[] = [];
+
+    // // 数据变化回调
+    // protected _onDataChange(changedKey: string, newValue: any) {
+    //     this._bindings.forEach(({ uiProp, dataPath }) => {
+    //         // 检查变化的 key 是否匹配绑定路径（简单匹配）
+    //         if (dataPath.endsWith(changedKey)) {
+    //             const value = this._getNestedValue(this, dataPath);
+    //             if (this[uiProp]?.string !== undefined) {
+    //                 this[uiProp].string = value; // 更新 Label
+    //             }
+    //         }
+    //     });
+    // }
+
+    // // 工具方法：获取嵌套属性值
+    // protected _getNestedValue(obj: any, path: string) {
+    //     return path.split('.').reduce((o, k) => o?.[k], obj);
+    // }
+}
+
+

package/assets/{video/VideoComponent.ts.meta → core/BaseReference.ts.meta}

@@ -2,7 +2,7 @@
   "ver": "4.0.24",
   "importer": "typescript",
   "imported": true,
-  "uuid": "5a96af9a-5483-417c-a1a7-55b54d6e9562",
+  "uuid": "80f3a1bc-0def-46f0-9d80-766558915dba",
   "files": [],
   "subMetas": {},
   "userData": {}

package/assets/core/BaseViewModelData.ts

@@ -0,0 +1,12 @@
+
+export class BaseViewModelData {
+    // ✅ 一键批量赋值，无需手动写每个字段
+    public loadData(data: this) {
+    }
+    // ✅ 外部刷新UI
+    public refreshUI(data: Partial<any>) {
+        Object.assign(this, data);
+    }
+}
+
+

package/assets/{video/Interface.ts.meta → core/BaseViewModelData.ts.meta}

@@ -2,7 +2,7 @@
   "ver": "4.0.24",
   "importer": "typescript",
   "imported": true,
-  "uuid": "35c9eaf1-5191-4db4-8847-f1232268b465",
+  "uuid": "b0c7d937-f05a-4775-b75a-37fd1c14f007",
   "files": [],
   "subMetas": {},
   "userData": {}

package/assets/core/ReferenceComponent.ts

@@ -0,0 +1,317 @@
+import { Sprite } from "cc";
+import { Enum } from "cc";
+import { _decorator, Component, js, Node } from "cc";
+import { EDITOR_NOT_IN_PREVIEW } from "cc/env";
+
+const { ccclass, property, executeInEditMode, executionOrder, disallowMultiple, menu } = _decorator;
+
+@ccclass("CollectorNodeData")
+class CollectorNodeData {
+    @property({ readonly: true })
+    public key = "";
+    @property({ readonly: false })
+    public com: Node;
+}
+
+@ccclass("ReferenceComponent")
+@disallowMultiple
+@executeInEditMode(true)
+@executionOrder(-100)
+@menu("自动属性引用组件/ReferenceComponent")
+export class ReferenceComponent extends Component {
+
+    @property
+    private _refresh = false;
+    @property({ displayName: "复制属性" })
+    private get refresh() { return this._refresh; }
+    private set refresh(val: boolean) {
+        if (EDITOR_NOT_IN_PREVIEW) {
+            this.initNodeList();
+            this.genCode();
+        }
+        this._refresh = false;
+    }
+
+    @property
+    private _refresh_bind = false;
+    @property({ displayName: "快速生成vm属性" })
+    private get refresh_bind() { return this._refresh_bind; }
+    private set refresh_bind(val: boolean) {
+        if (EDITOR_NOT_IN_PREVIEW) {
+            this.initNodeList();
+            this.genCodeBind();
+        }
+        this._refresh_bind = false;
+    }
+
+    @property
+    private _refresh_bind_data = false;
+    @property({ displayName: "快速生成vm Data" })
+    private get refresh_bind_data() { return this._refresh_bind_data; }
+    private set refresh_bind_data(val: boolean) {
+        if (EDITOR_NOT_IN_PREVIEW) {
+            this.initNodeList();
+            this.genCodeVmData();
+        }
+        this._refresh_bind_data = false;
+    }
+
+    @property({ type: CollectorNodeData, readonly: false })
+    private _nodes: CollectorNodeData[] = [];
+    @property({ type: CollectorNodeData, tooltip: "自动引用节点(名字以$开头的)", readonly: true })
+    private get nodes() { return this._nodes; }
+    private set nodes(val: CollectorNodeData[]) { this._nodes = val; }
+
+    private _isInitNodeMap = false;
+    private _nodeMap: Map<string, Node | Sprite> = new Map();
+
+    comList = ["EditBox", "Toggle", "ToggleContainer", "Slider", "Button", "ProgressBar", "YXCollectionView", "TableView"]
+
+    protected onLoad(): void {
+        if (EDITOR_NOT_IN_PREVIEW) {//处理编辑器逻辑
+            this.initNodeList();
+        } else {//处理运行时逻辑
+            this.initNodeMap();
+        }
+    }
+
+    private initNodeMap() {
+        if (this._isInitNodeMap) return;
+        this._isInitNodeMap = true;
+        this._nodeMap.clear();
+        for (const collectorNodeData of this.nodes) {
+            let key = collectorNodeData.key.trim();
+            if (!this._nodeMap.has(key)) {
+                this._nodeMap.set(key, collectorNodeData.com);
+            } else {
+                console.error("[MLogger Error]", this.node.name, "引用的节点名字重复 Key=" + key);
+            }
+        }
+    }
+
+    public getNode(key: string) {
+        if (this._nodeMap.size == 0) this.initNodeMap();
+        return this._nodeMap.get(key);
+    }
+
+    // public get(key: string, type: typeof Node): Node;
+    // public get<T extends Component>(key: string, type: new (...args: any[]) => T): T;
+    public get(key: string): any {
+        if (this._nodeMap.size == 0) this.initNodeMap();
+        let node = this._nodeMap.get(key);
+        // if (node?.isValid) {
+        //     if (type as any === Node) {
+        //         return node;
+        //     } else {
+        //         return node.getComponent(type);
+        //     }
+        // }
+        return node;
+    }
+
+    //#region 编辑器逻辑
+
+    /** 收集名字以$开头的节点 */
+    private _tag = "$";
+
+    private initNodeList() {
+        if (!EDITOR_NOT_IN_PREVIEW) return;
+        this.nodes.length = 0;
+        let nodes = this.getValidNode(this.node);
+        for (const node of nodes) {
+            //@ts-ignore
+            const nodeType = this.getPropertyType(node)
+
+            let refData = new CollectorNodeData();
+            let name = node.name.replace(this._tag, "").trim();
+            refData.key = name;
+            refData.com = (node.getComponent(`cc.${nodeType}`) ?? (node.getComponent(`${nodeType}`) ?? node)) as any;
+            this.nodes.push(refData);
+        }
+    }
+
+
+    /** 获取符合需求的节点 */
+    private getValidNode(root: Node) {
+        if (!EDITOR_NOT_IN_PREVIEW) return;
+        let arr: Node[] = [];
+        let checkArr: Node[] = [];
+        checkArr.push(root);
+        while (checkArr.length > 0) {
+            let v = checkArr.shift();
+            let rc = v.getComponent(ReferenceComponent);
+            if (rc && rc != this) continue;
+            arr.push(...v.children.filter(v => {
+                const ok = this.isNodeValid(v)
+                return ok
+            }));
+
+            checkArr.push(...v.children);
+        }
+        return arr;
+    }
+
+    private isNodeValid(node: Node) {
+        if (!EDITOR_NOT_IN_PREVIEW) return;
+        if (node.name.startsWith(this._tag)) return true;
+        return false;
+    }
+
+    /** 生成引用节点的获取代码 并复制到剪切板 */
+    private genCode() {
+        if (!EDITOR_NOT_IN_PREVIEW) return;
+        let text = "";
+        //生成get属性
+        this.nodes.forEach(data => {
+            let key = data.key;
+            if (text) text += "\n";
+            let name = key[0].toLowerCase() + key.substring(1);
+            //@ts-ignore
+            let line = `@Ref ${name}: ${this.getPropertyType(data.com)};`//`private get ${name}() { return this.rc.get("${key}", ${this.getPropertyType(data.node)}); }`;
+            text += line;
+        });
+        Editor.Clipboard.write("text", text);
+        console.log("已复制到剪切板");
+    }
+
+    /** 生成引用节点的获取代码 并复制到剪切板 */
+    private genCodeBind(isVm: boolean = true) {
+        if (!EDITOR_NOT_IN_PREVIEW) return;
+        let text = "";
+
+
+        const viewModel = `        
+    // ✅ 使用新装饰器（自动响应式 + 路径推导）
+    @BindViewModel(new ViewModelData())
+    viewModel: ViewModelData;`
+        text += viewModel + "\n"
+        //生成get属性
+        this.nodes.forEach(data => {
+            let key = data.key;
+            if (text) text += "\n";
+            let name = key[0].toLowerCase() + key.substring(1);
+            const type = this.getPropertyType(data.com)
+            let bind_pix = `@Bind`
+            let event = `,{ event: (self) => { } }`
+            if (type === "YXCollectionView") {
+                event = `, {
+        layout: (self) => {
+            const layout = new YXFlowLayout();
+            layout.horizontalSpacing = 10;
+            layout.verticalSpacing = 20;
+            layout.itemSize = () => math.size(100, 100);
+            return layout;
+        },
+        cellForItemAt: (self, indexPath, collectionView) => {
+            let node = collectionView.dequeueReusableCell("cell", indexPath);
+            // TODO: configure cell
+            return node;
+        },
+    }`
+                bind_pix = `@BindCollect`
+
+            } else if (type === "TableView") {
+                event = `, {
+        itemSize: () => math.size(100, 100),
+        cellForItemAt: (self, indexPath, collectionView) => {
+            let node = collectionView.dequeueReusableCell("cell", indexPath)
+            return node
+        },
+    }`
+                bind_pix = `@BindTable`
+            }
+
+            let bind = `${bind_pix}("${name}"${this.comList.includes(type) ? event : ""})`
+            //@ts-ignore
+            let line = `    ${bind} @Ref ${name}: ${type};`
+            text += line;
+        });
+
+
+        Editor.Clipboard.write("text", text);
+        console.log("已复制到剪切板");
+    }
+
+    /** 生成引用节点的获取代码 并复制到剪切板 */
+    private genCodeVmData() {
+        if (!EDITOR_NOT_IN_PREVIEW) return;
+        let text = ""
+        //生成get属性
+        this.nodes.forEach(data => {
+            let key = data.key;
+            let name = key[0].toLowerCase() + key.substring(1);
+            const type = this.getPropertyType(data.com)
+            //@ts-ignore
+            let line = `    ${name}: ${this.getDataTypeByComponentType(type)};`//`private get ${name}() { return this.rc.get("${key}", ${this.getPropertyType(data.node)}); }`;
+            text += line + "\n";
+        });
+
+        text = `
+class ViewModelData {
+${text}
+
+    loadData() {
+
+    }
+}
+        `;
+        Editor.Clipboard.write("text", text);
+        console.log("已复制到剪切板");
+    }
+
+    /** 获取属性类型名字 */
+    private getPropertyType(node: Node) {
+        if (!EDITOR_NOT_IN_PREVIEW) return;
+        if (!node) { return "Node" }
+
+        //自定义脚本
+        let comp = node.getComponent('MComponent');
+        if (comp) return js.getClassName(comp);
+        //自定义组件
+        if (node.getComponent("Switch")) return "Switch";
+        if (node.getComponent("MSlider")) return "MSlider";
+        if (node.getComponent("MToggle")) return "MToggle";
+        if (node.getComponent("MButton")) return "MButton";
+        if (node.getComponent("Dropdown")) return "Dropdown";
+        //自定义新曾
+        if (node.getComponent("TableView")) return "TableView";
+        if (node.getComponent("YXCollectionView")) return "YXCollectionView";
+        //UI组件
+        if (node.getComponent("cc.EditBox")) return "EditBox";
+        if (node.getComponent("cc.Toggle")) return "Toggle";
+        if (node.getComponent("cc.ToggleContainer")) return "ToggleContainer";
+        if (node.getComponent("cc.Slider")) return "Slider";
+        if (node.getComponent("cc.Button")) return "Button";
+        if (node.getComponent("cc.ProgressBar")) return "ProgressBar";
+        if (node.getComponent("cc.ScrollView")) return "ScrollView";
+        if (node.getComponent("cc.PageView")) return "PageView";
+        if (node.getComponent("cc.Animation")) return "Animation";
+        //渲染组件
+        if (node.getComponent("cc.Sprite")) return "Sprite";
+        if (node.getComponent("cc.Label")) return "Label";
+        if (node.getComponent("cc.RichText")) return "RichText";
+        if (node.getComponent("cc.ParticleSystem2D")) return "ParticleSystem2D";
+        if (node.getComponent("sp.Skeleton")) return "sp.Skeleton";
+
+        return "Node";
+    }
+
+    getDataTypeByComponentType(compType: string) {
+        const typeMap: Record<string, string> = {
+            'Label': 'string',
+            'RichText': 'string',
+            'Sprite': 'SpriteFrame',
+            'Button': 'boolean',          // Button 通常绑定激活状态（true/false）
+            'ProgressBar': 'number',      // 进度条应为 number (0~1)
+            'Skeleton': 'sp.SkeletonData',
+            'Slider': 'number',
+            'Toggle': 'boolean',
+            'EditBox': 'string',
+            'ToggleContainer': 'number',  // 通常绑定选中项索引
+            'TableView': 'any[]',            // 列表数据一般为数组
+            'YXCollectionView': 'any[]'
+        };
+        return typeMap[compType] ?? 'any'; // 默认 fallback
+    }
+
+}