diff --git a/src/core/render/item.ts b/src/core/render/item.ts index 99de344..5cc11ae 100644 --- a/src/core/render/item.ts +++ b/src/core/render/item.ts @@ -177,6 +177,12 @@ export interface IRenderTreeRoot { * 获取渲染至的目标画布,即显示在画面上的画布 */ getCanvas(): HTMLCanvasElement; + + /** + * 当鼠标覆盖在某个元素上时执行 + * @param element 鼠标覆盖的元素 + */ + hoverElement(element: RenderItem): void; } export interface ERenderItemEvent extends ERenderItemActionEvent { @@ -260,6 +266,9 @@ export abstract class RenderItem /** 不透明度 */ alpha: number = 1; + /** 鼠标覆盖在此元素上时的光标样式 */ + cursor: string = 'auto'; + get x() { return this._transform.x; } @@ -788,6 +797,9 @@ export abstract class RenderItem ): boolean { switch (type) { case ActionType.Move: { + if (inElement) { + this._root?.hoverElement(this); + } if (this.hovered && !inElement) { this.hovered = false; this.emit('leaveCapture', event); @@ -1063,6 +1075,11 @@ export abstract class RenderItem this.setAnchor(nextValue[0] as number, nextValue[1] as number); return; } + case 'cursor': { + if (!this.assertType(nextValue, 'string', key)) return; + this.cursor = nextValue; + return; + } } const ev = this.parseEvent(key); if (ev) { diff --git a/src/core/render/render.ts b/src/core/render/render.ts index 02c98bf..1fd8661 100644 --- a/src/core/render/render.ts +++ b/src/core/render/render.ts @@ -449,6 +449,10 @@ export class MotaRenderer extends Container implements IRenderTreeRoot { return this.target.canvas; } + hoverElement(element: RenderItem): void { + this.target.canvas.style.cursor = element.cursor; + } + destroy() { super.destroy(); MotaRenderer.list.delete(this.id);