diff --git a/CHANGELOG.md b/CHANGELOG.md
index 128fc0e..4e0b603 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@
 - 更新SDK到API12
 - 适配Sendable内存共享优化
 - 修改全局请求头覆盖request请求头
+- imageKnife支持heic测试demo独立页面展示
 
 ## 2.1.2-rc.12
 - 新增gif播放次数功能
diff --git a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets
index 0e38543..ff793cb 100644
--- a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets
+++ b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets
@@ -388,6 +388,14 @@ struct IndexFunctionDemo {
               router.pushUrl({ url: 'pages/testStopPlayingGifPage' });
             }).margin({ top: 5, left: 3 })
         }.width('100%').height(60).backgroundColor(Color.Pink)
+
+        Text('测试heic图片加载').fontSize(15)
+        Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
+          Button('测试heic')
+            .onClick(() => {
+              router.pushUrl({ url: 'pages/testImageKnifeHeic' });
+            }).margin({ top: 5, left: 3 })
+        }.width('100%').height(60).backgroundColor(Color.Pink)
       }
     }
     .width('100%')
diff --git a/entry/src/main/ets/pages/index.ets b/entry/src/main/ets/pages/index.ets
index 317c270..63f783a 100644
--- a/entry/src/main/ets/pages/index.ets
+++ b/entry/src/main/ets/pages/index.ets
@@ -44,16 +44,6 @@ struct IndexFunctionDemo {
       errorholderSrc: $r('app.media.icon_failed'),
       headerOption: [this.headerOptions1]
     };
-
-  @State imageKnifeOption3: ImageKnifeOption =
-    {
-      loadSrc: $r('app.media.yunHeic'),
-      placeholderSrc: $r('app.media.icon_loading'),
-      errorholderSrc: $r('app.media.icon_failed'),
-    };
-
-  @State flag: boolean = true;
-
   build() {
     Scroll() {
       Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
@@ -93,15 +83,6 @@ struct IndexFunctionDemo {
               router.pushUrl({ url: "pages/imageknifeTestCaseIndex" });
             }).margin({ top: 15 })
         }.width('100%').height(60).backgroundColor(Color.Pink)
-
-        Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
-          Button("heic图片测试")
-            .onClick(() => {
-              this.flag = !this.flag
-            }).margin({ top: 15 })
-          ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption3 }).width(300).height(300)
-            .visibility(this.flag ? Visibility.Hidden : Visibility.Visible)
-        }.width('100%').height(60).backgroundColor(Color.Pink)
       }
     }
     .width('100%')
diff --git a/entry/src/main/ets/pages/testImageKnifeHeic.ets b/entry/src/main/ets/pages/testImageKnifeHeic.ets
new file mode 100644
index 0000000..e5f72ff
--- /dev/null
+++ b/entry/src/main/ets/pages/testImageKnifeHeic.ets
@@ -0,0 +1,44 @@
+/*
+ * Copyright (C) 2022 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ImageKnifeComponent, ImageKnifeOption } from '@ohos/libraryimageknife'
+
+@Entry
+@Component
+struct testImageKnifeHeic {
+  @State imageKnifeOption1: ImageKnifeOption =
+    {
+      loadSrc: $r('app.media.yunHeic'),
+      placeholderSrc: $r('app.media.icon_loading'),
+      errorholderSrc: $r('app.media.icon_failed'),
+    };
+
+  @State flag: boolean = true;
+
+  build() {
+    Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
+      Button("heic图片测试")
+        .onClick(() => {
+          this.flag = !this.flag
+          if (this.flag) {
+            this.imageKnifeOption1.errorholderSrc = $r('app.media.icon_loading')
+          } else {
+            this.imageKnifeOption1.errorholderSrc = $r('app.media.icon_failed')
+          }
+        }).margin({ top: 15 })
+      ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(300).height(300)
+    }.width('100%').height(300).backgroundColor(Color.Pink)
+  }
+}
\ No newline at end of file
diff --git a/entry/src/main/resources/base/profile/main_pages.json b/entry/src/main/resources/base/profile/main_pages.json
index 45dd422..9992807 100644
--- a/entry/src/main/resources/base/profile/main_pages.json
+++ b/entry/src/main/resources/base/profile/main_pages.json
@@ -52,6 +52,7 @@
     "pages/testImageKnifeCache",
     "pages/webpImageTestPage",
     "pages/testStopPlayingGifPage",
-    "pages/testImageKnifeDataFetch"
+    "pages/testImageKnifeDataFetch",
+    "pages/testImageKnifeHeic"
   ]
 }
\ No newline at end of file