diff --git a/CHANGELOG.md b/CHANGELOG.md
index f76286c..06fd9ed 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,6 @@
+## 2.1.2-rc.8
+- onAreaChange绘制图片改为component Util绘制
+
 ## 2.1.2-rc.7
 - 修复图片圆角图形变换导致抗锯齿、ScaleType失效
 - 修复使用模糊化出现图片变模糊和变形
diff --git a/entry/oh-package.json5 b/entry/oh-package.json5
index 044ef96..9fbf348 100644
--- a/entry/oh-package.json5
+++ b/entry/oh-package.json5
@@ -4,7 +4,7 @@
   "name": "entry",
   "description": "example description",
   "repository": {},
-  "version": "2.1.2-rc.7",
+  "version": "2.1.2-rc.8",
   "dependencies": {
     "@ohos/libraryimageknife": "file:../sharedlibrary",
     "@ohos/sharedlibrary2": "file:../sharedlibrary2",
diff --git a/library/oh-package.json5 b/library/oh-package.json5
index 27a1eca..308fb82 100644
--- a/library/oh-package.json5
+++ b/library/oh-package.json5
@@ -14,7 +14,7 @@
   "main": "index.ets",
   "repository": "https://gitee.com/openharmony-tpc/ImageKnife",
   "type": "module",
-  "version": "2.1.2-rc.7",
+  "version": "2.1.2-rc.8",
   "dependencies": {
     "pako": "^2.1.0",
     "@ohos/disklrucache": "^2.0.2-rc.0",
diff --git a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets
index 0af972e..9381f99 100644
--- a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets
+++ b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets
@@ -26,7 +26,11 @@ import common from '@ohos.app.ability.common'
 import { ObjectKey } from './ObjectKey'
 import componentUtils from '@ohos.arkui.componentUtils'
 import inspector from '@ohos.arkui.inspector'
+import util from '@ohos.util'
 
+interface KeyCanvas {
+  keyId:string
+}
 @Component
 export struct ImageKnifeComponent {
   @Watch('watchImageKnifeOption') @ObjectLink imageKnifeOption: ImageKnifeOption;
@@ -47,6 +51,9 @@ export struct ImageKnifeComponent {
   // 抗锯齿属性
   private imageSmoothingQuality: ImageSmoothingQuality = 'low';
   private imageSmoothingEnabled: boolean = true;
+  @State keyCanvas: KeyCanvas = {
+    keyId: util.generateRandomUUID()
+  }
   defaultLifeCycle: IDrawLifeCycle = {
 
     // 展示占位图
@@ -94,12 +101,12 @@ export struct ImageKnifeComponent {
   private detachFromLayoutGIF :DetachFromLayout|undefined = undefined;
 
   private detachFromLayoutPixelMap :DetachFromLayout|undefined = undefined;
-  listener: inspector.ComponentObserver = inspector.createComponentObserver("ImageKnifeCanvas")
-  private value: componentUtils.ComponentInfo = componentUtils.getRectangleById("ImageKnifeCanvas")
+  listener: inspector.ComponentObserver = inspector.createComponentObserver(this.keyCanvas.keyId)
+  private value: componentUtils.ComponentInfo = componentUtils.getRectangleById(this.keyCanvas.keyId)
 
   build() {
     Canvas(this.context)
-      .key("ImageKnifeCanvas")
+      .key(this.keyCanvas.keyId)
       .width('100%')
       .height('100%')
       .renderFit(RenderFit.RESIZE_FILL)
@@ -126,7 +133,7 @@ export struct ImageKnifeComponent {
       })
   }
   onLayoutComplete:()=>void = ():void=>{
-    this.value = componentUtils.getRectangleById("ImageKnifeCanvas");
+    this.value = componentUtils.getRectangleById(this.keyCanvas.keyId);
     this.currentWidth = px2vp(this.value.size.width)
     this.currentHeight = px2vp(this.value.size.height)
     if (this.currentWidth <= 0 || this.currentHeight <= 0) {
diff --git a/oh-package.json5 b/oh-package.json5
index cdc54d5..e295e4e 100644
--- a/oh-package.json5
+++ b/oh-package.json5
@@ -6,6 +6,6 @@
   "name": "imageknife",
   "description": "example description",
   "repository": {},
-  "version": "2.1.2-rc.7",
+  "version": "2.1.2-rc.8",
   "dependencies": {}
 }