UI模块添加数据绑定装饰器

1.添加数据基类,子类自动添加代理,数据变化自动通知
 2.支持同属性多装饰器
This commit is contained in:
gongxh
2025-08-29 15:25:10 +08:00
parent b62a4af8db
commit e48011d941
45 changed files with 1354 additions and 21 deletions

Binary file not shown.

View File

@@ -0,0 +1,12 @@
{
"ver": "1.0.3",
"importer": "buffer",
"imported": true,
"uuid": "db12f6e3-dc8e-45aa-ba9f-90edf99cd732",
"files": [
".bin",
".json"
],
"subMetas": {},
"userData": {}
}

View File

@@ -0,0 +1,9 @@
{
"ver": "1.2.0",
"importer": "directory",
"imported": true,
"uuid": "1bd1aa0a-5c4d-4425-afaa-2a46c0f02a42",
"files": [],
"subMetas": {},
"userData": {}
}

View File

@@ -0,0 +1,62 @@
/**
* @Author: Gongxh
* @Date: 2025-08-19
* @Description:
*/
import { kunpo } from "../../header";
export class Level extends kunpo.DataBase {
private _levelid: number = 1;
private _storey: number = 0;
private _ispassed: boolean = false;
private _data: { min: number, max: number } = { min: 1, max: 100 };
constructor() {
super();
}
public get levelid() { return this._levelid; }
public set levelid(lv: number) { this._levelid = lv; }
public get storey() { return this._storey; }
public set storey(storey: number) { this._storey = storey; }
public get ispassed() { return this._ispassed; }
public set ispassed(bool: boolean) { this._ispassed = bool; }
public get data(): { min: number, max: number } { return this._data; }
public set data(data: { min: number, max: number }) { this._data = data; }
public init(data: any) {
this.data = { min: data.min, max: data.max };
this.refreshMin(data.min);
this.refreshMax(data.max);
this.ispassed = data.ispassed;
this.levelid = data.levelid;
this.storey = data.storey;
}
public refreshLevel(lv: number) {
this.levelid = lv;
}
public refreshStorey(storey: number) {
this.storey = storey;
}
public refreshBool(bool: boolean) {
this.ispassed = bool;
}
public refreshMin(min: number) {
this.data.min = min;
}
public refreshMax(max: number) {
this.data.max = max;
}
}

View File

@@ -0,0 +1,9 @@
{
"ver": "4.0.24",
"importer": "typescript",
"imported": true,
"uuid": "632daee7-7c2c-4baf-a4dd-d1a12ad91169",
"files": [],
"subMetas": {},
"userData": {}
}

View File

@@ -0,0 +1,9 @@
{
"ver": "1.2.0",
"importer": "directory",
"imported": true,
"uuid": "3edce213-52a5-403f-b57f-52da9d7bcbce",
"files": [],
"subMetas": {},
"userData": {}
}

View File

