Siklos/svg-layout-designer-react
1
1
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Canvas: Add dimension margin

Browse source
This commit is contained in:
Eric NGUYEN 2023-02-17 15:46:03 +01:00
parent b2fa591f14
commit bdc10264d5
1 changed files with 127 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

128
src/Components/Canvas/DimensionLayer.ts
View file

@ -2,7 +2,7 @@ import { Orientation } from '../../Enums/Orientation';
import { Position } from '../../Enums/Position';
import { type IContainerModel } from '../../Interfaces/IContainerModel';
import { type ISymbolModel } from '../../Interfaces/ISymbolModel';
import { SHOW_SELF_DIMENSIONS, SHOW_BORROWER_DIMENSIONS, SHOW_CHILDREN_DIMENSIONS, DIMENSION_MARGIN } from '../../utils/default';
import { SHOW_SELF_DIMENSIONS, SHOW_BORROWER_DIMENSIONS, SHOW_CHILDREN_DIMENSIONS, DIMENSION_MARGIN, SHOW_SELF_MARGINS_DIMENSIONS } from '../../utils/default';
import { FindContainerById, MakeRecursionDFSIterator, Pairwise } from '../../utils/itertools';
import { TransformX, TransformY } from '../../utils/svg';
import { type IDimensionStyle } from '../SVG/Elements/Dimension';
@ -33,6 +33,22 @@ export function AddContainerDimensions(
);
}
if (SHOW_SELF_MARGINS_DIMENSIONS &&
container.properties.dimensionOptions.selfMarginsDimensions.positions.length > 0) {
ActionByPosition(
ctx,
dimMapped,
container.properties.dimensionOptions.selfMarginsDimensions.positions,
AddHorizontalSelfMarginsDimension,
AddVerticalSelfMarginDimension,
[
container,
currentTransform,
scale
]
);
}
if (SHOW_BORROWER_DIMENSIONS &&
container.properties.dimensionOptions.dimensionWithMarks.positions.length > 0) {
ActionByPosition(
@ -437,6 +453,116 @@ function AddHorizontalSelfDimension(
});
}
function AddHorizontalSelfMarginsDimension(
ctx: CanvasRenderingContext2D,
yDim: number,
container: IContainerModel,
currentTransform: [number, number],
dimensions: React.ReactNode[],
scale: number
): void {
const style = container.properties.dimensionOptions.selfMarginsDimensions;
const left = container.properties.margin.left;
if (left != null) {
const id = `dim-y-margin-left${yDim.toFixed(0)}-${container.properties.id}`;
const xStart = container.properties.x + currentTransform[0] - left;
const xEnd = xStart + left;
const text = left
.toFixed(0)
.toString();
RenderDimension(ctx, {
id,
xStart,
yStart: yDim,
xEnd,
yEnd: yDim,
text,
scale,
style
});
}
const right = container.properties.margin.right;
if (right != null) {
const id = `dim-y-margin-right${yDim.toFixed(0)}-${container.properties.id}`;
const xStart = container.properties.x + container.properties.width + currentTransform[0];
const xEnd = xStart + right;
const text = right
.toFixed(0)
.toString();
RenderDimension(ctx, {
id,
xStart,
yStart: yDim,
xEnd,
yEnd: yDim,
text,
scale,
style
});
}
}
function AddVerticalSelfMarginDimension(
ctx: CanvasRenderingContext2D,
xDim: number,
isRight: boolean,
container: IContainerModel,
currentTransform: [number, number],
scale: number
): void {
const style = container.properties.dimensionOptions.selfMarginsDimensions;
const top = container.properties.margin.top;
if (top != null) {
const idVert = `dim-x-margin-top${xDim.toFixed(0)}-${container.properties.id}`;
let yStart = container.properties.y + currentTransform[1];
let yEnd = yStart - top;
const textVert = top
.toFixed(0)
.toString();
if (isRight) {
[yStart, yEnd] = [yEnd, yStart];
}
RenderDimension(ctx, {
id: idVert,
xStart: xDim,
yStart,
xEnd: xDim,
yEnd,
text: textVert,
scale,
style
});
}
const bottom = container.properties.margin.bottom;
if (bottom != null) {
const idVert = `dim-x-margin-bottom${xDim.toFixed(0)}-${container.properties.id}`;
let yStart = container.properties.y + container.properties.height + bottom + currentTransform[1];
let yEnd = yStart - bottom;
const textVert = bottom
.toFixed(0)
.toString();
if (isRight) {
[yStart, yEnd] = [yEnd, yStart];
}
RenderDimension(ctx, {
id: idVert,
xStart: xDim,
yStart,
xEnd: xDim,
yEnd,
text: textVert,
scale,
style
});
}
}
function AddHorizontalSymbolDimension(
ctx: CanvasRenderingContext2D,
symbol: ISymbolModel,