@meta2d/core
Version:
@meta2d/core: Powerful, Beautiful, Simple, Open - Web-Based 2D At Its Best .
593 lines (592 loc) • 16.4 kB
TypeScript
import { Point } from '../point';
import { Rect } from '../rect';
import { Event, RealTime, Trigger } from '../event';
import { Canvas } from '../canvas';
export declare enum PenType {
Node = 0,
Line = 1
}
export declare enum LockState {
None = 0,
DisableEdit = 1,
DisableMove = 2,
DisableScale = 3,//仅占位
DisableMoveScale = 4,
Disable = 10
}
export declare enum AnchorMode {
Default = 0,
In = 1,
Out = 2
}
export declare enum Gradient {
None = 0,// 没有渐变
Linear = 1,// 线性渐变
Radial = 2
}
export declare enum CanvasLayer {
CanvasTemplate = 1,//模版层
CanvasImageBottom = 2,//底部图片层
CanvasMain = 3,//主画布层
CanvasImage = 4
}
export declare const needCalcTextRectProps: string[];
export declare const needSetPenProps: string[];
export declare const needPatchFlagsPenRectProps: string[];
export declare const needCalcIconRectProps: string[];
export declare const needImgCanvasPatchFlagsProps: string[];
export interface ConnectLine {
lineId: string;
lineAnchor: string;
anchor: string;
}
export type TextAlign = 'left' | 'center' | 'right';
export type TextBaseline = 'top' | 'middle' | 'bottom';
export type WhiteSpace = 'nowrap' | 'pre-line' | 'break-all' | '';
export type IValue = Pen & Partial<ChartData> & Partial<Record<'tag' | 'newId', string>> & {
[key: string]: any;
};
export type Dropdown = string | IValue;
export declare enum LineAnimateType {
Normal = 0,// 水流
Beads = 1,// 水珠流动
Dot = 2,// 圆点
Arrow = 3,// 箭头,
WaterDrop = 4,// 水滴
Custom = 5
}
export declare enum lineAnimateTargetType {
Image = 0,// 图片
Icon = 1,// 图标
Pen = 2,// 画笔
Element = 3
}
export interface ColorStop {
i: number;
color: string;
}
export interface Pen extends Rect {
id?: string;
tags?: string[];
parentId?: string;
type?: PenType;
name?: string;
lineName?: string;
borderRadius?: number;
visible?: boolean;
locked?: LockState;
close?: boolean;
length?: number;
title?: string;
titleFnJs?: string;
titleFn?: (pen: Pen) => string;
titleUnUpdate?: boolean;
lineWidth?: number;
borderWidth?: number;
borderColor?: string;
globalAlpha?: number;
lineDash?: number[];
lineDashOffset?: number;
color?: string;
background?: string;
anchorColor?: string;
hoverAnchorColor?: string;
hoverColor?: string;
hoverBackground?: string;
activeColor?: string;
activeBackground?: string;
mouseDownValid?: boolean;
mouseDownColor?: string;
mouseDownBackground?: string;
bkType?: Gradient;
/**
* @deprecated 改用 gradientColors
*/
gradientFromColor?: string;
/**
* @deprecated 改用 gradientColors
*/
gradientToColor?: string;
/**
* @deprecated 改用 gradientColors
*/
gradientAngle?: number;
gradientRadius?: number;
strokeType?: Gradient;
/**
* @deprecated 改用 lineGradientColors
*/
lineGradientFromColor?: string;
/**
* @deprecated 改用 lineGradientColors
*/
lineGradientToColor?: string;
/**
* @deprecated 改用 lineGradientColors
*/
lineGradientAngle?: number;
gradientColors?: string;
switch?: boolean;
checked?: boolean;
onBackground?: string;
onGradientColors?: string;
lineGradientColors?: string;
lineCap?: CanvasLineCap;
fromLineCap?: CanvasLineCap;
toLineCap?: CanvasLineCap;
lineJoin?: CanvasLineJoin;
shadowColor?: string;
shadowBlur?: number;
shadowOffsetX?: number;
shadowOffsetY?: number;
textHasShadow?: boolean;
filter?: string;
placeholder?: string;
placeholderColor?: string;
text?: string;
textWidth?: number;
textHeight?: number;
textLeft?: number;
textTop?: number;
textColor?: string;
hoverTextColor?: string;
activeTextColor?: string;
fontFamily?: string;
fontSize?: number;
lineHeight?: number;
fontStyle?: string;
fontWeight?: string;
textAlign?: TextAlign;
textBaseline?: TextBaseline;
textBackground?: string;
whiteSpace?: WhiteSpace;
ellipsis?: boolean;
letterSpacing?: number;
image?: string;
icon?: string;
iconRotate?: number;
iconWidth?: number;
iconHeight?: number;
iconTop?: number;
iconLeft?: number;
iconColor?: string;
iconFamily?: string;
iconWeight?: string;
iconSize?: number;
iconAlign?: 'top' | 'bottom' | 'left' | 'right' | 'left-top' | 'right-top' | 'left-bottom' | 'right-bottom' | 'center';
imageRatio?: boolean;
disableInput?: boolean;
disableRotate?: boolean;
disableSize?: boolean;
disableAnchor?: boolean;
paddingTop?: number;
paddingBottom?: number;
paddingLeft?: number;
paddingRight?: number;
backgroundImage?: string;
strokeImage?: string;
children?: string[];
followers?: string[];
anchors?: Point[];
anchorVisible?: boolean;
anchorRadius?: number;
anchorBackground?: string;
pathId?: string;
path?: string;
fromArrow?: string;
toArrow?: string;
fromArrowSize?: number;
toArrowSize?: number;
fromArrowColor?: string;
toArrowColor?: string;
dirMarkers?: boolean;
dirMarkerInterval?: number;
dirMarkerColor?: string;
dirMarkerLineWidth?: number;
autoFrom?: boolean;
autoTo?: boolean;
connectedLines?: ConnectLine[];
animateCycle?: number;
nextAnimate?: string;
autoPlay?: boolean;
playLoop?: boolean;
duration?: number;
curveAnimate?: boolean;
linear?: boolean;
scale?: number;
animateSpan?: number;
animateColor?: string;
animateLineDash?: number[];
animateReverse?: boolean;
animateTimingFunction?: string[] | string;
keepAnimateState?: boolean;
lineAnimateElement?: string;
lineAnimateIcon?: string;
lineAnimateImages?: string[];
lineAnimatePens?: string;
lineAnimateDash?: number[] | string;
lineAnimateDashOffset?: number;
lineAnimateElementCount?: number;
lineAnimateType?: LineAnimateType | LineAnimateType[];
lineAnimateTargetType?: lineAnimateTargetType;
lineAnimateElementWidth?: number;
lineAnimateElementHeight?: number;
lineAnimateLoopMode?: boolean;
animateName?: string;
frames?: Pen[];
animateList?: Pen[][];
animateInterval?: number;
animateShadow?: boolean;
animateShadowColor?: string;
animateShadowBlur?: number;
input?: boolean;
readonly?: boolean;
autofocus?: boolean;
dropdownList?: Dropdown[];
dropdownBackground?: string;
dropdownColor?: string;
dropdownHoverColor?: string;
dropdownHoverBackground?: string;
events?: Event[];
iframe?: string;
video?: string;
audio?: string;
max?: number;
min?: number;
progress?: number;
progressColor?: string;
verticalProgress?: boolean;
reverseProgress?: boolean;
progressGradientColors?: string;
externElement?: boolean;
autoPolyline?: boolean;
affectByTheme?: boolean;
flipX?: boolean;
flipY?: boolean;
fillTexts?: string[];
hiddenText?: boolean;
keepDecimal?: number;
showChild?: number;
animateDotSize?: number;
isRuleLine?: boolean;
/**
* @deprecated 改用 canvasLayer
*/
isBottom?: boolean;
canvasLayer?: CanvasLayer;
form?: FormItem[];
lockedOnCombine?: LockState;
ratio?: boolean;
animateLineWidth?: number;
lineSmooth?: number;
gradientSmooth?: number;
scrolling?: string;
animations?: any[];
currentAnimation?: number;
realTimes?: RealTime[];
triggers?: Trigger[];
crossOrigin?: string;
imageRadius?: number;
textFlip?: boolean;
textRotate?: boolean;
rotateByRoot?: boolean;
textAutoAdjust?: boolean;
dbInput?: boolean;
operationalRect?: Rect;
blur?: number;
blurBackground?: string;
/**
* @deprecated 改用 canvasLayer
*/
template?: boolean;
thumbImg?: string;
apiUrl?: string;
apiMethod?: string;
apiHeaders?: any;
apiBody?: any;
apiEnable?: boolean;
sql?: string;
container?: boolean;
disabled?: boolean;
disabledColor?: string;
disabledBackground?: string;
disabledTextColor?: string;
inputType?: string;
productId?: string;
deviceId?: string;
pivot?: Point;
noOnBinds?: boolean;
interaction?: boolean;
childHover?: boolean;
childActive?: boolean;
draw?: boolean;
copyIndex?: number;
formId?: string;
formData?: any;
formKey?: string;
formValue?: string;
formType?: string;
className?: string;
styles?: any;
isDom?: boolean;
hoverCursor?: string;
roles?: string[];
calculative?: {
x?: number;
y?: number;
width?: number;
height?: number;
borderRadius?: number;
max?: number;
min?: number;
progress?: number;
progressColor?: string;
progressGradientColors?: string;
verticalProgress?: boolean;
worldRect?: Rect;
worldAnchors?: Point[];
worldIconRect?: Rect;
worldTextRect?: Rect;
textDrawRect?: Rect;
svgRect?: Rect;
initRect?: Rect;
prevFrameRect?: Rect;
initRelativeRect?: Rect;
childrenVisible?: any;
rotate?: number;
lineWidth?: number;
borderWidth?: number;
borderColor?: string;
globalAlpha?: number;
lineDash?: number[];
lineDashOffset?: number;
length?: number;
color?: string;
background?: string;
bkType?: number;
/**
* @deprecated 改用 gradientColors
*/
gradientFromColor?: string;
/**
* @deprecated 改用 gradientColors
*/
gradientToColor?: string;
/**
* @deprecated 改用 gradientColors
*/
gradientAngle?: number;
gradientRadius?: number;
strokeType?: Gradient;
/**
* @deprecated 改用 lineGradientColors
*/
lineGradientFromColor?: string;
/**
* @deprecated 改用 lineGradientColors
*/
lineGradientToColor?: string;
/**
* @deprecated 改用 lineGradientColors
*/
lineGradientAngle?: number;
shadowColor?: string;
shadowBlur?: number;
shadowOffsetX?: number;
shadowOffsetY?: number;
textHasShadow?: boolean;
tempText?: string;
text?: string;
textWidth?: number;
textHeight?: number;
textLeft?: number;
textTop?: number;
textColor?: string;
textType?: Gradient;
textGradientColors?: string;
fontFamily?: string;
fontSize?: number;
lineHeight?: number;
fontStyle?: string;
fontWeight?: string;
letterSpacing?: number;
textBackground?: string;
iconSize?: number;
icon?: string;
iconRotate?: number;
iconWidth?: number;
iconHeight?: number;
iconTop?: number;
iconLeft?: number;
iconColor?: string;
iconFamily?: string;
iconWeight?: string;
fontsChecked?: boolean;
paddingTop?: number;
paddingBottom?: number;
paddingLeft?: number;
paddingRight?: number;
textLines?: string[] | undefined;
textLineWidths?: number[];
image?: string;
img?: HTMLImageElement;
imgNaturalWidth?: number;
imgNaturalHeight?: number;
backgroundImage?: string;
strokeImage?: string;
backgroundImg?: HTMLImageElement;
strokeImg?: HTMLImageElement;
active?: boolean;
focus?: boolean;
hover?: boolean;
mouseDown?: boolean;
containerHover?: boolean;
isDock?: boolean;
pencil?: boolean;
activeAnchor?: Point;
patchFlags?: boolean;
visible?: boolean;
inView?: boolean;
drawlineH?: boolean;
hasImage?: boolean;
imageDrawed?: boolean;
/**
* @deprecated 改用 canvasLayer
*/
isBottom?: boolean;
canvasLayer?: CanvasLayer;
scale?: number;
start?: number;
duration?: number;
end?: number;
frameIndex?: number;
frameStart?: number;
frameEnd?: number;
frameDuration?: number;
animatePos?: number;
cycleIndex?: number;
cycleStart?: number;
pause?: number;
layer?: number;
canvas?: Canvas;
iframe?: string;
video?: string;
audio?: string;
media?: HTMLMediaElement;
flipX?: boolean;
flipY?: boolean;
h?: boolean;
hiddenText?: boolean;
keepDecimal?: number;
showChild?: number;
animateDotSize?: number;
zIndex?: number;
onended?: (pen: Pen) => void;
singleton?: any;
gradientColors?: string;
onBackground?: string;
onGradientColors?: string;
checked?: boolean;
lineGradientColors?: string;
gradient?: CanvasGradient;
lineGradient?: CanvasGradient;
radialGradient?: CanvasGradient;
gradientColorStop?: ColorStop[];
gradientTimer?: any;
animateLineWidth?: number;
lineSmooth?: number;
gradientSmooth?: number;
gradientAnimatePath?: Path2D;
cssDisplay?: string;
animations?: any[];
imageRadius?: number;
disabled?: boolean;
disabledColor?: string;
disabledBackground?: string;
disabledTextColor?: string;
};
lastConnected?: any;
textDecoration?: string;
textDecorationDash?: number[];
textDecorationColor?: string;
textStrickoutColor?: string;
textStrickoutDash?: number[];
textStrickout?: boolean;
prevFrame?: Pen;
onAdd?: (pen: Pen) => void;
onValue?: (pen: Pen) => void;
onBeforeValue?: (pen: Pen, value: ChartData) => any;
onDestroy?: (pen: Pen) => void;
onMove?: (pen: Pen) => void;
onResize?: (pen: Pen, raw?: boolean) => void;
onRotate?: (pen: Pen) => void;
onScale?: (pen: Pen) => void;
onClick?: (pen: Pen, e: Point) => void;
onMouseEnter?: (pen: Pen, e: Point) => void;
onMouseLeave?: (pen: Pen, e: Point) => void;
onMouseDown?: (pen: Pen, e: Point) => void;
onMouseMove?: (pen: Pen, e: Point) => void;
onMouseUp?: (pen: Pen, e: Point) => void;
onShowInput?: (pen: Pen, e: Point) => void;
onSetTheme?: (theme: string, config?: any) => void;
onInput?: (pen: Pen, text: string) => void;
onChangeId?: (pen: Pen, oldId: string, newId: string) => void;
onBinds?: (pen: Pen, values: IValue[], formItem: FormItem) => IValue;
onStartVideo?: (pen: Pen) => void;
onPauseVideo?: (pen: Pen) => void;
onStopVideo?: (pen: Pen) => void;
onRenderPenRaw?: (pen: Pen) => void;
onKeyDown?: (pen: Pen, key: string) => void;
onWheel?: (pen: Pen, e: WheelEvent) => void;
onContextmenu?: (pen: Pen, e: Point) => void;
setTheme?: (pen: Pen, styles: any) => void;
onConnectLine?: (line: Pen, e: {
lineAnchor: Point;
fromAnchor: Point;
line: Pen;
anchor: Point;
pen: Pen;
fromPen: Pen;
}) => void;
}
export interface FormItem {
key: string;
/**
* 单属性绑定单变量 或 绑定多变量
* 为数组时,顺序不重要
*/
dataIds?: BindId | BindId[];
}
export type BindId = {
dataId: string;
name: string;
};
/**
* 图表追加或替换数据,只关注数据
*/
export interface ChartData {
dataX: any | any[];
dataY: any | any[];
/**
* @deprecated 旧版本,未来移除该属性
*/
overwrite?: boolean;
}
/**
* dom 类型的 图形
*/
export declare const isDomShapes: string[];
/**
* 交互图元
*/
export declare const isInteraction: string[];
export declare const formatAttrs: Set<string>;
export declare const defaultFormat: {
textType: number;
bkType: number;
strokeType: number;
};
/**
* 清空 pen 的 生命周期
*/
export declare function clearLifeCycle(pen: Pen): void;