|
@@ -64,19 +64,25 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
set status(v: SItemStatus) {
|
|
|
this._status = v;
|
|
|
if (v == SItemStatus.Normal) {
|
|
|
+ // 处于正常态
|
|
|
this.moveable = true;
|
|
|
+ // 遍历文本 item 列表
|
|
|
this.textItemList.map(item => {
|
|
|
item.moveable = false;
|
|
|
});
|
|
|
this.img.moveable = false;
|
|
|
} else if (v == SItemStatus.Edit) {
|
|
|
+ // 处于编辑态
|
|
|
this.moveable = false;
|
|
|
+ // 遍历文本 item 列表
|
|
|
this.textItemList.map(item => {
|
|
|
item.moveable = true;
|
|
|
});
|
|
|
this.img.moveable = true;
|
|
|
} else if (v == SItemStatus.Create) {
|
|
|
+ // 处于创建态
|
|
|
this.moveable = true;
|
|
|
+ // 遍历文本 item 列表
|
|
|
this.textItemList.map(item => {
|
|
|
item.moveable = false;
|
|
|
});
|
|
@@ -94,16 +100,19 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
return this._showText;
|
|
|
}
|
|
|
set showText(v: boolean) {
|
|
|
+ // 显示状态没变,不执行改变
|
|
|
if (v === this._showText) {
|
|
|
return;
|
|
|
}
|
|
|
|
|
|
this._showText = v;
|
|
|
if (v) {
|
|
|
+ // 若显示,则遍历文本 item 列表,依次设置显示
|
|
|
this.textItemList.map(item => {
|
|
|
item.show();
|
|
|
});
|
|
|
} else {
|
|
|
+ // 若隐藏,则遍历文本 item 列表,依次设置隐藏
|
|
|
this.textItemList.map(item => {
|
|
|
item.hide();
|
|
|
});
|
|
@@ -121,10 +130,12 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
}
|
|
|
|
|
|
this._selected = value;
|
|
|
+ // 若选中,放大图片 item
|
|
|
if (value) {
|
|
|
this.img.scale = 1.25;
|
|
|
this.zOrder = ItemOrder.highLightOrder;
|
|
|
} else {
|
|
|
+ // 否则
|
|
|
this.img.scale = 1;
|
|
|
this.zOrder = ItemOrder.markOrder;
|
|
|
}
|
|
@@ -140,13 +151,17 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
set isActive(v: boolean) {
|
|
|
this._isActive = v;
|
|
|
if (v) {
|
|
|
+ // 激活状态
|
|
|
this.cursor = "pointer";
|
|
|
+ // 遍历文本 item 列表,设置小手
|
|
|
this.textItemList.map(item => {
|
|
|
item.cursor = "pointer";
|
|
|
});
|
|
|
this.img.cursor = "pointer";
|
|
|
} else {
|
|
|
+ // 非激活状态
|
|
|
this.cursor = "auto";
|
|
|
+ // 遍历文本 item 列表,设置默认鼠标状态
|
|
|
this.textItemList.map(item => {
|
|
|
item.cursor = "auto";
|
|
|
});
|
|
@@ -233,6 +248,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
} // Get color
|
|
|
set color(v: SColor) {
|
|
|
this._color = v;
|
|
|
+ // 遍历文本 item 列表,依次设置颜色
|
|
|
this.textItemList.forEach(item => {
|
|
|
item.color = v;
|
|
|
});
|
|
@@ -246,6 +262,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
} // Get font
|
|
|
set font(v: SFont) {
|
|
|
this._font = v;
|
|
|
+ // 遍历文本 item 列表,依次设置字体
|
|
|
this.textItemList.forEach((item: SBaseTextEdit, index: number) => {
|
|
|
item.font = v;
|
|
|
// item.moveTo(this.img.width * 0.5, v.size * (index - 0.125 - 0.5 * this.textItemList.length));
|
|
@@ -278,14 +295,17 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
/**
|
|
|
* 如果 data 设置;初始化data
|
|
|
*/
|
|
|
- initData() {
|
|
|
+ initData(): void {
|
|
|
+ // 数据不存在,不做处理
|
|
|
if (!this.data) return;
|
|
|
+ // size 属性存在
|
|
|
if (this.data.size) {
|
|
|
this.sWidth = this.data.size.width;
|
|
|
this.sHeight = this.data.size.height;
|
|
|
}
|
|
|
this.img.connect("onMove", this, this.changeAnchorPoint.bind(this));
|
|
|
const anchorPoint = [{ x: this.img.x, y: this.img.y, id: "" }];
|
|
|
+ // 生成锚点列表
|
|
|
this.anchorList = anchorPoint.map(t => {
|
|
|
let item = new SAnchorItem(this);
|
|
|
if (t.id) {
|
|
@@ -303,15 +323,19 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
this.data.style.default.textList
|
|
|
) {
|
|
|
const textList = this.data.style.default.textList;
|
|
|
+ // 存在文本列表
|
|
|
if (textList.length) {
|
|
|
const textItemList: any[] = [];
|
|
|
+ // 根据文本列表生成文本 item
|
|
|
textList.forEach((item: any, index: number) => {
|
|
|
let obj = new SBaseTextEdit(this, null);
|
|
|
obj.propertyData = item;
|
|
|
obj.text = item.text;
|
|
|
if (item.pos) {
|
|
|
+ // 如果存有位置
|
|
|
obj.moveTo(item.pos.x, item.pos.x);
|
|
|
} else {
|
|
|
+ // 没有位置,设置默认位置
|
|
|
obj.moveTo(
|
|
|
this.img.width * 0.5,
|
|
|
-(this.font.size * 1.25 * 0.5) + index * 10
|
|
@@ -353,6 +377,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
removeTextItem(index: number) {
|
|
|
let [delteItem] = this.textItemList.splice(index, 1);
|
|
|
if (this.scene) {
|
|
|
+ // 当前 item 场景中
|
|
|
this.scene.removeItem(delteItem);
|
|
|
}
|
|
|
} // Function removeTextItem
|
|
@@ -369,6 +394,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
{ x: this.img.x, y: this.img.y },
|
|
|
{ x: this.img.x, y: this.img.y }
|
|
|
];
|
|
|
+ // 目前四个锚点为同一个位置
|
|
|
this.anchorList.forEach((item, index) => {
|
|
|
item.moveTo(anchorPoint[index].x, anchorPoint[index].y);
|
|
|
});
|
|
@@ -391,9 +417,11 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
onMouseDown(event: SMouseEvent): boolean {
|
|
|
this.curTextItem = null;
|
|
|
if (this.status == SItemStatus.Normal) {
|
|
|
+ // 处于正常态
|
|
|
super.onMouseDown(event);
|
|
|
return true;
|
|
|
} else if (this.status == SItemStatus.Edit) {
|
|
|
+ // 处于编辑态
|
|
|
// @ts-ignore
|
|
|
const ce = SGraphItem.toChildMouseEvent(this, event);
|
|
|
return super.onMouseDown(ce);
|
|
@@ -409,6 +437,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
*/
|
|
|
onMouseUp(event: SMouseEvent): boolean {
|
|
|
if (this.status == SItemStatus.Edit) {
|
|
|
+ // 处于编辑态
|
|
|
return true;
|
|
|
}
|
|
|
super.onMouseUp(event);
|
|
@@ -434,9 +463,11 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
onDoubleClick(event: SMouseEvent): boolean {
|
|
|
// 如果位show状态 双击改对象则需改为编辑状态
|
|
|
if (SItemStatus.Normal == this.status) {
|
|
|
+ // 处于正常态
|
|
|
this.status = SItemStatus.Edit;
|
|
|
this.grabItem(this);
|
|
|
} else if (SItemStatus.Edit == this.status) {
|
|
|
+ // 处于编辑态
|
|
|
this.status = SItemStatus.Normal;
|
|
|
this.releaseItem();
|
|
|
}
|
|
@@ -455,6 +486,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
.boundingRect()
|
|
|
.adjusted(this.img.pos.x, this.img.pos.y, 0, 0);
|
|
|
if (this.showText) {
|
|
|
+ // 文本处于显示状态,需要将文本所占的区域计算进去
|
|
|
this.textItemList.forEach(item => {
|
|
|
rect = rect.unioned(
|
|
|
item.boundingRect().adjusted(item.pos.x, item.pos.y, 0, 0)
|
|
@@ -472,17 +504,17 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
onDraw(painter: SPainter): void {
|
|
|
const rect = this.boundingRect();
|
|
|
const lw = painter.toPx(1);
|
|
|
- // 编辑态和选中态出现绘制区域
|
|
|
if (this.status == SItemStatus.Edit || this.selected) {
|
|
|
- // doto 如果子元素被选中
|
|
|
+ // 编辑态和选中态出现绘制区域
|
|
|
+ // todo 如果子元素被选中
|
|
|
painter.pen.lineWidth = lw;
|
|
|
painter.pen.lineDash = [3 * lw, 7 * lw];
|
|
|
painter.pen.color = SColor.Black;
|
|
|
painter.brush.color = SColor.Transparent;
|
|
|
painter.drawRect(rect);
|
|
|
}
|
|
|
- // 编辑态出现四个角的圆点
|
|
|
if (this.status == SItemStatus.Edit) {
|
|
|
+ // 编辑态出现四个角的圆点
|
|
|
painter.pen.lineDash = [];
|
|
|
painter.brush.color = SColor.White;
|
|
|
painter.drawCircle(rect.x, rect.y, 5 * lw);
|
|
@@ -531,7 +563,9 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
* @return 相关数据
|
|
|
*/
|
|
|
toData(): any {
|
|
|
+ // 数据存在
|
|
|
if (this.data) {
|
|
|
+ // 数据中存在大小 size 属性
|
|
|
if (this.data.size) {
|
|
|
this.data.size.width = this.sWidth;
|
|
|
this.data.size.height = this.sHeight;
|
|
@@ -544,6 +578,7 @@ export class SBaseIconTextEdit extends SGraphEdit {
|
|
|
}
|
|
|
|
|
|
const anchorPoint = [{ x: this.img.x, y: this.img.y, id: "" }];
|
|
|
+ // 生成锚点 item
|
|
|
this.anchorList = anchorPoint.map(t => {
|
|
|
let item = new SAnchorItem(this);
|
|
|
if (t.id) {
|