@@ -5,8 +5,11 @@
*/
import { GlobalEvent } from "kunpocc-event";
import { Level } from "../Data/global/Level";
export class DataHelper {
public static level: Level = new Level();
private static _data: Map<string, any> = new Map();
public static getValue<T>(key: string, defaultValue: T): T {

View File

@@ -2,7 +2,7 @@
"ver": "4.0.24",
"importer": "typescript",
"imported": true,
"uuid": "7340bacc-d167-47e8-a83b-2224c46b7fd0",
"uuid": "e786f26b-332e-4bb2-88c4-4d1c25b675a5",
"files": [],
"subMetas": {},
"userData": {}

View File

@@ -5,8 +5,8 @@
*/
import { ConditionType } from "../../condition/ConditionType";
import { DataHelper } from "../../Data/DataHelper";
import { fgui, kunpo } from "../../header";
import { DataHelper } from "../../Helper/DataHelper";
const { uiclass, uiprop, uiclick } = kunpo._uidecorator;
@uiclass("Window", "Condition", "ConditionWindow")

View File

@@ -0,0 +1,9 @@
{
"ver": "1.2.0",
"importer": "directory",
"imported": true,
"uuid": "d0395b78-5d23-4c60-91ca-8851d9eddc27",
"files": [],
"subMetas": {},
"userData": {}
}

View File

@@ -0,0 +1,127 @@
/**
* @Author: Gongxh
* @Date: 2025-08-19
* @Description:
*/
import { Level } from "../../Data/global/Level";
import { fgui, kunpo } from "../../header";
import { DataHelper } from "../../Helper/DataHelper";
const { bindMethod, bindProp } = kunpo.data;
const { uiclass, uiprop, uiclick } = kunpo._uidecorator;
@uiclass("Window", "Data", "DataWindow")
export class DataWindow extends kunpo.Window {
@uiprop
@bindProp(Level, data => data.storey, (item: fgui.GTextField, value: number, data: Level) => {
item.text = `关卡:${data.levelid} 层数:${value}`;
})
@bindProp(Level, data => data.levelid, (item: fgui.GTextField, value: number, data: Level) => {
item.text = `关卡:${value} 层数:${data.storey}`;
})
private lab_level: fgui.GTextField;
@uiprop
@bindProp(Level, data => data.storey, (item: fgui.GTextField, value: number, data: Level) => {
item.text = `层数:${value}`;
})
private lab_storey: fgui.GTextField;
@uiprop
@bindProp(Level, data => data.refreshMin, (item: fgui.GTextField) => {
item.text = `最小值:${DataHelper.level.data.min}`;
})
private lab_min: fgui.GTextField;
@uiprop
@bindProp(Level, data => data.refreshMax, (item: fgui.GTextField) => {
item.text = `最大值:${DataHelper.level.data.max}`;
})
private lab_max: fgui.GTextField;
@uiprop
@bindProp(Level, data => data.ispassed, (item: fgui.GTextField) => {
item.text = `是否通过:${DataHelper.level.ispassed ? '是' : '否'}`;
})
private lab_ispassed: fgui.GTextField;
protected onInit(): void {
this.adapterType = kunpo.AdapterType.Bang;
this.type = kunpo.WindowType.Normal;
}
protected onShow(userdata?: any): void {
}
protected onClose(): void {
}
@uiclick
private onRefreshLevel(): void {
DataHelper.level.refreshLevel(DataHelper.level.levelid + 1);
}
@uiclick
private onRefreshStorey(): void {
DataHelper.level.refreshStorey(DataHelper.level.storey + 1);
}
@uiclick
private onRefreshBool(): void {
DataHelper.level.refreshBool(!DataHelper.level.ispassed);
}
@uiclick
private onRefreshData(): void {
DataHelper.level.data = { min: 1, max: 100 };
}
@uiclick
private onRefreshMin(): void {
DataHelper.level.refreshMin(DataHelper.level.data.min + 1);
}
@uiclick
private onRefreshMax(): void {
DataHelper.level.refreshMax(DataHelper.level.data.max - 1);
}
@uiclick
private onRefreshAll(): void {
DataHelper.level.init({ min: 1, max: 100, ispassed: true, levelid: 1, storey: 1 });
}
@uiclick
private onTouchClose(): void {
kunpo.WindowManager.closeWindow(this.name);
}
@bindMethod(Level, data => data.ispassed)
private refreshBool(level: Level): void {
this.lab_ispassed.text = `是否通过:${level.ispassed ? '是' : '否'}`;
}
@bindMethod(Level, data => data.refreshMin)
private refreshMin(level: Level): void {
this.lab_min.text = `对象属性min${level.data.min}`;
}
@bindMethod(Level, data => data.refreshMax)
private refreshMax(level: Level): void {
this.lab_max.text = `对象属性max${level.data.max}`;
}
@bindMethod(Level, data => data.refreshMax)
@bindMethod(Level, data => data.refreshMin)
@bindMethod(Level, data => data.init)
@bindMethod(Level, data => data.data)
private refreshData(level: Level): void {
console.log('触发回调了');
this.lab_min.text = `对象属性min${level.data.min}`;
this.lab_max.text = `对象属性max${level.data.max}`;
}
}

View File

@@ -0,0 +1,9 @@
{
"ver": "4.0.24",
"importer": "typescript",
"imported": true,
"uuid": "09bc366d-d2c6-46d1-b5b1-1f7e75f2be09",
"files": [],
"subMetas": {},
"userData": {}
}

View File

@@ -0,0 +1,9 @@
{
"ver": "1.2.0",
"importer": "directory",
"imported": true,
"uuid": "6aabaf5c-aed0-45c8-acc4-9fc86646c3f7",
"files": [],
"subMetas": {},
"userData": {}
}

View File

@@ -0,0 +1,26 @@
/**
* @Author: Gongxh
* @Date: 2025-08-30
* @Description:
*/
import { Level } from "../../../Data/global/Level";
import { fgui, kunpo } from "../../../header";
const { uiheader, uiprop, uicom, uiclick } = kunpo._uidecorator;
const { bindMethod, bindProp } = kunpo.data;
@uicom("Data", "DataItem")
export class DataItem extends fgui.GComponent {
@uiprop
@bindProp(Level, data => data.levelid, (item: fgui.GTextField, value: number, data: Level) => {
item.text = `关卡回调\n关卡:${value}\n层数:${data.storey}`;
})
@bindProp(Level, data => data.storey, (item: fgui.GTextField, value: number, data: Level) => {
item.text = `层数回调\n关卡:${data.levelid}\n层数:${value}`;
})
private lab_level: fgui.GTextField;
public onInit(): void {
}
}

View File

@@ -0,0 +1,9 @@
{
"ver": "4.0.24",
"importer": "typescript",
"imported": true,
"uuid": "8eacd9e1-5ee5-4b18-9e66-4f7e70787268",
"files": [],
"subMetas": {},
"userData": {}
}

View File

@@ -97,6 +97,11 @@ export class HomeWindow extends kunpo.Window {
});
}
@uiclick
private onClickData(): void {
kunpo.WindowManager.showWindow("DataWindow");
}
public getHeaderInfo(): kunpo.WindowHeaderInfo {
return kunpo.WindowHeaderInfo.create("WindowHeader", "aaa");
}

