/*
* *********************************************************************************************************************
*
* !!
* .F88X
* X8888Y
* .}888888N;
* i888888N; .:! .I$WI:
* R888888I .'N88~ i8}+8Y&8"l8i$8>8W~'>W8}8]KW+8IIN"8&
* .R888888I .;N8888~ .X8' "8I.!,/8" !%NY8`"8I8~~8>,88I
* +888888N; .8888888Y "&&8Y.}8,
* ./888888N; .R888888Y .'}~ .>}'.`+> i}! "i' +/' .'i~ !11,.:">, .~]! .i}i
* ~888888%: .I888888l .]88~`1/iY88Ii+1'.R$8$8]"888888888> Y8$ W8E X8E W8888'188Il}Y88$*
* 18888888 E8888881 .]W%8$`R8X'&8%++N8i,8N%N8+l8%` .}8N:.R$RE%N88N%N$K$R 188,FE$8%~Y88I
* .E888888I .i8888888' .:$8I;88+`E8R:/8N,.>881.`$8E/1/]N8X.Y8N`"KF&&FK!'88*."88K./$88%RN888+~
* 8888888I .,N888888~ ~88i"8W,!N8*.I88.}888%F,i$88"F88" 888:E8X.>88!i88>`888*.}Fl1]*}1YKi'
* i888888N' I888Y ]88;/EX*IFKFK88X K8R .l8W 88Y ~88}'88E&%8W.X8N``]88!.$8K .:W8I
* .i888888N; I8Y .&8$ .X88! i881.:%888>I88 ;88] +88+.';;;;:.Y88X 18N.,88l .+88/
* .:R888888I
* .&888888I Copyright (c) 2016-2020. 博锐尚格科技股份有限公司
* ~8888'
* .!88~ All rights reserved.
*
* *********************************************************************************************************************
*/
import { SPainter, SRect, SColor, SFont, SPoint, SSize } from "@persagy-web/draw";
import { SGraphItem, STextOrigin, SLineStyle, SAnchorItem } from "@persagy-web/graph/";
import { SItemStatus } from "@persagy-web/big";
import { SGraphEdit } from ".."
import { Marker } from "../type/Marker";
import { ItemOrder } from '@persagy-web/big/lib';
import { SMouseEvent } from '@persagy-web/base/lib';
/**
* 文本编辑类
*
* @author 韩耀龙 <han_yao_long@163.com>
*/
export class SBaseTextEdit extends SGraphEdit {
/////////////////////////////////////////////////////////////////////////////////////////////////////////////
//属性
/**编辑相关操作的数据 */
data: Marker | null = null;
/** 存储相关的信息数据 */
propertyData: any
/** 起始锚点 */
startItem: SGraphItem | null = null;
/** 结束锚点 */
endItem: SGraphItem | null = null;
/** 编辑状态 */
protected _status: SItemStatus = SItemStatus.Normal;
get status(): SItemStatus {
return this._status;
} //Get status
set status(value: SItemStatus) {
const oldStatus = this._status;
const newStatus = value;
this._status = value;
//状态变更触发事件
this.$emit('StatusChange', oldStatus, newStatus)
this.update();
} //Set status
/** 记录 painter */
private _painter: SPainter | null = null;
/** 文本内容 */
private _text: string = "";
get text(): string {
return this._text;
} //Get text
set text(v: string) {
this._text = v;
this._textArr = this.text.split(/\n/g);
this.drawFormatText();
this.update();
} //Set text
/** 切割后的文本数组 */
private _textArr: string[] = [];
/** 锚点 list */
anchorList: SAnchorItem[] = [];
/** 宽度 */
private _width: number = 64;
get width(): number {
return this._width;
} //Get width
set width(v: number) {
if (v > 0) {
if (v != this._width) {
let w = this._width;
this._width = v;
this.onResize(
new SSize(w, this._height),
new SSize(this._width, this._height)
);
}
}
} //Set width
/** 高度 */
private _height: number = 64;
get height(): number {
return this._height;
} //Get height
set height(v: number) {
if (v > 0) {
if (v != this._height) {
let h = this._height;
this._height = v;
this.onResize(
new SSize(this._width, h),
new SSize(this._width, this._height)
);
}
}
} //Set height
/** 原点 */
origin = new SPoint();
/** 文本颜色 */
private _color: SColor = new SColor("#333333");
get color(): SColor {
return this._color;
} //Get color
set color(v: SColor) {
this._color = v;
this.update();
} //Set color
/** 字体 */
private _font: SFont = new SFont("sans-serif", 12);
get font(): SFont {
return this._font;
} //Get font
set font(v: SFont) {
this._font = v;
this.drawFormatText();
this.update();
} //Set font
/** 背景色 */
private _backgroundColor: SColor = SColor.Transparent;
get backgroundColor(): SColor {
return this._backgroundColor;
} //Get backgroundColor
set backgroundColor(v: SColor) {
this._backgroundColor = v;
this.update();
} //Set backgroundColor
/** 边框色 */
private _strokeColor: SColor = SColor.Transparent;
get strokeColor(): SColor {
return this._strokeColor;
} //Get strokeColor
set strokeColor(v: SColor) {
this._strokeColor = v;
this.update();
} //Set strokeColor
/** 边框宽度 */
private _lineWidth: number = 1;
get lineWidth(): number {
return this._lineWidth;
} //Get lineWidth
set lineWidth(v: number) {
this._lineWidth = v;
this.update();
} //Set lineWidth
/** 边框样式 */
private _borderStyle: SLineStyle = SLineStyle.None;
get borderStyle(): SLineStyle {
return this._borderStyle;
} //Get borderStyle
set borderStyle(v: SLineStyle) {
this._borderStyle = v;
this.update();
} //Set borderStyle
/** 原点位置 */
private _originPosition: STextOrigin = STextOrigin.LeftTop;
get originPosition(): STextOrigin {
return this._originPosition;
} //Get originPosition
set originPosition(v: STextOrigin) {
this._originPosition = v;
this.update();
} //Set originPosition
/** 文本绘制最大宽 */
maxWidth: number | undefined = undefined;
/**
* 构造函数
*
* @param parent 指向父 Item
* @param data 文本数据
*/
constructor(parent: SGraphItem | null, data: Marker | null) {
super(parent);
if (data) {
this.initData(data)
}
} // Constructor
/**
* 初始化 当data传入时设置相关状态
*
* @param data Mark 数据
*/
initData(data: Marker) {
this.showSelect = false;
this.zOrder = ItemOrder.textOrder;
this.isTransform = false;
this.data = data;
this.name = data.name;
this.moveTo(data.pos.x, data.pos.y);
if (data.size) {
this.width = data.size.width;
this.height = data.size.height;
}
if (data.style && data.style.default) {
// 高度
if (data.style.default.zorder) {
this.zOrder = data.style.default.zorder;
}
// 文本
if (data.style.default.text) {
this.text = data.style.default.text;
}
// 文本颜色
if (data.style.default.strokeColor) {
this.strokeColor = new SColor(data.style.default.strokeColor);
}
// 字体大小
if (data.style.default.font) {
this.font = new SFont("sans-serif", data.style.default.font);
}
// 背景色
if (data.style.default.backgroundColor) {
this.backgroundColor = new SColor(data.style.default.backgroundColor);
}
}
}
/**
* 宽高发发生变化
*
* @param oldSize 改之前的大小
* @param newSize 改之后大小
*/
protected onResize(oldSize: SSize, newSize: SSize) { } // Function onResize()
/**
* 对象边界区域
*
* @return 边界区域
*/
boundingRect(): SRect {
return new SRect(
-this.origin.x,
-this.origin.y,
this.width,
this.height
);
} // Function boundingRect()
/**
* 移动后处理所有坐标,并肩原点置为场景原点
*
* @param x x 坐标
* @param y y 坐标
*/
// moveToOrigin(x: number, y: number): void {
// this.moveTo(this.x + x, this.y + y);
// } // Function moveToOrigin()
/**
* 鼠标按下事件
*
* @param event 保存事件参数
* @return 是否处理事件
*/
onMouseDown(event: SMouseEvent): boolean {
this.$emit('textSelect')
super.onMouseDown(event);
return this.moveable;
} // Function onMouseDown()
/**
* 释放鼠标事件
*
* @param event 保存事件参数
* @return 是否处理事件
*/
onMouseUp(event: SMouseEvent): boolean {
super.onMouseUp(event);
return this.moveable;
} // Function onMouseUp()
/**
* 绘制显示状态文本 Item
*
* @param painter 绘制类
*/
protected drawShowText(painter: SPainter): void {
painter.translate(-this.origin.x, -this.origin.y);
//绘制矩形轮廓
if (this.selected) {
painter.shadow.shadowBlur = 10;
painter.shadow.shadowColor = new SColor(`#00000033`);
painter.shadow.shadowOffsetX = 5;
painter.shadow.shadowOffsetY = 5;
} else {
painter.shadow.shadowColor = SColor.Transparent;
}
painter.brush.color = this.backgroundColor;
painter.pen.lineWidth = this.lineWidth;
painter.pen.color = this.strokeColor;
painter.drawRect(0, 0, this.width, this.height);
//绘制文本
painter.brush.color = new SColor(this.color);
painter.shadow.shadowColor = SColor.Transparent;
painter.font = this.font;
this._textArr.forEach((text: string, index: number) => {
painter.drawText(
text,
this.font.size / 4,
index * (this.font.size * 1.25) + this.font.size / 4,
this.maxWidth
);
});
} // Function drawShowText()
/**
* 根据换行切割文本,绘制多行并计算外轮廓宽高
*/
protected drawFormatText(): void {
if (this._painter instanceof SPainter) {
this._painter.save();
this._painter.font = this.font;
let textMaxWidth = 0;
let fontSize: number = this.font.size;
this._textArr.forEach((text: string, index: number) => {
let textWidth: number = this._painter
? this._painter.textWidth(text) + fontSize / 2
: fontSize / 2;
if (textWidth > textMaxWidth) {
textMaxWidth = textWidth;
}
});
// 在绘制文本后计算文本的宽高
this.width = textMaxWidth;
this.height = fontSize * 1.25 * this._textArr.length + fontSize / 8;
// 设置原点位置(默认左上角)
if (this.originPosition == STextOrigin.Center) {
this.origin = new SPoint(this.width / 2, this.height / 2);
}
this._painter.restore();
}
} // Function drawFormatText()
/**
* 返回对象储存的相关数据
*
* @return 对象储存的相关数据
*/
toData(): any {
if (this.data.size) {
this.data.size.width = this.width;
this.data.size.height = this.height;
}
this.data.pos.x = this.pos.x;
this.data.pos.y = this.pos.y;
this.data.style.default.zorder = this.zOrder;
this.data.style.default.text = this.text;
this.data.style.default.strokeColor = this.strokeColor.value;
this.data.style.default.font = this.font.size;
this.data.style.default.backgroundColor = this.backgroundColor.value;
return this.data;
} // Function toData()
/**
* Item 绘制操作
*
* @param painter 绘画类
*/
onDraw(painter: SPainter): void {
if (!(this._painter instanceof SPainter)) {
this._painter = painter;
this.drawFormatText();
}
this.drawShowText(painter);
} // Function onDraw()
} // Class SBaseTextEdit