From acfb9c117d0a69c33f601f4182ec07598a8348f8 Mon Sep 17 00:00:00 2001 From: unanmed <1319491857@qq.com> Date: Thu, 8 Oct 2026 19:02:04 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20UI=20=E7=B3=BB=E7=BB=9F=E5=8F=8A?= =?UTF-8?q?=E5=85=B6=E5=9C=A8=E6=B8=B2=E6=9F=93=E7=AB=AF=E7=9A=84=E5=88=9D?= =?UTF-8?q?=E5=A7=8B=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages-user/client-base/src/types.ts | 16 ++++++++++--- packages-user/client-modules/src/client.ts | 20 +++++++++++----- packages-user/client-modules/src/ui/func.ts | 26 +++++++++++++++++++++ packages/common/src/logger.json | 1 + packages/system/src/ui/container.tsx | 22 +++++++++-------- packages/system/src/ui/controller.ts | 20 +++++++++++++++- packages/system/src/ui/types.ts | 20 ++++++++++++++++ 7 files changed, 105 insertions(+), 20 deletions(-) create mode 100644 packages-user/client-modules/src/ui/func.ts diff --git a/packages-user/client-base/src/types.ts b/packages-user/client-base/src/types.ts index f57eb3c..168abb6 100644 --- a/packages-user/client-base/src/types.ts +++ b/packages-user/client-base/src/types.ts @@ -1,13 +1,23 @@ import { IExcitation, IExcitationDivider } from '@motajs/animate'; import { IRenderTreeRoot } from '@motajs/render'; import { IRendererUsing } from '@motajs/render-vue'; -import { UIController } from '@motajs/system'; +import { + IUIController, + IUIDefaultPropsBase, + UIComponent +} from '@motajs/system'; import { IBGMPlayer, IMotaAudioContext, ISoundPlayer } from '@motajs/audio'; import { ICoreState } from '@user/data-state'; import { ISaveSystem } from './save'; import { ITextureManager } from './material'; import { IMapRenderer, IMapExtensionManager } from './map'; +export interface IGameUIPropsBase< + T extends UIComponent = UIComponent +> extends IUIDefaultPropsBase { + readonly state: IClientBase; +} + export interface IClientBase extends ICoreState { /** 存档系统 */ readonly save: ISaveSystem; @@ -34,9 +44,9 @@ export interface IClientBase extends ICoreState { /** 渲染器使用对象，供组件内注册渲染激励与事件监听 */ readonly using: IRendererUsing; /** 主场景的 UI 控制器，管理游戏主场景的 UI 显示 */ - readonly sceneController: UIController; + readonly sceneController: IUIController; /** 主界面的 UI 控制器，管理游戏主界面的 UI 显示 */ - readonly mainUIController: UIController; + readonly mainUIController: IUIController; } export interface IClientBaseExtended { diff --git a/packages-user/client-modules/src/client.ts b/packages-user/client-modules/src/client.ts index 463e0e3..771f6cd 100644 --- a/packages-user/client-modules/src/client.ts +++ b/packages-user/client-modules/src/client.ts @@ -13,7 +13,8 @@ import { ITextureManager, TextureManager, ISaveSystem, - SaveSystem + SaveSystem, + IGameUIPropsBase } from '@user/client-base'; import { IMapRenderer, @@ -38,9 +39,10 @@ import { } from './shared'; import { WebLoadStarter } from '@motajs/loader'; import { IRendererUsing, RendererUsing } from '@motajs/render-vue'; -import { UIController } from '@motajs/system'; +import { IUIController, UIController } from '@motajs/system'; import { createApp } from './render'; import { LoadSceneUI } from './render/ui/load'; +import { createUIPropsBase } from './ui/func'; export class ClientCore extends CoreState implements IClientCore { // Layer 4 渲染基础层 @@ -56,8 +58,8 @@ export class ClientCore extends CoreState implements IClientCore { readonly mainMapRenderer: IMapRenderer; readonly expandMapRenderer: IMapRenderer; readonly mainMapExtension: IMapExtensionManager; - readonly sceneController: UIController; - readonly mainUIController: UIController; + readonly sceneController: IUIController; + readonly mainUIController: IUIController; // Layer 5 渲染顶层 @@ -121,8 +123,11 @@ export class ClientCore extends CoreState implements IClientCore { this.mainMapRenderer = new MapRenderer(this.materials); this.mainMapExtension = new MapExtensionManager(this.mainMapRenderer); this.expandMapRenderer = new MapRenderer(this.materials); - this.sceneController = new UIController('main-scene'); - this.mainUIController = new UIController('main-ui'); + this.sceneController = new UIController(); + this.mainUIController = new UIController(); + const pbCreator = createUIPropsBase(this); + this.sceneController.setPropsBaseCreator(pbCreator); + this.mainUIController.setPropsBaseCreator(pbCreator); //#endregion @@ -131,6 +136,9 @@ export class ClientCore extends CoreState implements IClientCore { this.init(); } + /** + * 初始化渲染端主对象 + */ private async init() { createApp(this.sceneController.render()).mount(this.renderer); this.sceneController.open(LoadSceneUI, {}); diff --git a/packages-user/client-modules/src/ui/func.ts b/packages-user/client-modules/src/ui/func.ts new file mode 100644 index 0000000..1a67f11 --- /dev/null +++ b/packages-user/client-modules/src/ui/func.ts @@ -0,0 +1,26 @@ +import { + IUIController, + IUIInstance, + UIComponent, + UIPropsBaseCreator +} from '@motajs/system'; +import { IClientBase, IGameUIPropsBase } from '@user/client-base'; + +/** + * 创建游戏 UI 基础参数的构造函数 + * @param state 游戏状态对象 + */ +export function createUIPropsBase( + state: IClientBase +): UIPropsBaseCreator { + return ( + instance: IUIInstance, + controller: IUIController + ): IGameUIPropsBase => { + return { + instance, + controller, + state + }; + }; +} diff --git a/packages/common/src/logger.json b/packages/common/src/logger.json index 1729be5..2a16b8e 100644 --- a/packages/common/src/logger.json +++ b/packages/common/src/logger.json @@ -73,6 +73,7 @@ "71": "Passive replay command needs a ReplayCommandResult status transfering by IReplayPassiveHandler.next, but system got a undefined.", "72": "Replay error when replaying $1 replay step, detailed error message will show together with this error info.", "73": "No passive replay needed currently, but a 'getPassive' call detected, check if there's an issue on replay array or your replay logic.", + "74": "A UI base props creator binding is needed before using ui controller.", "2001": "Replay($1): Replay parameter count mismatch: expected $2, got $3.", "2002": "Replay($1): Replay parameter type mismatch: index $2, expected $3, got $4.", "2003": "Replay(move): Expected hero to be stopped before execute moving step.", diff --git a/packages/system/src/ui/container.tsx b/packages/system/src/ui/container.tsx index 7ce0269..8eeddca 100644 --- a/packages/system/src/ui/container.tsx +++ b/packages/system/src/ui/container.tsx @@ -30,16 +30,18 @@ export const UIContainer = defineComponent(props => { ); } return elements.concat( - data.stack.map((v, i) => ( - - )) + data.stack.map((v, i) => { + const pb = data.createPropsBase(v); + return ( + + ); + }) ); }; }, containerConfig); diff --git a/packages/system/src/ui/controller.ts b/packages/system/src/ui/controller.ts index ab173de..25c3ea6 100644 --- a/packages/system/src/ui/controller.ts +++ b/packages/system/src/ui/controller.ts @@ -6,7 +6,8 @@ import { UIComponent, IUIDefaultPropsBase, IUICustomStrategy, - UIRawProps + UIRawProps, + UIPropsBaseCreator } from './types'; import { UIInstance } from './instance'; import { @@ -20,6 +21,7 @@ import { VNode } from 'vue'; import { UIContainer } from './container'; +import { logger } from '@motajs/common'; export class UIController< PB extends IUIDefaultPropsBase @@ -34,6 +36,8 @@ export class UIController< /** 当前的自定义 UI 控制策略 */ private strategy: IUICustomStrategy; + /** UI 基础参数的构造函数 */ + private creator: UIPropsBaseCreator | null = null; /** 是否维持背景 UI */ private keepBack: boolean = false; @@ -52,6 +56,20 @@ export class UIController< this.strategy = new UILastOnlyStrategy(); } + setPropsBaseCreator(creator: UIPropsBaseCreator | null): void { + this.creator = creator; + } + + createPropsBase(instance: IUIInstance): PB { + if (!this.creator) { + logger.error(74); + // @ts-expect-error 不存在构造函数时的 + return { instance, controller: this } as PB; + } else { + return this.creator(instance, this); + } + } + setBackground( background: IGameUI | null, vBind: UIRawProps diff --git a/packages/system/src/ui/types.ts b/packages/system/src/ui/types.ts index 15c94c6..2a24550 100644 --- a/packages/system/src/ui/types.ts +++ b/packages/system/src/ui/types.ts @@ -112,6 +112,14 @@ export type UIRawProps< PB extends IUIDefaultPropsBase > = Omit, keyof PB>; +/** + * UI 基础 Props 参数的构造函数 + */ +export type UIPropsBaseCreator> = ( + instance: IUIInstance, + controller: IUIController +) => PB; + export interface IUIController> { /** 当前的 UI 栈 */ readonly stack: IUIInstance[]; @@ -125,6 +133,18 @@ export interface IUIController> { /** 当前是否显示背景的响应式对象，用于容器响应式判断是否需要显示背景 */ readonly showBack: Ref; + /** + * 设置基础参数的构造函数 + * @param creator UI 基础 Props 参数的构造函数 + */ + setPropsBaseCreator(creator: UIPropsBaseCreator | null): void; + + /** + * 创建对应 UI 实例对象的基础参数 + * @param instance UI 实例对象 + */ + createPropsBase(instance: IUIInstance): PB; + /** * 设置控制器的背景 UI * @param background 背景 UI