Selaa lähdekoodia

图片item在未加载图片时显示虚线边框

zhangyu 5 vuotta sitten
vanhempi
commit
217f0c8c64
1 muutettua tiedostoa jossa 20 lisäystä ja 2 poistoa
  1. 20 2
      saga-web-graph/src/items/SImageItem.ts

+ 20 - 2
saga-web-graph/src/items/SImageItem.ts

@@ -1,5 +1,5 @@
 import { SObjectItem } from "./SObjectItem";
-import { SPainter, SRect, SSize } from "@saga-web/draw/lib";
+import { SPainter, SRect, SSize, SColor } from "@saga-web/draw/lib";
 import { SImageShowType } from "../enums/SImageShowType";
 import { SGraphItem } from "../SGraphItem";
 
@@ -22,6 +22,9 @@ export class SImageItem extends SObjectItem {
         this.update();
     }
 
+    /** 图片加载是否完成 */
+    isLoadOver: boolean = false;
+
     /** 图片地址 */
     private _url: string = "";
     get url(): string {
@@ -32,8 +35,14 @@ export class SImageItem extends SObjectItem {
         this.img = new Image();
         this.img.src = v;
         this.img.onload = (): void => {
+            this.isLoadOver = true;
             this.update();
         };
+        this.img.onerror = (e) => {
+            this.isLoadOver = false;
+            console.log("加载图片错误!");
+            console.log(e);
+        }
     }
 
     /**
@@ -77,7 +86,7 @@ export class SImageItem extends SObjectItem {
      * @param   painter      绘画类
      */
     onDraw(painter: SPainter): void {
-        if (this.img) {
+        if (this.isLoadOver) {
             // 要绘制图片的宽度
             let width: number = 0;
             // 要绘制图片的宽度
@@ -111,6 +120,15 @@ export class SImageItem extends SObjectItem {
                 height = this.height;
             }
             painter.drawImage(this.img, -width / 2, -height / 2, width, height);
+        } else {
+            painter.pen.lineWidth = painter.toPx(1);
+            painter.pen.lineDash = [
+                painter.toPx(3),
+                painter.toPx(7)
+            ];
+            painter.pen.color = new SColor("#c0ccda");
+            painter.brush.color = SColor.Transparent;
+            painter.drawRect(this.boundingRect());
         }
     } // Function onDraw()
 } // Class SImageItem