1# ArkUI子系统Changelog 2 3## cl.arkui.1 Slider支持设置触控反馈(声音和振动)效果 4 5**访问级别** 6 7公开接口 8 9**变更原因** 10 11UX规范变更。 12 13**变更影响** 14 15此变更涉及应用适配。 16 17- 变更前:Slider组件无触控反馈(声音和振动)效果。 18 19- 变更后:Slider组件在显示刻度时,滑块在滑动过程中经过刻度会触发触控反馈(声音和振动)效果;在无极滑动模式下,滑块滑动到两侧边缘也会触发触控反馈(声音和振动)效果。 20 21**起始API Level** 22 237 24 25**变更发生版本** 26 27从OpenHarmony SDK 5.1.0.52开始。 28 29**适配指导** 30 31Slider 默认支持触控反馈(声音和振动)效果,此变更为系统变更,建议保持现状,开发者无需适配,如果开发者想关闭触控反馈效果,可以通过为Slider组件设置 enableHapticFeedback(false) 来关闭此效果。如下代码实现: 32```ts 33@Entry 34@Component 35struct SlideExample { 36 build() { 37 Row() { 38 Column() { 39 Slider() 40 .enableHapticFeedback(false) 41 42 Slider({ 43 step: 10, 44 }) 45 .showSteps(true) 46 .enableHapticFeedback(false) 47 }.width('100%') 48 }.height('100%') 49 } 50} 51``` 52 53## cl.arkui.2 NavDestination标题栏工具栏支持跟手滑动隐藏后,超过2秒未操作,不恢复显示 54 55**访问级别** 56 57公开接口 58 59**变更原因** 60 61UX规范变更。 62 63**变更影响** 64 65此变更不涉及应用适配。 66 67- 变更前:NavDestination组件的标题栏工具栏上滑隐藏,下滑显示,2s不操作后自动显示。 68 69- 变更后:NavDestination组件的标题栏工具栏上滑隐藏,下滑显示,2s不操作后不会自动显示。 70 71**起始API Level** 72 7314 74 75**变更发生版本** 76 77从OpenHarmony SDK 5.1.0.52开始。 78 79**变更的接口/组件** 80 81NavDestination.bindToScrollable, NavDestination.bindToNestedScrollable 82 83**适配指导** 84 85默认行为变更,无需适配。 86 87## cl.arkui.3 Tabs组件TabBar的显示和隐藏动效变更 88 89**访问级别** 90 91公开接口 92 93**变更原因** 94 95UX规范变更。 96 97**变更影响** 98 99此变更不涉及应用适配。 100 101- 变更前:Tabs组件的TabBar上滑隐藏,下滑显示,2s不操作后自动显示。 102 103- 变更后:Tabs组件的TabBar上滑隐藏,下滑显示,2s不操作后不会自动显示。 104 105**起始API Level** 106 10713 108 109**变更发生版本** 110 111从OpenHarmony SDK 5.1.0.52开始。 112 113**变更的接口/组件** 114 115UIContext的bindTabsToScrollable、bindTabsToNestedScrollable接口 116 117**适配指导** 118 119默认行为变更,无需适配。 120 121## cl.arkui.4 页面退出场景自定义组件删除前移 122 123**访问级别** 124 125公开接口 126 127**变更原因** 128 129在页面退出动画的过程中,UI处于空闲状态。动画结束后,由于释放大量组件导致页面卡顿。可以将页面中自定义组件的释放提前,显著减轻卡顿并优化性能。 130 131**变更影响** 132 133此变更不涉及应用适配,仅针对Router和Navigation页面默认的退出动画场景。 134 135- 变更前:页面退出动画结束后,依次执行自定义组件生命周期aboutToDisappear、onDisappear。 136 137- 变更后:页面退出动画过程中,执行自定义组件生命周期aboutToDisappear。退出动画执行结束后,执行生命周期onDisappear。 138 139**起始API Level** 140 1417 142 143**变更发生版本** 144 145从OpenHarmony SDK 5.1.0.52开始。 146 147**变更的接口/组件** 148 149自定义组件的onDisappear生命周期回调。 150 151**适配指导** 152 153默认行为变更,无需适配。 154 155## cl.arkui.5 修复fromHtml接口解析颜色rgb顺序错误的问题 156 157**访问级别** 158 159公开接口 160 161**变更原因** 162 163接口行为与实际规格不符。 164 165**变更影响** 166 167此变更不涉及应用适配。 168 169- 变更前:对于Html代码中的以`#rrggbb`样式表示的颜色,通过fromHtml转换出的属性字符串的字体颜色为`#bbrrgg`。比如html代码中span的颜色为`#0000FF`,转换出的属性字符串的字体颜色为`#FF0000`。 170 171- 变更后:对于Html代码中的以`#rrggbb`样式表示的颜色,通过fromHtml转换出的属性字符串的字体颜色为`#rrggbb`。比如html代码中span的颜色为`#0000FF`,转换出的属性字符串的字体颜色为`#0000FF`。 172 173**起始API Level** 174 17512 176 177**变更发生版本** 178 179从OpenHarmony SDK 5.1.0.52开始,API version 18及以上生效。 180 181**变更的接口/组件** 182 183属性字符串的fromHtml接口。 184 185**适配指导** 186 187此变更不涉及应用适配。 188 189## cl.arkui.6 C API轴事件接口OH_ArkUI_UIInputEvent_GetSourceType和OH_ArkUI_UIInputEvent_GetToolType接口返回值变更 190 191**访问级别** 192 193公开接口 194 195**变更原因** 196 197通过鼠标滚轮或触控板触发的轴事件无法正确获取到触发源设备类型。 198 199**变更影响** 200 201此变更涉及应用适配。 202 203- 变更前:在使用鼠标滚轮或触控板的双指滑动操作时,应用程序无法通过OH_ArkUI_UIInputEvent_GetSourceType和OH_ArkUI_UIInputEvent_GetToolType准确获取触发源的类型,返回值为UNKNOWN。 204 205- 变更后:在使用鼠标滚轮或触控板的双指滑动操作时,应用程序可以通过调用OH_ArkUI_UIInputEvent_GetSourceType和OH_ArkUI_UIInputEvent_GetToolType来获取正确的触发源类型。对于鼠标滚轮操作,获取的SourceType和ToolType均为MOUSE;而针对触控板操作,虽然得到的SourceType仍为MOUSE,但ToolType为TOUCHPAD。 206 207**起始API Level** 208 20915 210 211**变更发生版本** 212 213从OpenHarmony SDK 5.1.0.52开始。 214 215**适配指导** 216 217当应用程序通过native_interface_xcomponent.h中的OH_NativeXComponent_RegisterUIInputEventCallback接口来接收和处理轴事件时,如果回调函数中已使用ToolType类型进行了判断,则无需进一步适配。但如果仅通过UNKNOWN类型处理业务,则需适配,以确保通过具体的目标类型进行区分。 218例如以下示例: 219```cpp 220if (toolType != UI_INPUT_EVENT_TOOL_TYPE_UNKNOWN) { 221 // 应用业务逻辑 222} 223``` 224建议以明确的目标类型进行区分,修改为如下代码实现: 225```cpp 226if (toolType != UI_INPUT_EVENT_TOOL_TYPE_MOUSE) { // 是鼠标滚轮尝试的轴事件,数值单位为角度 227 // 鼠标滚轮只有竖向轴,获取滚动角度 228 double degree = OH_ArkUI_AxisEvent_GetVerticalAxisValue(event); 229 // 将角度映射为距离像素值 230 // 控制UI进行位移更新 231} else if (toolType != UI_INPUT_EVENT_TOOL_TYPE_TOUCHPAD) { 232 // 触控板上操作,用户即可横向滑动,也可竖向滑动,需要都获取分量 233 double offsetX = OH_ArkUI_AxisEvent_GetHorizontalAxisValue(event); 234 double offsetY = OH_ArkUI_AxisEvent_GetVerticalAxisValue(event); 235 if (offsetX == 0) { 236 // 横向分量为0,说明为竖向滑动 237 // 处理UI竖向滑动 238 } else { 239 // 横向滑动 240 // 处理UI横向滚动 241 } 242} else { 243 // 异常情况,应忽略 244} 245``` 246 247## cl.arkui.7 CanvasRenderingContext2D使用putImageData方法绘制透明度小于1的ImageData效果变更 248 249**访问级别** 250 251公开接口 252 253**变更原因** 254 255使用putImageData方法在屏绘制透明度小于1的ImageData,与clip方法组合使用时效果不正确,与W3C标准不一致。 256 257**变更影响** 258 259| 变更前 | 变更后 | 260| ---------------------------------------- | ---------------------------------------- | 261| 使用putImageData方法在屏绘制透明度小于1的ImageData,与clip方法组合使用时效果不正确,与W3C标准不一致。<br> | 使用putImageData方法在屏绘制透明度小于1的ImageData,与clip方法组合使用时效果正确,与W3C标准不一致。<br> | 262 263 264**起始API Level** 265 266API 8 267 268**变更发生版本** 269 270从OpenHarmony SDK 5.1.0.52开始。 271 272**适配指导** 273 274变更后颜色符合预期,开发者无需适配。 275 276**示例** 277``` ts 278@Entry 279@Component 280struct Demo { 281 private settings: RenderingContextSettings = new RenderingContextSettings(true) 282 private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) 283 284 build() { 285 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 286 Canvas(this.context) 287 .width('100%') 288 .height('100%') 289 .onReady(() => { 290 this.context.fillStyle = '#ff0000' 291 this.context.fillRect(0, 0, 600, 600) 292 this.context.arc(100, 100, 50, 0, 6.28) 293 this.context.clip() 294 let imageData = new ImageData(100, 100) 295 for (let i = 0; i < imageData.data.length; i += 4) { 296 imageData.data[i + 0] = 0 297 imageData.data[i + 1] = 255 298 imageData.data[i + 2] = 0 299 imageData.data[i + 3] = 85 300 } 301 this.context.putImageData(imageData, 50, 50) 302 }) 303 } 304 .width('100%') 305 .height('100%') 306 } 307} 308``` 309 310## cl.arkui.8 预览器OffscreenCanvasRenderingContext2D使用drawImage方法绘制透明度小于1的ImageBitmap效果变更 311 312**访问级别** 313 314公开接口 315 316**变更原因** 317 318在预览器上,使用drawImage方法离屏绘制透明度小于1的ImageBitmap,有可能颜色不正确,与W3C标准和真机效果不一致。 319 320**变更影响** 321 322| 变更前 | 变更后 | 323| ---------------------------------------- | ---------------------------------------- | 324| 在预览器上,使用drawImage方法离屏绘制透明度小于1的ImageBitmap,有可能颜色不正确,与W3C标准和真机效果不一致。<br> | 在预览器上,使用drawImage方法离屏绘制透明度小于1的ImageBitmap,颜色正确,与W3C标准和真机效果一致。<br> | 325 326 327**起始API Level** 328 329API 8 330 331**变更发生版本** 332 333从OpenHarmony SDK 5.1.0.52开始。 334 335**适配指导** 336 337变更后颜色符合预期,开发者无需适配。 338 339**示例** 340``` ts 341@Entry 342@Component 343struct Demo { 344 private settings: RenderingContextSettings = new RenderingContextSettings(true) 345 private context: CanvasRenderingContext2D = new CanvasRenderingContext2D(this.settings) 346 347 build() { 348 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 349 Canvas(this.context) 350 .width('100%') 351 .height('100%') 352 .onReady(() => { 353 let offContext = new OffscreenCanvasRenderingContext2D(100, 100) 354 offContext.fillStyle = 'rgba(0, 255, 0, 0.25)' 355 offContext.fillRect(0, 0, 100, 100) 356 let img = offContext.transferToImageBitmap() 357 this.context.fillStyle = 'rgb(255, 0, 0)' 358 this.context.fillRect(0, 0, 300, 300) 359 this.context.drawImage(img, 50, 50) 360 }) 361 } 362 .width('100%') 363 .height('100%') 364 } 365} 366``` 367 368## cl.arkui.9 TextInput/TextArea使用attributeModifier修改borderWidth的行为变更 369 370**访问级别** 371 372公开接口 373 374**变更原因** 375 376赋值顺序错误。 377 378**变更影响** 379 380此变更涉及应用适配。 381 382- 变更前:TextInput/TextArea使用attributeModifier修改borderWidth,top实际赋值给bottom,left实际赋值给top,bottom实际赋值给left。 383 384- 变更后:TextInput/TextArea使用attributeModifier修改borderWidth,top、bottom、left、right赋值给对应的位置。 385 386**起始API Level** 387 38812 389 390**变更发生版本** 391 392从OpenHarmony SDK 5.1.0.52开始。 393 394**适配指导** 395 396TextInput/TextArea使用attributeModifier修改borderWidth属性,top、bottom、left、right会赋值给对应的位置,需要修改之前错误的赋值顺序。 397例如如下代码: 398```ts 399@State myModifier: TextInputModifier = new TextInputModifier().borderWidth({ 400 top: 5, 401 bottom: 10, 402 left: 15, 403 right: 20 404 }) 405``` 406维持原状可以做如下调整: 407```ts 408@State myModifier: TextInputModifier = new TextInputModifier().borderWidth({ 409 top: 15, // 使用原先的left 410 bottom: 5, // 使用原先的top 411 left: 10, // 使用原先的bottom 412 right: 20 413 }) 414```