From 47defcfd53a33b80236f8d0e71b97fc5a4f9b3ab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=84=E8=AF=97=E6=B4=A5?= <2723065175@qq.com>
Date: Fri, 5 Nov 2021 02:59:50 +0000
Subject: [PATCH] =?UTF-8?q?!1687=20=E4=BC=98=E5=8C=96:=E5=8F=B3=E4=BE=A7?=
 =?UTF-8?q?=E6=9D=90=E8=B4=A8=E6=A0=8F=E5=B0=81=E9=9D=A2=E5=9B=BE=E7=89=87?=
 =?UTF-8?q?=E8=B7=9F=E9=9A=8F=E6=97=8B=E8=BD=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/UI/Components/Asset.tsx | 33 ++++++++++++++++-----------------
 1 file changed, 16 insertions(+), 17 deletions(-)

diff --git a/src/UI/Components/Asset.tsx b/src/UI/Components/Asset.tsx
index caabb4fe1..4a646cfeb 100644
--- a/src/UI/Components/Asset.tsx
+++ b/src/UI/Components/Asset.tsx
@@ -1,5 +1,4 @@
 import { ContextMenu, Menu, MenuItem } from '@blueprintjs/core';
-import { observable } from 'mobx';
 import { observer } from 'mobx-react';
 import React, { CSSProperties, DragEvent } from 'react';
 import * as xaop from 'xaop';
@@ -65,8 +64,7 @@ const TextStyle: CSSProperties = {
 @observer
 export class Asset extends React.Component<{ material: PhysicalMaterialRecord; }, {}>{
 
-    image: HTMLImageElement;
-    @observable imgUrl: string;
+    image = React.createRef<HTMLImageElement>();
     divColorRef = React.createRef<HTMLDivElement>();
     nameEl: HTMLDivElement;
     removeCall: Function[] = [];
@@ -81,15 +79,19 @@ export class Asset extends React.Component<{ material: PhysicalMaterialRecord; }
         this.renderIng = true;
 
         let material = this.props.material;
-        let imgUrl: string;
         if (material.useMap && material.map && material.map.Object)
-            imgUrl = await (material.map.Object as TextureTableRecord).Update();
+            await (material.map.Object as TextureTableRecord).Update();
         await material.Update();
+        MaterialRendererSingle().render(material.Material, (url: string) =>
+        {
+            if (this.image)
+                this.image.current.src = url;
+        });
 
-        this.imgUrl = imgUrl ?? "";
-
-        if (!this.imgUrl && this.divColorRef.current)
-            this.divColorRef.current.style.background = material.color;
+        if (!material.map)
+            this.divColorRef.current.style.border = "1px solid black";
+        else
+            this.divColorRef.current.style.border = "none";
 
         if (this.nameEl)
             this.nameEl.innerText = material.Name;
@@ -229,16 +231,13 @@ export class Asset extends React.Component<{ material: PhysicalMaterialRecord; }
                 }}
             >
                 <div
-                    style={{
-                        ...ImgStyle,
-                        border: this.imgUrl ? "none" : "1px solid black",
-                    }}
-                    onDragStart={this.handleStart}
-                    draggable={true}
+                    style={ImgStyle}
                     ref={this.divColorRef}
                 >
-                    {/* 因为空白的图片会导致拽拖失效,所以如果没有图片时,我们不绘制图片元素 */}
-                    {this.imgUrl && <img src={this.imgUrl} />}
+                    <img
+                        ref={this.image}
+                        onDragStart={this.handleStart}
+                    />
                 </div>
                 <div
                     style={TextStyle}