shaojiahao
/
ShangHaiYuan-AnXin
2
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity
Browse Source

1.0.12.20210125b

dev
徐振升 4 years ago
parent
e6c0c6c8b8
commit
45ffea9758
4 changed files with 132 additions and 104 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      .gitignore
  2. 4
      src/app/working-area/model/axSelection.ts
  3. 60
      src/app/working-area/model/axShape.ts
  4. 171
      src/app/working-area/working-area.component.ts

1
.gitignore vendored
Unescape View File

@ -44,3 +44,4 @@ testem.log
# System Files
.DS_Store
Thumbs.db
debug.log

4
src/app/working-area/model/axSelection.ts
Unescape View File

@ -13,6 +13,10 @@ export class AxSelection {
return null;
}
}
// 是否已经选择了对象
public has(obj: any): boolean {
return this.objects.has(obj);
}
// 获得所有对象
public all() {
return this.objects;

60
src/app/working-area/model/axShape.ts
Unescape View File

@ -20,6 +20,10 @@ export class AxShape extends Graphics {
showName = true;
// 边框
border: PIXI.Graphics = new PIXI.Graphics();
// 鼠标位置
mousePosition: PIXI.Point;
// 鼠标拖动
mouseDragging: boolean;
constructor(assetData: any, workingArea: WorkingAreaComponent) {
super();
@ -35,50 +39,30 @@ export class AxShape extends Graphics {
.on('pointerdown', event => {
event.stopPropagation();
if (this.selectable) {
this.workingArea.selectSingle(this);
this.workingArea.select(this);
}
if (this.moveable) {
event.currentTarget.data = event.data;
event.currentTarget.alpha = 0.5;
event.currentTarget.dragging = true;
event.currentTarget.dragPoint = event.data.getLocalPosition(event.currentTarget.parent);
event.currentTarget.dragPoint.x -= event.currentTarget.x;
event.currentTarget.dragPoint.y -= event.currentTarget.y;
this.mouseDragging = true;
this.mousePosition = new PIXI.Point(event.data.global.x, event.data.global.y);
}
})
.on('pointerup', event => {
if (event.currentTarget.dragging) {
event.currentTarget.alpha = 1;
event.currentTarget.dragging = false;
event.currentTarget.data = null;
}
this.mouseDragging = false;
})
.on('pointerupoutside', event => {
if (event.currentTarget.dragging) {
event.currentTarget.alpha = 1;
event.currentTarget.dragging = false;
event.currentTarget.data = null;
}
this.mouseDragging = false;
})
.on('pointermove', event => {
if (event.currentTarget.dragging) {
const newPosition = event.currentTarget.data.getLocalPosition(event.currentTarget.parent);
// const offsetX = newPosition.x - event.currentTarget.dragPoint.x;
// const offsetY = newPosition.y - event.currentTarget.dragPoint.y;
// const offset = this.workingArea.backgroundImage.toLocal(new Point(offsetX, offsetY));
// event.currentTarget.position += offset;
// // this.workingArea.selection.objects.forEach(shpae => {
// // shpae.x = newPosition.x - event.currentTarget.dragPoint.x;
// // shpae.y = newPosition.y - event.currentTarget.dragPoint.y;
// // shpae.assetData.Point = new PIXI.Point(this.x, this.y);
// // this.workingArea.canvasData.isChange = true;
// // })
event.currentTarget.x = newPosition.x - event.currentTarget.dragPoint.x;
event.currentTarget.y = newPosition.y - event.currentTarget.dragPoint.y;
this.assetData.Point = new PIXI.Point(this.x, this.y);
this.workingArea.canvasData.isChange = true;
if (this.mouseDragging) {
this.workingArea.selection.all().forEach(item => {
const x = event.data.global.x - this.mousePosition.x;
const y = event.data.global.y - this.mousePosition.y;
item.x += x * (1 / this.workingArea.backgroundImage.scale.x);
item.y += y * (1 / this.workingArea.backgroundImage.scale.y);
item.assetData.Point = new PIXI.Point(item.x, item.y);
this.workingArea.canvasData.isChange = true;
});
this.mousePosition = new PIXI.Point(event.data.global.x, event.data.global.y);
}
})
.on('rightclick', event => {
@ -127,9 +111,9 @@ export class AxShape extends Graphics {
this.border.lineStyle(scale * 1, 0x00a8ff);
let spaceLength = scale * 1;
let lineLenght = rect.width + 0.5 + 0.5;
let dashLength = scale * ( lineLenght + spaceLength - Math.floor((rect.width + rect.height) / 2 / 4.1)) / Math.floor((rect.width + rect.height) / 2 / 4.1);
const spaceLength = scale * 1;
const lineLenght = rect.width + 0.5 + 0.5;
const dashLength = scale * ( lineLenght + spaceLength - Math.floor((rect.width + rect.height) / 2 / 4.1)) / Math.floor((rect.width + rect.height) / 2 / 4.1);
this.drawDash(this.border, p1.x - 0.5 * scale, p1.y, p2.x + 0.5 * scale, p2.y, dashLength, spaceLength);
this.drawDash(this.border, p2.x, p2.y - 0.5 * scale, p3.x, p3.y + 0.5 * scale, dashLength, spaceLength);
this.drawDash(this.border, p3.x + 0.5 * scale, p3.y, p4.x - 0.5 * scale, p4.y, dashLength, spaceLength);

171
src/app/working-area/working-area.component.ts
Unescape View File

@ -151,7 +151,7 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* RC版: 该版本已经相当成熟了，基本上不存在导致错误的BUG，与即将发行的正式版相差无几。
* Release版: 该版本意味“最终版本”，在前面版本的一系列测试版之后，终归会有一个正式版本，是最终交付用户使用的一个版本。该版本有时也称为标准版。一般情况下，Release不会以单词形式出现在软件封面上，取而代之的是符号®。
*/
public VERSION = '1.0.11.20210122_beta';
public VERSION = '1.0.12.20210125_beta';
/**
* 数据初始化
*/
@ -174,14 +174,6 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.deleteSelectedShape();
}
});
// 消息系统事件监听
AxMessageSystem.addListener(CanvasAction.selectionChanged, () => {
this.selection.all().forEach(item => {
item.showBorder();
item.drawBorder(1 / this.backgroundImage.scale.x);
item.setPointVisiable(this.allowEdit);
});
}, this);
}
/**
* 删除选中的图标
@ -391,28 +383,6 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.rectToolGraphics.endFill();
}
});
/**
* 选中事件
*/
this.on('select', (axShape: AxShape) => {
// if (axShape instanceof AxRectangleShape) {
// let upLeft: PIXI.Sprite= new PIXI.Sprite(this.editorPointTexture);
// let upRight: PIXI.Sprite= new PIXI.Sprite(this.editorPointTexture);
// let downLeft: PIXI.Sprite= new PIXI.Sprite(this.editorPointTexture);
// let downRight: PIXI.Sprite = new PIXI.Sprite(this.editorPointTexture);
// } else {
axShape.showBorder();
axShape.drawBorder(1 / this.backgroundImage.scale.x);
axShape.setPointVisiable(this.allowEdit);
// }
});
/**
* 取消选中事件
*/
this.on('deselect', (axShape: AxShape) => {
axShape.hideBorder();
axShape.setPointVisiable(false);
});
/**
* 创建图标事件（数据处理）
*/
@ -451,12 +421,6 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.emit('canvasDataChanged');
this.canvasData.isChange = true;
});
/**
* 删除图标事件(数据处理)
*/
this.on('deleteIcon', (axShape: AxShape) => {
});
}
/**
* 重置画布
@ -517,18 +481,6 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
}
});
}
/**
* 设置选中
* 清空所有选择对象,选择ids集合元素
*/
public setHighlight(ids: string[]): void {
this.selection.clear();
ids.forEach(item => {
const obj = this.backgroundImage.getChildByName(item);
this.selection.add(obj);
});
AxMessageSystem.send('');
}
/**
* 创建楼层图形
*/
@ -842,22 +794,21 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
event.currentTarget.data = null;
if (this.rectToolGraphics.visible === true) {
const shapes: AxShape[] = [];
this.backgroundImage.children.forEach(item => {
if ( item instanceof AxImageShape
|| item instanceof MultipointIcon
|| item instanceof PolygonIcon
|| item instanceof AxArrowConnector) {
if ( item instanceof AxShape
&& item instanceof AxPreviewImageShape === false) {
// 判断2个矩形是否相交
const rect1 = this.rectToolGraphics.getBounds();
const rect2 = item.getBounds();
if (this.isOverlap(rect1, rect2)) {
this.selection.add(item);
shapes.push(item);
}
}
});
this.rectToolGraphics.clear();
this.rectToolGraphics.visible = false;
AxMessageSystem.send(CanvasAction.selectionChanged);
this.selectAll(shapes);
}
})
.on('pointerupoutside', event => {
@ -1303,12 +1254,13 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
* 粘贴
*/
public paste(companyId: string, buildingId: string, floorId: string): void {
const ids: string[] = [];
if (this.copyData.length > 0) {
this.copyData.forEach(item => {
item.Point = new PIXI.Point(item.Point.x + 5, item.Point.y + 5);
const newData = JSON.parse(JSON.stringify(item));
newData.Id = ObjectID.default.generate(),
newData.CompanyId = companyId;
newData.CompanyId = companyId;
newData.BuildingId = buildingId;
newData.FloorId = floorId;
newData.Point = new PIXI.Point(item.Point.x + 5, item.Point.y + 5);
@ -1335,9 +1287,9 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
}
break;
}
this.selection.add(this.backgroundImage.getChildByName(newData.Id));
ids.push(newData.Id);
});
AxMessageSystem.send(CanvasAction.selectionChanged);
this.setHighlight(ids);
}
}
//////////////////////////////////////////////////////////////////////// 通用/////////////////////////////////////////////////////////////////////////////
@ -1434,22 +1386,109 @@ export class WorkingAreaComponent extends EventEmitter implements OnInit, AfterV
this.setNameVisible(false, 0);
}
//////////////////////////////////////////////////////////////////// 选择逻辑
// 取消所有选择
/**
* 清空选择，选择单个形状
* @param shape 形状
*/
public selectSingle(shape: AxShape) {
if (this.selection.first() !== null) {
this.selection.all().forEach(item => {
this.clearSelectEffect(item);
});
this.selection.clear();
}
this.selection.add(shape);
this.setSelectEffect(shape);
AxMessageSystem.send(CanvasAction.selectionChanged);
}
/**
* 选择
* @param shape 形状
*/
public select(shape: AxShape) {
if (this.selection.first() !== null
&& !this.isCtrlKeyClicked
&& !this.selection.has(shape)) {
this.selection.all().forEach(item => {
this.clearSelectEffect(item);
});
this.selection.clear();
}
this.selection.add(shape);
this.setSelectEffect(shape);
AxMessageSystem.send(CanvasAction.selectionChanged);
}
/**
* 选择集合中的形状
* @param shape 形状集合
*/
public selectAll(shape: AxShape[]) {
this.selection.addArray(shape);
this.selection.all().forEach(item => {
this.setSelectEffect(item);
});
AxMessageSystem.send(CanvasAction.selectionChanged);
}
/**
* 先清空再选择全部
* @param shape 形状集合
*/
public selectAllWithClear(shape: AxShape[]) {
if (this.selection.first() !== null) {
this.selection.all().forEach(item => {
this.clearSelectEffect(item);
});
this.selection.clear();
}
this.selection.addArray(shape);
this.selection.all().forEach(item => {
this.setSelectEffect(item);
});
AxMessageSystem.send(CanvasAction.selectionChanged);
}
/**
* 选择集合中所有id的形状
* @param ids 形状id集合
*/
public setHighlight(ids: string[]): void {
const shapes: AxShape[] = [];
// 重新选择
ids.forEach(item => {
const obj = this.backgroundImage.getChildByName(item);
shapes.push(obj as AxShape);
});
this.selectAllWithClear(shapes);
}
/**
* 取消所有选择
*/
public deselectAll() {
if (this.selection.first() !== null) {
this.selection.all().forEach(item => {
item.hideBorder();
item.setPointVisiable(false);
this.clearSelectEffect(item);
});
this.selection.clear();
AxMessageSystem.send(CanvasAction.selectionChanged);
}
}
// 选择单个
public selectSingle(obj: any) {
this.deselectAll();
this.selection.add(obj);
AxMessageSystem.send(CanvasAction.selectionChanged);
/**
* 设置选中效果
* @param shape 形状
*/
public setSelectEffect(shape: AxShape) {
shape.hideBorder();
shape.setPointVisiable(false);
shape.showBorder();
shape.drawBorder(1 / this.backgroundImage.scale.x);
shape.setPointVisiable(this.allowEdit);
}
/**
* 设置形状选中效果
* @param shape 形状
*/
public clearSelectEffect(shape: AxShape) {
shape.hideBorder();
shape.setPointVisiable(false);
}
}
enum CanvasAction {

Write Preview
Loading…
Cancel
Save