diff --git a/zh-cn/application-dev/reference/apis/figures/zh-cn_image_0000001219864133.PNG b/zh-cn/application-dev/reference/apis/figures/zh-cn_image_0000001219864133.PNG
new file mode 100644
index 0000000000000000000000000000000000000000..eababe89d532f5e3f2bdd2e8d6449782054dc348
Binary files /dev/null and b/zh-cn/application-dev/reference/apis/figures/zh-cn_image_0000001219864133.PNG differ
diff --git a/zh-cn/application-dev/reference/apis/figures/zh-cn_image_0000001219864133.gif b/zh-cn/application-dev/reference/apis/figures/zh-cn_image_0000001219864133.gif
deleted file mode 100644
index 0befd736af77db15c203c4a5578929baf1d83e08..0000000000000000000000000000000000000000
Binary files a/zh-cn/application-dev/reference/apis/figures/zh-cn_image_0000001219864133.gif and /dev/null differ
diff --git a/zh-cn/application-dev/reference/apis/js-apis-matrix4.md b/zh-cn/application-dev/reference/apis/js-apis-matrix4.md
index f9ecc5fd80a19ddad7b183634264236ed4bdeee8..161e8faa251c171d1f9325d3351c203fec59c280 100644
--- a/zh-cn/application-dev/reference/apis/js-apis-matrix4.md
+++ b/zh-cn/application-dev/reference/apis/js-apis-matrix4.md
@@ -436,22 +436,34 @@ Matrix的坐标点转换函数,可以将当前的变换效果作用到一个
```ts
// xxx.ets
import matrix4 from '@ohos.matrix4'
-import prompt from '@system.prompt'
@Entry
@Component
struct Test {
- private matrix1 = matrix4.identity().transformPoint([100, 10])
-
+ private originPoint: [number, number] = [50, 50]
+ private matrix_1 = matrix4.identity().translate({ x: 150, y: -50 })
+ private transformPoint = this.matrix_1.transformPoint(this.originPoint)
+ private matrix_2 = matrix4.identity().translate({ x: this.transformPoint[0], y: this.transformPoint[1] })
+
build() {
Column() {
- Button("get Point")
- .onClick(() => {
- prompt.showToast({message:JSON.stringify(this.matrix1),duration:2000})
- }).backgroundColor(0x2788D9)
+ Text(`矩阵变换前的坐标:[${this.originPoint}]`)
+ .fontSize(16)
+ Image($r("app.media.image"))
+ .width('600px')
+ .height('300px')
+ .margin({ top: 50 })
+ Text(`矩阵变换前的坐标:[${this.transformPoint}]`)
+ .fontSize(16)
+ .margin({ top: 100 })
+ Image($r("app.media.image"))
+ .width('600px')
+ .height('300px')
+ .margin({ top: 50 })
+ .transform(this.matrix_2)
}.width("100%").padding(50)
}
}
```
-![zh-cn_image_0000001219864133](figures/zh-cn_image_0000001219864133.gif)
\ No newline at end of file
+![zh-cn_image_0000001219864133](figures/zh-cn_image_0000001219864133.PNG)
\ No newline at end of file
diff --git a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
index 6d5c486284ffed7402fd39e7d7b9e110f3eb1f5d..9e8b96e2d4eee263e5363ba27d6fec042c1d2232 100644
--- a/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
+++ b/zh-cn/application-dev/reference/arkui-ts/ts-basic-components-image.md
@@ -74,11 +74,11 @@ Image(src: string | PixelMap | Resource)
除支持[通用事件](ts-universal-events-click.md)外,还支持以下事件:
-| 名称 | 功能描述 |
-| ---------------------------------------- | ---------------------------------------- |
+| 名称 | 功能描述 |
+| ------------------------------------------------------------ | ------------------------------------------------------------ |
| onComplete(callback: (event?: { width: number, height: number, componentWidth: number,
componentHeight: number, loadingStatus: number }) => void) | 图片成功加载时触发该回调,返回成功加载的图片尺寸。
- width:图片的宽,单位为像素。
- height:图片的高,单位为像素。
- componentWidth:组件的宽,单位为像素。
- componentHeight:组件的高,单位为像素。
- loadingStatus:图片加载成功的状态。
|
-| onError(callback: (event?: { componentWidth: number, componentHeight: number , message9+: string }) => void) | 图片加载出现异常时触发该回调。
- componentWidth:组件的宽,单位为像素。
- componentHeight:组件的高,单位为像素。
|
-| onFinish(event: () => void) | 当加载的源文件为带动效的svg图片时,当svg动效播放完成时会触发这个回调,如果动效为无限循环动效,则不会触发这个回调。 |
+| onError(callback: (event?: { componentWidth: number, componentHeight: number , message9+: string }) => void) | 图片加载出现异常时触发该回调。
- componentWidth:组件的宽,单位为像素。
- componentHeight:组件的高,单位为像素。 |
+| onFinish(event: () => void) | 当加载的源文件为带动效的svg图片时,当svg动效播放完成时会触发这个回调,如果动效为无限循环动效,则不会触发这个回调。 |
## 示例
@@ -161,7 +161,7 @@ struct ImageExample1 {
```tsx
// @ts-nocheck
import http from '@ohos.net.http';
-import ResponseCode from '@ohos.net.http';
+import ResponseCode from '@ohos.net.http'
import image from '@ohos.multimedia.image'
@@ -176,7 +176,7 @@ struct Index {
Column({space: 10}) {
Button("获取网络图片")
.onClick(() => {
- this.httpRequest();
+ this.httpRequest()
})
Image(this.image).height(100).width(100)
}
@@ -187,7 +187,7 @@ struct Index {
// 网络图片请求方法
private httpRequest() {
- let httpRequest = http.createHttp();
+ let httpRequest = http.createHttp()
httpRequest.request(
"https://www.example.com/xxx.png", // 请填写一个具体的网络图片地址
@@ -207,7 +207,7 @@ struct Index {
this.image = pixelMap
})
} else {
- console.log("response code: " + code);
+ console.log("response code: " + code)
}
}
}
@@ -354,7 +354,7 @@ struct ImageExample3 {
```ts
import fileio from '@ohos.fileio'
-import fs from '@ohos.file.fs';
+import fs from '@ohos.file.fs'
import context from '@ohos.application.context'
@Entry