View File

@@ -14,4 +14,8 @@ export class CustomComponents extends fgui.GComponent {
public onInit(): void {
kunpo.log("CustomComponents onInit");
}
public dispose(): void {
kunpo.log("CustomComponents dispose");
}
}

View File

@@ -4,7 +4,7 @@
* @Description: 条件1 关联数据conditon1
*/
import { GlobalEvent } from 'kunpocc-event';
import { DataHelper } from '../Data/DataHelper';
import { DataHelper } from '../Helper/DataHelper';
import { kunpo } from '../header';
import { ConditionType } from './ConditionType';
const { conditionClass } = kunpo._conditionDecorator;

View File

@@ -4,7 +4,7 @@
* @Description: 条件2 关联数据condition2
*/
import { GlobalEvent } from 'kunpocc-event';
import { DataHelper } from '../Data/DataHelper';
import { DataHelper } from '../Helper/DataHelper';
import { kunpo } from '../header';
import { ConditionType } from './ConditionType';
const { conditionClass } = kunpo._conditionDecorator;

View File

@@ -4,7 +4,7 @@
* @Description: 条件3 关联数据condition3
*/
import { GlobalEvent } from 'kunpocc-event';
import { DataHelper } from '../Data/DataHelper';
import { DataHelper } from '../Helper/DataHelper';
import { kunpo } from '../header';
import { ConditionType } from './ConditionType';
const { conditionClass } = kunpo._conditionDecorator;

View File

@@ -4,7 +4,7 @@
* @Description: 条件4 关联数据condition4
*/
import { GlobalEvent } from 'kunpocc-event';
import { DataHelper } from '../Data/DataHelper';
import { DataHelper } from '../Helper/DataHelper';
import { kunpo } from '../header';
import { ConditionType } from './ConditionType';
const { conditionClass } = kunpo._conditionDecorator;

