mirror of
				https://github.com/Gongxh0901/kunpolibrary
				synced 2025-10-30 19:05:44 +00:00 
			
		
		
		
	UI模块添加数据绑定装饰器
1.添加数据基类,子类自动添加代理,数据变化自动通知 2.支持同属性多装饰器
This commit is contained in:
		
							
								
								
									
										9
									
								
								demo/assets/script/Data/global.meta
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								demo/assets/script/Data/global.meta
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,9 @@ | ||||
| { | ||||
|   "ver": "1.2.0", | ||||
|   "importer": "directory", | ||||
|   "imported": true, | ||||
|   "uuid": "1bd1aa0a-5c4d-4425-afaa-2a46c0f02a42", | ||||
|   "files": [], | ||||
|   "subMetas": {}, | ||||
|   "userData": {} | ||||
| } | ||||
							
								
								
									
										62
									
								
								demo/assets/script/Data/global/Level.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										62
									
								
								demo/assets/script/Data/global/Level.ts
									
									
									
									
									
										Normal 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; | ||||
|     } | ||||
| } | ||||
							
								
								
									
										9
									
								
								demo/assets/script/Data/global/Level.ts.meta
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								demo/assets/script/Data/global/Level.ts.meta
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,9 @@ | ||||
| { | ||||
|   "ver": "4.0.24", | ||||
|   "importer": "typescript", | ||||
|   "imported": true, | ||||
|   "uuid": "632daee7-7c2c-4baf-a4dd-d1a12ad91169", | ||||
|   "files": [], | ||||
|   "subMetas": {}, | ||||
|   "userData": {} | ||||
| } | ||||
							
								
								
									
										9
									
								
								demo/assets/script/Data/runtime.meta
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								demo/assets/script/Data/runtime.meta
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,9 @@ | ||||
| { | ||||
|   "ver": "1.2.0", | ||||
|   "importer": "directory", | ||||
|   "imported": true, | ||||
|   "uuid": "3edce213-52a5-403f-b57f-52da9d7bcbce", | ||||
|   "files": [], | ||||
|   "subMetas": {}, | ||||
|   "userData": {} | ||||
| } | ||||
| @@ -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 { | ||||
| @@ -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": {} | ||||
| @@ -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") | ||||
|   | ||||
							
								
								
									
										9
									
								
								demo/assets/script/UI/Data.meta
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								demo/assets/script/UI/Data.meta
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,9 @@ | ||||
| { | ||||
|   "ver": "1.2.0", | ||||
|   "importer": "directory", | ||||
|   "imported": true, | ||||
|   "uuid": "d0395b78-5d23-4c60-91ca-8851d9eddc27", | ||||
|   "files": [], | ||||
|   "subMetas": {}, | ||||
|   "userData": {} | ||||
| } | ||||
							
								
								
									
										127
									
								
								demo/assets/script/UI/Data/DataWindow.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										127
									
								
								demo/assets/script/UI/Data/DataWindow.ts
									
									
									
									
									
										Normal 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}`; | ||||
|     } | ||||
| } | ||||
							
								
								
									
										9
									
								
								demo/assets/script/UI/Data/DataWindow.ts.meta
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								demo/assets/script/UI/Data/DataWindow.ts.meta
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,9 @@ | ||||
| { | ||||
|   "ver": "4.0.24", | ||||
|   "importer": "typescript", | ||||
|   "imported": true, | ||||
|   "uuid": "09bc366d-d2c6-46d1-b5b1-1f7e75f2be09", | ||||
|   "files": [], | ||||
|   "subMetas": {}, | ||||
|   "userData": {} | ||||
| } | ||||
							
								
								
									
										9
									
								
								demo/assets/script/UI/Data/Items.meta
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								demo/assets/script/UI/Data/Items.meta
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,9 @@ | ||||
| { | ||||
|   "ver": "1.2.0", | ||||
|   "importer": "directory", | ||||
|   "imported": true, | ||||
|   "uuid": "6aabaf5c-aed0-45c8-acc4-9fc86646c3f7", | ||||
|   "files": [], | ||||
|   "subMetas": {}, | ||||
|   "userData": {} | ||||
| } | ||||
							
								
								
									
										26
									
								
								demo/assets/script/UI/Data/Items/DataItem.ts
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										26
									
								
								demo/assets/script/UI/Data/Items/DataItem.ts
									
									
									
									
									
										Normal 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 { | ||||
|     } | ||||
| } | ||||
							
								
								
									
										9
									
								
								demo/assets/script/UI/Data/Items/DataItem.ts.meta
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								demo/assets/script/UI/Data/Items/DataItem.ts.meta
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,9 @@ | ||||
| { | ||||
|   "ver": "4.0.24", | ||||
|   "importer": "typescript", | ||||
|   "imported": true, | ||||
|   "uuid": "8eacd9e1-5ee5-4b18-9e66-4f7e70787268", | ||||
|   "files": [], | ||||
|   "subMetas": {}, | ||||
|   "userData": {} | ||||
| } | ||||
| @@ -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"); | ||||
|     } | ||||
|   | ||||
| @@ -14,4 +14,8 @@ export class CustomComponents extends fgui.GComponent { | ||||
|     public onInit(): void { | ||||
|         kunpo.log("CustomComponents onInit"); | ||||
|     } | ||||
|  | ||||
|     public dispose(): void { | ||||
|         kunpo.log("CustomComponents dispose"); | ||||
|     } | ||||
| } | ||||
|   | ||||
| @@ -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; | ||||
|   | ||||
| @@ -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; | ||||
|   | ||||
| @@ -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; | ||||
|   | ||||
| @@ -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; | ||||
|   | ||||
		Reference in New Issue
	
	Block a user