refactor: props 也挪到 client-modules,并使 image 标签与样板解耦

This commit is contained in:
unanmed 2025-05-25 17:25:41 +08:00
parent d72334e80b
commit fc1e9751eb
4 changed files with 67 additions and 62 deletions

View File

@ -0,0 +1,61 @@
import { BaseProps, TagDefine } from '@motajs/render-vue';
import { Transform } from '@motajs/render-core';
import {
ILayerGroupRenderExtends,
FloorLayer,
ILayerRenderExtends,
ELayerEvent,
ELayerGroupEvent
} from './layer';
import { EAnimateEvent } from './animate';
import { EIconEvent, EWinskinEvent } from './misc';
export interface AnimateProps extends BaseProps {}
export interface IconProps extends BaseProps {
/** 图标 id 或数字 */
icon: AllNumbers | AllIds;
/** 显示图标的第几帧 */
frame?: number;
/** 是否开启动画,开启后 frame 参数无效 */
animate?: boolean;
}
export interface WinskinProps extends BaseProps {
/** winskin 的图片 id */
image: ImageIds;
/** 边框大小 */
borderSize?: number;
}
export interface LayerGroupProps extends BaseProps {
cellSize?: number;
blockSize?: number;
floorId?: FloorIds;
bindThisFloor?: boolean;
camera?: Transform;
ex?: readonly ILayerGroupRenderExtends[];
layers?: readonly FloorLayer[];
}
export interface LayerProps extends BaseProps {
layer?: FloorLayer;
mapWidth?: number;
mapHeight?: number;
cellSize?: number;
background?: AllNumbers;
floorImage?: FloorAnimate[];
ex?: readonly ILayerRenderExtends[];
}
declare module 'vue/jsx-runtime' {
namespace JSX {
export interface IntrinsicElements {
layer: TagDefine<LayerProps, ELayerEvent>;
'layer-group': TagDefine<LayerGroupProps, ELayerGroupEvent>;
animation: TagDefine<AnimateProps, EAnimateEvent>;
icon: TagDefine<IconProps, EIconEvent>;
winskin: TagDefine<WinskinProps, EWinskinEvent>;
}
}
}

View File

@ -8,7 +8,6 @@ import {
} from 'vue';
import EventEmitter from 'eventemitter3';
import {
AnimateProps,
BaseProps,
BezierProps,
CirclesProps,
@ -18,10 +17,7 @@ import {
CustomProps,
DamageProps,
EllipseProps,
IconProps,
ImageProps,
LayerGroupProps,
LayerProps,
LineProps,
PathProps,
QuadraticProps,
@ -29,8 +25,7 @@ import {
RectRProps,
ShaderProps,
SpriteProps,
TextProps,
WinskinProps
TextProps
} from './props';
import {
ERenderItemEvent,
@ -40,13 +35,8 @@ import {
EShaderEvent
} from '@motajs/render-core';
import {
EIconEvent,
EImageEvent,
ETextEvent,
EWinskinEvent,
ELayerEvent,
ELayerGroupEvent,
EAnimateEvent,
EGraphicItemEvent
} from '@motajs/render-elements';
@ -97,10 +87,7 @@ declare module 'vue/jsx-runtime' {
image: TagDefine<ImageProps, EImageEvent>;
comment: TagDefine<CommentProps, ERenderItemEvent>;
custom: TagDefine<CustomProps, ERenderItemEvent>;
layer: TagDefine<LayerProps, ELayerEvent>;
'layer-group': TagDefine<LayerGroupProps, ELayerGroupEvent>;
damage: TagDefine<DamageProps, ERenderItemEvent>;
animation: TagDefine<AnimateProps, EAnimateEvent>;
'g-rect': TagDefine<RectProps, EGraphicItemEvent>;
'g-circle': TagDefine<CirclesProps, EGraphicItemEvent>;
'g-ellipse': TagDefine<EllipseProps, EGraphicItemEvent>;
@ -109,8 +96,6 @@ declare module 'vue/jsx-runtime' {
'g-quad': TagDefine<QuadraticProps, EGraphicItemEvent>;
'g-path': TagDefine<PathProps, EGraphicItemEvent>;
'g-rectr': TagDefine<RectRProps, EGraphicItemEvent>;
icon: TagDefine<IconProps, EIconEvent>;
winskin: TagDefine<WinskinProps, EWinskinEvent>;
}
}
}

View File

@ -157,13 +157,13 @@ tagMap.register<ETextEvent, Text>('text', (_0, _1, props) => {
return new Text(text, type);
}
});
const emptyImage = document.createElement('canvas');
emptyImage.width = 1;
emptyImage.height = 1;
tagMap.register('image', (_0, _1, props) => {
if (!props) return new Image(core.material.images.images['bg.webp']);
if (!props) return new Image(emptyImage);
else {
const {
image = core.material.images.images['bg.webp'],
type = 'static'
} = props;
const { image = emptyImage, type = 'static' } = props;
return new Image(image, type);
}
});

View File

@ -9,9 +9,6 @@ import {
CustomContainerRenderFn
} from '@motajs/render-core';
import {
FloorLayer,
ILayerGroupRenderExtends,
ILayerRenderExtends,
BezierParams,
CircleParams,
EllipseParams,
@ -125,28 +122,6 @@ export interface CommentProps extends BaseProps {
text?: string;
}
export interface LayerGroupProps extends BaseProps {
cellSize?: number;
blockSize?: number;
floorId?: FloorIds;
bindThisFloor?: boolean;
camera?: Transform;
ex?: readonly ILayerGroupRenderExtends[];
layers?: readonly FloorLayer[];
}
export interface LayerProps extends BaseProps {
layer?: FloorLayer;
mapWidth?: number;
mapHeight?: number;
cellSize?: number;
background?: AllNumbers;
floorImage?: FloorAnimate[];
ex?: readonly ILayerRenderExtends[];
}
export interface AnimateProps extends BaseProps {}
export interface DamageProps extends BaseProps {
mapWidth?: number;
mapHeight?: number;
@ -255,19 +230,3 @@ export interface RectRProps extends GraphicPropsBase {
*/
ellipse?: RectREllipseParams;
}
export interface IconProps extends BaseProps {
/** 图标 id 或数字 */
icon: AllNumbers | AllIds;
/** 显示图标的第几帧 */
frame?: number;
/** 是否开启动画,开启后 frame 参数无效 */
animate?: boolean;
}
export interface WinskinProps extends BaseProps {
/** winskin 的图片 id */
image: ImageIds;
/** 边框大小 */
borderSize?: number;
}