!52 新增svg图片demo

Merge pull request !52 from LIUHAIK/master

entry/src/main/ets/pages/svgTestCasePage.ets

@@ -18,7 +18,8 @@ import {SVGParseImpl} from '@ohos/imageknife'
 @Component
 struct svgTestCasePage {
 
-  @State pixels:PixelMap = undefined
+  @State svgSamplePixelMap:PixelMap = undefined
+  @State svgIconPixelMap:PixelMap = undefined
 
   build() {
     Scroll() {
@@ -32,7 +33,7 @@ struct svgTestCasePage {
                   console.log('basicTestFileIOPage - 本地加载资源 解析后数据data = ' + data)
                   let svgImpl = new SVGParseImpl();
                   svgImpl.parseSvg(data.buffer).then((pixelmap)=>{
-                    this.pixels = pixelmap;
+                    this.svgSamplePixelMap = pixelmap;
                   })
                 })
                 .catch(err => {
@@ -46,7 +47,36 @@ struct svgTestCasePage {
 
         Text("下面为展示图片区域").margin({top:5})
         Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }){
-          Image(this.pixels)
+          Image(this.svgSamplePixelMap)
+            .width(400)
+            .height(400)
+            .backgroundColor(Color.Pink)
+        }.width(400).height(400).margin({top:10}).backgroundColor(Color.Pink)
+
+        Flex({direction:FlexDirection.Row}){
+          Button("加载SVG图片")
+            .onClick(()=>{
+
+              globalThis.ImageKnife.getImageKnifeContext().resourceManager.getMedia($r('app.media.iconsvg').id)
+                .then(data => {
+                  console.log('basicTestFileIOPage - 本地加载资源 解析后数据data = ' + data)
+                  let svgImpl = new SVGParseImpl();
+                  svgImpl.parseSvg(data.buffer).then((pixelmap)=>{
+                    this.svgIconPixelMap = pixelmap;
+                  })
+                })
+                .catch(err => {
+                  console.log('basicTestFileIOPage - 本地加载资源err' + JSON.stringify(err));
+                })
+
+            }).margin({left:5}).backgroundColor(Color.Blue)
+
+        }
+        .margin({top:15})
+
+        Text("下面为展示图片区域").margin({top:5})
+        Flex({direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }){
+          Image(this.svgIconPixelMap)
             .width(400)
             .height(400)
             .backgroundColor(Color.Pink)

entry/src/main/ets/pages/testGifLoadWithWorkerPage.ets

@@ -106,7 +106,7 @@ struct TestGifLoadWithWorkerPage {
 
             //主线程加载gif,阻塞toast的消失
             this.options = {
-              loadSrc: $r("app.media.honor"),
+              loadSrc: $r("app.media.test"),
             }
 
             Prompt.showToast({ message: '加载gif中,请稍等' })

entry/src/main/resources/base/media/iconsvg.svg

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="120"
+     height="120"
+     viewBox="0 0 120 120">
+    <g
+        fill="none"
+        fill-rule="evenodd">
+        <rect
+            width="120"
+            height="120"
+            fill="#EBF6FF"
+            rx="36"/>
+        <path
+            fill="#0D94FF"
+            d=""/>
+    </g>
+</svg>