1# ArkUI子系统Changelog 2 3## cl.arkui.1 CanvasRenderingContext2D的drawImage接口默认单位变更 4 5**访问级别** 6 7公开接口 8 9**变更原因** 10 11当drawImage传入9个参数时,若首个参数(image)为PixelMap类型,则第2至第5个参数(sx、sy、sw和sh)以px为单位进行解析。与文档描述不一致,且绘制得到的图片大小存在问题。 12 13**变更影响** 14 15该变更涉及应用适配。 16 17当drawImage传入9个参数时,且首个参数为PixelMap类型时: 18 19- 变更前:第2至第5个参数都会以px为单位进行解析。 20- 变更后:第2至第5个参数会以vp为单位进行解析。 21 22|| 变更前 | 变更后 | 23| :-: | :---------------------------------: | :-------------------------------: | 24| 第2至第5个参数以vp为单位传入 |  |  | 25| 第2至第5个参数以px为单位传入 |  |  | 26 27**起始API Level** 28 299 30 31**变更发生版本** 32 33从OpenHarmony SDK 5.1.0.48 版本开始。 34 35**变更的接口/组件** 36 37CanvasRenderingContext2D的drawImage接口 38 39**适配指导** 40 41变更后,使用drawImage接口时,若传入9个参数,且首个参数为PixelMap类型时,要注意第2至第5个参数会以vp为单位进行解析。 42 43**示例** 44 45```ts 46import { image } from '@kit.ImageKit' 47 48@Entry 49@Component 50struct Demo { 51 private settings: RenderingContextSettings = new RenderingContextSettings(true) 52 private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) 53 54 build() { 55 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 56 Canvas(this.context) 57 .width('100%') 58 .height('100%') 59 .onReady(() => { 60 let context = getContext(this) 61 let imageSourceApi = image.createImageSource(context.filesDir + "/view.jpg") 62 let pixelmap = imageSourceApi.createPixelMapSync(); 63 let imageInfo = pixelmap.getImageInfoSync() 64 let width = px2vp(imageInfo.size.width) 65 let height = px2vp(imageInfo.size.height) 66 this.context.drawImage(pixelmap, 0, 0, width, height, 50, 50, 250, 200) 67 this.context.drawImage(pixelmap, 0, 0, imageInfo.size.width, imageInfo.size.height, 50, 300, 250, 200) 68 }) 69 } 70 .width('100%') 71 .height('100%') 72 } 73} 74``` 75 76## cl.arkui.3 CanvasRenderingContext2D和Path2D未指定起始点时由默认(0, 0)为绘制起点变更为前两位参数作为绘制起点 77 78**访问级别** 79 80公开接口 81 82**变更原因** 83 84CanvasRenderingContext2D绘制路径时,如果没有使用moveTo方法指定路径起始点,会默认从画布左上角(0,0)开始绘制路径,与W3C行为不一致。 85 86**变更影响** 87 88变更前:CanvasRenderingContext2D绘制路径时,如果没有使用moveTo方法指定路径起始点,会默认从画布左上角(0,0)开始绘制路径。 89 90变更后:CanvasRenderingContext2D绘制路径时,如果没有使用moveTo方法指定路径起始点,会以第一个有效的路径绘制方法的前两位number参数作为路径起始点。 91 92| 接口 | 示例 | 变更前 | 变更后 | 93|---------|---------|---------|---------| 94| lineTo | context.lineTo(100, 100)<br>context.lineTo(200, 100) ||| 95| arcTo | context.arcTo(150, 20, 150, 70, 50) ||| 96| bezierCurveTo | context.bezierCurveTo(20, 100, 200, 100, 200, 20)||| 97| quadraticCurveTo | context.quadraticCurveTo(100, 100, 200, 20)||| 98 99**起始API Level** 100 101API 9 102 103**变更发生版本** 104 105从OpenHarmony 5.1.0.48 版本开始。 106 107**变更的接口/组件** 108 109CanvasRenderingContext2D的lineTo, arcTo, bezierCurveTo, quadraticCurveTo接口 110 111Path2D的lineTo, arcTo, bezierCurveTo, quadraticCurveTo接口 112 113**适配指导** 114 115如需路径起点从(0, 0)出发,可以在开始绘制路径后使用moveTo(0, 0)。 116 117```ts 118// xxx.ets 119@Entry 120@Component 121struct LineTo { 122 private settings: RenderingContextSettings = new RenderingContextSettings(true) 123 private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) 124 125 build() { 126 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 127 Canvas(this.context) 128 .width('100%') 129 .height('100%') 130 .backgroundColor('#ffff00') 131 .onReady(() =>{ 132 this.context.beginPath() 133 this.context.moveTo(0, 0) 134 this.context.lineTo(280, 160) 135 this.context.stroke() 136 }) 137 } 138 .width('100%') 139 .height('100%') 140 } 141} 142``` 143 144## cl.arkui.4 CanvasRenderingContext2D方法传NaN和Infinity值后执行的其他绘制方法由不绘制变更为正常绘制 145 146**访问级别** 147 148公开接口 149 150**变更原因** 151 152CanvasRenderingContext2D绘制路径时,若存在方法的number类型参数传入NaN或Infinity值,部分内容无法绘制或绘制异常,与Html5的行为不一致。 153 154**变更影响** 155 156变更前:绘制路径时,若存在路径方法的number类型参数传入NaN或Infinity值,整个路径无法绘制;对画布进行缩放、旋转、移动或使用变换矩阵进行图形变化时,number类型参数传入NaN或Infinity值,后面执行的方法无法绘制。 157 158变更后:绘制路径时,传入NaN或Infinity值的方法不做处理,根据有效的路径参数进行绘制;对画布进行缩放、旋转、移动或使用变换矩阵进行图形变化时,number类型参数传入NaN或Infinity值,其他传入有效参数的方法正常绘制。 159 160具体接口的差异如下: 161 162| 方法 | 变更前 | 变更后 | 163|---------|---------|---------| 164|moveTo|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 165|lineTo|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 166|bezierCurveTo|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 167|quadraticCurveTo|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 168|arc|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 169|ellipse|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 170|rect|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 171|arcTo|任一路径绘制方法的number类型参数传入NaN或Infinity值时,整个路径无法绘制。|路径绘制方法的number类型参数传入NaN或Infinity值时,该方法不生效。其他传入有效参数的路径绘制方法正常绘制。| 172|globalAlpha|绘制方法的number类型参数传入NaN或Infinity值,在该方法后执行的绘制方法无法绘制。|number类型参数传入NaN或Infinity值参数时该方法不生效。其他传入有效参数的绘制方法正常绘制。| 173|rotate|绘制方法的number类型参数传入NaN或Infinity值,在该方法后执行的绘制方法无法绘制。|number类型参数传入NaN或Infinity值参数时该方法不生效。其他传入有效参数的绘制方法正常绘制。| 174|scale|绘制方法的number类型参数传入NaN或Infinity值,在该方法后执行的绘制方法无法绘制。|number类型参数传入NaN或Infinity值参数时该方法不生效。其他传入有效参数的绘制方法正常绘制。| 175|transform|绘制方法的number类型参数传入NaN或Infinity值,在该方法后执行的绘制方法无法绘制。|number类型参数传入NaN或Infinity值参数时该方法不生效。其他传入有效参数的绘制方法正常绘制。| 176|setTransform|绘制方法的number类型参数传入NaN或Infinity值,在该方法后执行的绘制方法无法绘制。|number类型参数传入NaN或Infinity值参数时该方法不生效。其他传入有效参数的绘制方法正常绘制。| 177|translate|绘制方法的number类型参数传入NaN或Infinity值,在该方法后执行的绘制方法无法绘制。|number类型参数传入NaN或Infinity值参数时该方法不生效。其他传入有效参数的绘制方法正常绘制。| 178|lineDashOffset|设置了虚线样式的线条绘制出来是实线。|设置了虚线样式的线条绘制出来是虚线。| 179 180| 示例 | 变更前 | 变更后 | 181|---------|---------|---------| 182| context.moveTo(100, 100)<br>context.lineTo(NaN, 100)<br>context.lineTo(200, 200)<br>context.stroke() | 无绘制内容 |  | 183 184**起始API Level** 185 186API 9 187 188**变更发生版本** 189 190从OpenHarmony 5.1.0.48 版本开始。 191 192**变更的接口/组件** 193 194CanvasRenderingContext2D 195 196OffscreenCanvasRenderingContext2D 197 198Path2D 199 200**适配指导** 201 202默认行为变更,无需适配,但应注意变更后的行为是否对整体应用逻辑产生影响。