View File

@@ -1 +1 @@
{"Basics":{"AlertWindow":{"props":["bg",1,0,"lab_title",1,4,"lab_content",1,5,"btn_close",1,1,"btn_ok",1,3,"btn_cancel",1,2],"callbacks":["onClickBtnClose",1,1,"onClickBtnOk",1,3,"onClickBtnCancel",1,2],"controls":[],"transitions":[]},"ToastWindow":{"props":["toast",1,1,"labTips",2,1,1,"bgMask",1,0],"callbacks":[],"controls":[],"transitions":[]},"WindowHeader":{"props":["btn_close",1,0],"callbacks":[],"controls":[],"transitions":[]},"WindowHeader2":{"props":["btn_close",1,0],"callbacks":[],"controls":[],"transitions":[]}},"Condition":{"ConditionWindow":{"props":["reddot1",1,4,"reddot2",1,5,"btn_condition1",1,6,"btn_condition2",1,7,"btn_condition3",1,8,"btn_condition4",1,9],"callbacks":["onClickBtnClose",1,1,"onClickBtnCondition1",1,6,"onClickBtnCondition2",1,7,"onClickBtnCondition3",1,8,"onClickBtnCondition4",1,9],"controls":[],"transitions":[]}},"Home":{"HomeWindow":{"props":[],"callbacks":["onClickUI",1,6,"onSocketWindow",1,3,"onClickBtnCondition",1,1,"onClickMiniGame",1,4,"onClickBtnHotUpdate",1,5,"onClickLoadBuffer",1,2],"controls":["sta2","sta2","status","status"],"transitions":["t0","t0","t1","t1"]}},"HotUpdate":{"HotUpdateWindow":{"props":["lab_version",1,4,"lab_desc",1,5],"callbacks":["onClickClose",1,3,"onCheckUpdate",1,1,"onStartUpdate",1,2],"controls":[],"transitions":[]}},"MiniGame":{"MiniGameWindow":{"props":["btn_close",1,5,"lab_adid",1,8,"lab_payQuantity",1,9],"callbacks":["onClickBtnClose",1,5,"onClickBtnInitAds",1,2,"onClickBtnPay",1,3],"controls":[],"transitions":[]}},"Socket":{"SocketTestWindow":{"props":["text_input",1,7,"text_input_message",1,9],"callbacks":["onCloseWindow",1,1,"onConnection",1,3,"onDisconnect",1,2,"onSendText",1,4,"onSendBinary",1,5],"controls":[],"transitions":[]}},"Window":{"CloseAllWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"CloseOneWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"CustomComponents":{"props":["n1",1,1],"callbacks":[],"controls":[],"transitions":[]},"HideAllWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"HideOneWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"PopWindow":{"props":["btn_close",1,2],"callbacks":["onCloseWindow",1,2],"controls":[],"transitions":[]},"PopWindowHeader1":{"props":["btn_close",1,2],"callbacks":["onCloseWindow",1,2],"controls":[],"transitions":[]},"PopWindowHeader2":{"props":["btn_close",1,2],"callbacks":["onCloseWindow",1,2],"controls":[],"transitions":[]},"UIBaseWindow":{"props":[],"callbacks":["onClickBtnClose",1,8,"onClickBtnHeader1",1,1,"onClickBtnHeader2",1,2,"onClickBtnEmpty",1,3,"onClickBtnCloseOne",1,4,"onClickBtnCloseAll",1,5,"onClickBtnHideOne",1,6,"onClickBtnHideAll",1,7],"controls":[],"transitions":[]}}}
{"Basics":{"AlertWindow":{"props":["bg",1,0,"lab_title",1,4,"lab_content",1,5,"btn_close",1,1,"btn_ok",1,3,"btn_cancel",1,2],"callbacks":["onClickBtnClose",1,1,"onClickBtnOk",1,3,"onClickBtnCancel",1,2],"controls":[],"transitions":[]},"ToastWindow":{"props":["toast",1,1,"labTips",2,1,1,"bgMask",1,0],"callbacks":[],"controls":[],"transitions":[]},"WindowHeader":{"props":["btn_close",1,0],"callbacks":[],"controls":[],"transitions":[]},"WindowHeader2":{"props":["btn_close",1,0],"callbacks":[],"controls":[],"transitions":[]}},"Condition":{"ConditionWindow":{"props":["reddot1",1,4,"reddot2",1,5,"btn_condition1",1,6,"btn_condition2",1,7,"btn_condition3",1,8,"btn_condition4",1,9],"callbacks":["onClickBtnClose",1,1,"onClickBtnCondition1",1,6,"onClickBtnCondition2",1,7,"onClickBtnCondition3",1,8,"onClickBtnCondition4",1,9],"controls":[],"transitions":[]}},"Data":{"DataItem":{"props":["lab_level",1,1],"callbacks":[],"controls":[],"transitions":[]},"DataWindow":{"props":["lab_level",1,9,"lab_storey",1,10,"lab_min",1,12,"lab_max",1,13,"lab_ispassed",1,11],"callbacks":["onRefreshLevel",1,2,"onRefreshStorey",1,3,"onRefreshBool",1,4,"onRefreshData",1,5,"onRefreshMin",1,6,"onRefreshMax",1,7,"onRefreshAll",1,8,"onTouchClose",1,1],"controls":[],"transitions":[]}},"Home":{"HomeWindow":{"props":[],"callbacks":["onClickUI",1,6,"onSocketWindow",1,3,"onClickBtnCondition",1,1,"onClickMiniGame",1,4,"onClickBtnHotUpdate",1,5,"onClickLoadBuffer",1,2,"onClickData",1,7],"controls":["sta2","sta2","status","status"],"transitions":["t0","t0","t1","t1"]}},"HotUpdate":{"HotUpdateWindow":{"props":["lab_version",1,4,"lab_desc",1,5],"callbacks":["onClickClose",1,3,"onCheckUpdate",1,1,"onStartUpdate",1,2],"controls":[],"transitions":[]}},"MiniGame":{"MiniGameWindow":{"props":["btn_close",1,5,"lab_adid",1,8,"lab_payQuantity",1,9],"callbacks":["onClickBtnClose",1,5,"onClickBtnInitAds",1,2,"onClickBtnPay",1,3],"controls":[],"transitions":[]}},"Socket":{"SocketTestWindow":{"props":["text_input",1,7,"text_input_message",1,9],"callbacks":["onCloseWindow",1,1,"onConnection",1,3,"onDisconnect",1,2,"onSendText",1,4,"onSendBinary",1,5],"controls":[],"transitions":[]}},"Window":{"CloseAllWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"CloseOneWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"CustomComponents":{"props":["n1",1,1],"callbacks":[],"controls":[],"transitions":[]},"HideAllWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"HideOneWindow":{"props":["btn_close",1,2],"callbacks":["onClickBtnClose",1,2],"controls":[],"transitions":[]},"PopWindow":{"props":["btn_close",1,2],"callbacks":["onCloseWindow",1,2],"controls":[],"transitions":[]},"PopWindowHeader1":{"props":["btn_close",1,2],"callbacks":["onCloseWindow",1,2],"controls":[],"transitions":[]},"PopWindowHeader2":{"props":["btn_close",1,2],"callbacks":["onCloseWindow",1,2],"controls":[],"transitions":[]},"UIBaseWindow":{"props":[],"callbacks":["onClickBtnClose",1,8,"onClickBtnHeader1",1,1,"onClickBtnHeader2",1,2,"onClickBtnEmpty",1,3,"onClickBtnCloseOne",1,4,"onClickBtnCloseAll",1,5,"onClickBtnHideOne",1,6,"onClickBtnHideAll",1,7],"controls":[],"transitions":[]}}}