Explorar o código

modify canvas items's color

haojianlong %!s(int64=6) %!d(string=hai) anos
pai
achega
049fa5ef00

+ 12 - 5
src/assets/graphy/SGraphy/newItems/SGraphyCircleItem.ts

@@ -9,26 +9,31 @@ import { SPen, SPainter, SColor } from "@sybotan-web/draw";
  */
 export class SGraphyCircleItem extends SGraphyItem {
     r: number;
+    fillColor: SColor = SColor.White;
     color: SColor = SColor.Black;
     width: number = 1;
 
     /**
      * 构造函数
      *
-     * @param r    圆半径
-     * @param width   圆线的宽度
-     *
-     * @param color  圆线的颜色
+     * @param r          圆半径
+     * @param width      圆线的宽度
+     * @param color      圆线的颜色
+     * @param fillColor  圆填充的颜色
      * @param parent    
      */
     constructor(
         parent: SGraphyItem | null,
         r: number,
+        fillColor: SColor = SColor.White,
         color: SColor = SColor.Black,
         width: number = 1
     ) {
         super(parent);
         this.r = r;
+        this.color = color;
+        this.fillColor = fillColor;
+        this.width = width;
     } // Constructor()
 
     /**
@@ -52,7 +57,9 @@ export class SGraphyCircleItem extends SGraphyItem {
      * @param   rect          绘制区域
      */
     onDraw(painter: SPainter, rect: SRect): void {
-        painter.pen = new SPen(this.color, this.width);
+        // painter.pen = new SPen(new SColor("#FF0000"), 22);
+        painter.pen.color = this.color;
+        painter.brush.color = this.fillColor;
         painter.drawCircle(0, 0, this.r);
     }
 } // Class SGraphyCircleItem

+ 35 - 5
src/assets/graphy/SGraphy/newItems/SGraphyPolygonItem.ts

@@ -9,28 +9,48 @@ import { SPen, SPainter, SColor } from "@sybotan-web/draw";
  */
 export class SGraphyPolygonItem extends SGraphyItem {
 	pointArr: SPoint[];
+	fillColor: SColor = SColor.White;
 	color: SColor = SColor.Black;
 	width: number = 1;
+	businessId: number = 0;
+	centerOfGravityPoint: { x: number, y: number };
+	businessName: string = '';
+	isBusiness: number = 1;
+	actived: boolean = false; 				//是否激活
 
 	/**
 	 * 构造函数
 	 *
-	 * @param pointArr  点坐标list
-	 * @param width   线的宽度
-	 *
-	 * @param color  线的颜色
+	 * @param pointArr									点坐标list
+	 * @param width											边框的宽度
+	 * @param color											边框的颜色
+	 * @param fillColor   							多边形填充的颜色 
+	 * @param businessId								空间id
+	 * @param businessName							空间名称
+	 * @param centerOfGravityPoint			中心点
+	 * @param isBusiness								状态
 	 * @param parent    
 	 */
 	constructor(
 		parent: SGraphyItem | null,
 		pointArr: SPoint[],
+		centerOfGravityPoint: { x: number, y: number },
+		fillColor: SColor = SColor.White,
 		color: SColor = SColor.Black,
+		isBusiness: number = 1,
+		businessId?: number,
+		businessName?: string,
 		width: number = 1
 	) {
 		super(parent);
 		this.pointArr = pointArr;
+		this.fillColor = fillColor;
 		this.color = color;
 		this.width = width;
+		this.centerOfGravityPoint = centerOfGravityPoint;
+		this.isBusiness = isBusiness;
+		this.businessId = businessId as number;
+		this.businessName = businessName as string;
 	} // Constructor()
 
 	/**
@@ -108,8 +128,18 @@ export class SGraphyPolygonItem extends SGraphyItem {
 	 */
 	onDraw(painter: SPainter, rect: SRect): void {
 		if (this.pointArr.length) {
-			painter.pen = new SPen(this.color, this.width);
+			// painter.pen = new SPen(this.color, this.width);
+			painter.pen.color = this.color;
+			painter.brush.color = this.fillColor;
 			painter.drawPolygon(this.pointArr)
+			let text = ''
+			if (this.businessName || this.businessId) {
+				text = '👇   ' + this.businessName
+			} else {
+				text = '⬇️   ' + this.businessName
+			}
+			// painter.font = new SFont()
+			painter.drawText(text, this.centerOfGravityPoint.x, this.centerOfGravityPoint.y)
 		}
 	}
 } // Class SGraphyPolygonItem

