admin/flowgram.ai
1
0
Fork 0
mirror of https://gitee.com/ByteDance/flowgram.ai.git synced 2025-07-07 17:43:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: node registry meta add autoResizeDisable and remove expandedSize (#388)

Browse Source
This commit is contained in:
xiamidaxia 2025-06-18 21:13:33 +08:00 committed by GitHub
parent 9190fbc6ba
commit 2b87cce7fe
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/canvas-engine/document/src/datas/flow-node-transform-data.ts
View File

@ -35,11 +35,10 @@ export class FlowNodeTransformData extends EntityData<FlowNodeTransformSchema> {
} }
getDefaultData(): FlowNodeTransformSchema { getDefaultData(): FlowNodeTransformSchema {
const { size, defaultExpanded, expandedSize, hidden } = this.entity.getNodeMeta(); const { size, hidden } = this.entity.getNodeMeta();
const defaultSize = defaultExpanded ? expandedSize : size;
// 更新默认 size 大小 // 更新默认 size 大小
return { return {
size: !hidden ? { ...defaultSize } : { width: 0, height: 0 }, size: !hidden ? { ...size } : { width: 0, height: 0 },
}; };
} }

3
packages/canvas-engine/document/src/typings/flow-node-register.ts
View File

@ -30,13 +30,13 @@ export interface FlowNodeMeta {
hidden?: boolean; // 是否隐藏 hidden?: boolean; // 是否隐藏
// maxSize?: SizeSchema // 默认展开后的大小 // maxSize?: SizeSchema // 默认展开后的大小
size?: SizeSchema; // 默认大小 size?: SizeSchema; // 默认大小
autoResizeDisable?: boolean; // 禁用监听节点变化自动调整大小
/** /**
* @deprecated 使用 NodeRegister.getOrigin 代替 * @deprecated 使用 NodeRegister.getOrigin 代替
*/ */
origin?: OriginSchema; // 原点配置，默认 垂直 { x: 0.5, y: 0 } 水平 { x: 0, y: 0.5 } origin?: OriginSchema; // 原点配置，默认 垂直 { x: 0.5, y: 0 } 水平 { x: 0, y: 0.5 }
defaultExpanded?: boolean; // 默认是否展开 defaultExpanded?: boolean; // 默认是否展开
defaultCollapsed?: boolean; // 复合节点默认是否收起 defaultCollapsed?: boolean; // 复合节点默认是否收起
expandedSize?: SizeSchema; // 默认缩小版大小
spacing?: number | ((transform: FlowNodeTransformData) => number); // 兄弟节点间，等价于 marginBottom spacing?: number | ((transform: FlowNodeTransformData) => number); // 兄弟节点间，等价于 marginBottom
padding?: PaddingSchema | ((transform: FlowNodeTransformData) => PaddingSchema); // 节点设置了 padding，则不需要 inlineSpacingPre 和 inlineSpacingAfter padding?: PaddingSchema | ((transform: FlowNodeTransformData) => PaddingSchema); // 节点设置了 padding，则不需要 inlineSpacingPre 和 inlineSpacingAfter
inlineSpacingPre?: number | ((transform: FlowNodeTransformData) => number); // 父子节点间，等价于 paddingTop 或者 paddingLeft inlineSpacingPre?: number | ((transform: FlowNodeTransformData) => number); // 父子节点间，等价于 paddingTop 或者 paddingLeft
@ -136,7 +136,6 @@ export const DEFAULT_FLOW_NODE_META: (
isStart: nodeType === 'start', isStart: nodeType === 'start',
hidden, hidden,
defaultExpanded: document.options.allNodesDefaultExpanded, defaultExpanded: document.options.allNodesDefaultExpanded,
expandedSize: { width: 520, height: 300 }, // 展开后的大小
size: DEFAULT_SIZE, size: DEFAULT_SIZE,
origin: document.layout.getDefaultNodeOrigin(), origin: document.layout.getDefaultNodeOrigin(),
isInlineBlocks: nodeType === FlowNodeBaseType.INLINE_BLOCKS, isInlineBlocks: nodeType === FlowNodeBaseType.INLINE_BLOCKS,

6
packages/canvas-engine/renderer/src/layers/flow-nodes-content-layer.tsx
View File

@ -81,9 +81,9 @@ export class FlowNodesContentLayer extends Layer {
const PortalRenderer = this.getPortalRenderer(data!); const PortalRenderer = this.getPortalRenderer(data!);
function Portal(): JSX.Element { function Portal(): JSX.Element {
React.useEffect(() => { React.useLayoutEffect(() => {
// 第一次加载需要把宽高通知 // 第一次加载需要把宽高通知
if (node.clientWidth && node.clientHeight) { if (!entity.getNodeMeta().autoResizeDisable && node.clientWidth && node.clientHeight) {
const transform = entity.getData<FlowNodeTransformData>(FlowNodeTransformData); const transform = entity.getData<FlowNodeTransformData>(FlowNodeTransformData);
if (transform) if (transform)
transform.size = { transform.size = {
@ -91,7 +91,7 @@ export class FlowNodesContentLayer extends Layer {
height: node.clientHeight, height: node.clientHeight,
}; };
} }
}, []); }, [entity, node]);
// 这里使用 portal，改 dom 样式不会引起 react 重新渲染 // 这里使用 portal，改 dom 样式不会引起 react 重新渲染
return ReactDOM.createPortal( return ReactDOM.createPortal(
<PlaygroundEntityContext.Provider value={entity}> <PlaygroundEntityContext.Provider value={entity}>

2
packages/canvas-engine/renderer/src/layers/flow-nodes-transform-layer.tsx
View File

@ -73,7 +73,9 @@ export class FlowNodesTransformLayer extends Layer<FlowNodesTransformLayerOption
if (resizeDispose) return; if (resizeDispose) return;
// 监听 dom 节点的大小变化 // 监听 dom 节点的大小变化
this.renderElement.appendChild(node); this.renderElement.appendChild(node);
if (!entity.getNodeMeta().autoResizeDisable) {
resizeDispose = this.resizeObserver.observe(node, transform!); resizeDispose = this.resizeObserver.observe(node, transform!);
}
}; };
const dispose = () => { const dispose = () => {
if (!resizeDispose) return; if (!resizeDispose) return;