fix: 元素的根元素

This commit is contained in:
unanmed 2025-02-18 21:49:52 +08:00
parent 4b2d94e422
commit 48cc34aa2d
4 changed files with 49 additions and 36 deletions

View File

@ -78,6 +78,29 @@ export class Container<E extends EContainerEvent = EContainerEvent>
this.update(this);
}
append(parent: RenderItem): void {
super.append(parent);
if (this.root) {
this.forEachChild(ele => {
ele.checkRoot();
this.root?.connect(ele);
});
}
}
/**
*
* @param fn
*/
forEachChild(fn: (ele: RenderItem) => void) {
const stack: RenderItem[] = [this];
while (stack.length > 0) {
const ele = stack.pop()!;
stack.push(...ele.children);
fn(ele);
}
}
private sortChildren() {
this.sortedChildren = [...this.children].sort(
(a, b) => a.zIndex - b.zIndex

View File

@ -278,15 +278,6 @@ export abstract class RenderItem<E extends ERenderItemEvent = ERenderItemEvent>
return this._transform;
}
private _cursor: string = 'auto';
/** 鼠标覆盖在该元素上时的指针样式 */
set cursor(v: string) {
this.setCursor(v);
}
get cursor() {
return this._cursor;
}
//#endregion
//#region 父子关系
@ -486,19 +477,6 @@ export abstract class RenderItem<E extends ERenderItemEvent = ERenderItemEvent>
this.update();
}
/**
*
* @param cursor
*/
setCursor(cursor: string = 'auto') {
const canvas = this._root?.getCanvas();
if (!canvas) return;
if (this.hovered) {
canvas.style.cursor = cursor;
}
this._cursor = cursor;
}
/**
*
*/
@ -591,14 +569,19 @@ export abstract class RenderItem<E extends ERenderItemEvent = ERenderItemEvent>
//#region 父子关系
protected checkRoot() {
if (this._root || this.isRoot) return this._root;
checkRoot() {
if (this._root) return this._root;
if (this.isRoot) return this;
let ele: RenderItem = this;
while (!ele.isRoot) {
if (!ele.parent) {
if (ele._root) {
this._root = ele._root;
return this._root;
}
if (!ele._parent) {
return null;
} else {
ele = ele.parent;
ele = ele._parent;
}
}
this._root = ele as RenderItem & IRenderTreeRoot;
@ -631,10 +614,8 @@ export abstract class RenderItem<E extends ERenderItemEvent = ERenderItemEvent>
this._parent = parent;
parent.requestSort();
this.update();
if (this._id !== '') {
this.checkRoot();
this._root?.connect(this);
}
this.checkRoot();
this._root?.connect(this);
}
/**
@ -846,11 +827,6 @@ export abstract class RenderItem<E extends ERenderItemEvent = ERenderItemEvent>
}
break;
}
case ActionType.Enter: {
const canvas = this._root?.getCanvas();
if (!canvas) return true;
canvas.style.cursor = this._cursor;
}
}
return inElement;

View File

@ -31,6 +31,7 @@ export interface BaseProps {
id?: string;
alpha?: number;
composite?: GlobalCompositeOperation;
cursor?: string;
}
export interface SpriteProps extends BaseProps {

View File

@ -1,5 +1,5 @@
import { FloorItemDetail } from '@/plugin/fx/itemDetail';
import { FloorDamageExtends, LayerGroup } from '@/core/render';
import { FloorDamageExtends, LayerGroup, Transform } from '@/core/render';
import { LayerDoorAnimate } from '@/core/render';
import { HeroRenderer } from '@/core/render';
import { MotaRenderer } from '@/core/render';
@ -64,8 +64,21 @@ export function create() {
weather.bind(map.value);
});
const test = (msg: string) => {
return (ev: IActionEvent) => {
console.log(msg, ev);
};
};
return () => (
<container id="map-draw" {...mapDrawProps}>
<icon
icon={50}
zIndex={100}
width={240}
height={240}
cursor="pointer"
></icon>
<layer-group id="layer-main" ex={layerGroupExtends} ref={map}>
<layer layer="bg" zIndex={10}></layer>
<layer layer="bg2" zIndex={20}></layer>