+ 13 - 7
src/assets/graphy/SGraphy/newItems/SGraphyRectItem.ts

@@ -12,18 +12,20 @@ export class SGraphyRectItem extends SGraphyItem {
   startY: number;
   width: number;
   height: number;
+  fillColor: SColor = SColor.White;
   color: SColor = SColor.Black;
   isVirtual: boolean = false;
 	/**
 	 * 构造函数
 	 *
-	 * @param startX  线的起始x坐标
-   * @param startY  线的起始y坐标
-   * @param width   矩形的宽度
-   * @param height  矩形的宽度
-	 * @param color   矩形填充的颜色 
+	 * @param startX      线的起始x坐标
+   * @param startY      线的起始y坐标
+   * @param width       矩形的宽度
+   * @param height      矩形的宽度
+	 * @param color       矩形边框的颜色 
+	 * @param fillColor   矩形填充的颜色 
 	 * @param parent    
-   * @param isVirtual    是否为虚线
+   * @param isVirtual   是否为虚线
 	 */
   constructor(
     parent: SGraphyItem | null,
@@ -31,6 +33,7 @@ export class SGraphyRectItem extends SGraphyItem {
     startY: number,
     width: number,
     height: number,
+    fillColor: SColor = SColor.White,
     color: SColor = SColor.Black,
     isVirtual: boolean = false
   ) {
@@ -40,6 +43,7 @@ export class SGraphyRectItem extends SGraphyItem {
     this.width = width;
     this.height = height
     this.color = color;
+    this.fillColor = fillColor;
     this.isVirtual = isVirtual;
   } // Constructor()
 
@@ -64,7 +68,9 @@ export class SGraphyRectItem extends SGraphyItem {
 	 * @param   rect          绘制区域
 	 */
   onDraw(painter: SPainter, rect: SRect): void {
-    painter.pen = new SPen(this.color, this.width);
+    // painter.pen = new SPen(this.color, this.width);
+    painter.pen.color = this.color;
+    painter.brush.color = this.fillColor;
     painter.drawRect(this.startX,this.startY,this.width,this.height)
   }
 } // Class SGraphyRectItem

+ 11 - 5
src/assets/graphy/SGraphy/newItems/SGraphyWallItem.ts

@@ -10,21 +10,24 @@ import { SPen, SPainter, SColor } from "@sybotan-web/draw";
 export class SGraphyWallItem extends SGraphyItem {
 	pointArr: SPoint[];
 	isVirtual: boolean = false;
+	fillColor: SColor = SColor.White;
 	color: SColor = SColor.Black;
 	width: number = 1;
 	/**
 	 * 构造函数
 	 *
-	 * @param pointArr  点坐标list
-	 * @param isVirtual 墙类型(实体墙-虚拟墙)
-	 * @param color  墙的颜色
-	 * @param width   墙的宽度
+	 * @param pointArr  		点坐标list
+	 * @param isVirtual 		墙类型(实体墙-虚拟墙)
+	 * @param color  				墙的颜色
+	 * @param fillColor  		墙的填充颜色
+	 * @param width   			墙的宽度
 	 * @param parent    
 	 */
 	constructor(
 		parent: SGraphyItem | null,
 		pointArr: SPoint[],
 		isVirtual: boolean = false,
+		fillColor: SColor = SColor.White,
 		color: SColor = SColor.Black,
 		width: number = 1,
 	) {
@@ -32,6 +35,7 @@ export class SGraphyWallItem extends SGraphyItem {
 		this.isVirtual = isVirtual;
 		this.pointArr = pointArr;
 		this.color = color;
+		this.fillColor = fillColor;
 		this.width = width;
 	} // Constructor()
 
@@ -76,7 +80,9 @@ export class SGraphyWallItem extends SGraphyItem {
 	 */
 	onDraw(painter: SPainter, rect: SRect): void {
 		if (this.pointArr.length) {
-			painter.pen = new SPen(this.color, this.width);
+			// painter.pen = new SPen(this.color, this.width);
+			painter.pen.color = this.color;
+			painter.brush.color = this.fillColor;
 			painter.drawPolyline(this.pointArr)
 		}
 	}