1# ArkUI子系统Changelog 2 3## cl.arkui.1 带标题栏窗口应用内菜单弹出位置变更 4 5**访问级别** 6 7公开接口 8 9**变更原因** 10 11对于带标题栏窗口使用非子窗的Menu组件场景，菜单默认弹出位置调整，UX体验更佳。 12 13 14**变更影响** 15 16此变更不涉及应用适配。 17 18变更前：带标题栏窗口应用内弹出菜单位置偏移4vp，菜单没有和按钮对齐。 19 20变更后：带标题栏窗口应用内弹出菜单位置正确，菜单和按钮对齐。 21 22| 变更前 | 变更后 | 23|---------|---------| 24|  |  | 25 26**起始API Level** 27 28API 11 29 30**变更发生版本** 31 32从OpenHarmony SDK 5.1.0.45开始。 33 34**变更的接口/组件** 35 36Menu组件。 37 38**适配指导** 39 40Menu UX默认效果变更，无需适配，但应注意变更后的默认效果是否符合开发者预期，如不符合则应自定义修改效果控制变量以达到预期。 41 42## cl.arkui.2 MenuItem设置padding属性时默认布局行为变更 43 44**访问级别** 45 46公开接口 47 48**变更原因** 49 50优化MenuItem添加padding时布局效果，变更后效果更佳。 51 52**变更影响** 53 54此变更不涉及应用适配。 55 56变更前：MenuItem设置padding属性时，布局和预期不符合。 57 58变更后：MenuItem设置padding属性时，布局符合预期。 59 60```ts 61@Entry 62@Component 63struct Index { 64 @Builder 65 MenuWithPadding() { 66 Menu() { 67 MenuItemGroup() { 68 MenuItem({content:"top bottom padding is 20vp"}) 69 .padding({top:20, bottom: 20}) 70 .borderWidth(2) 71 .borderColor(Color.Black) 72 MenuItem({content:"top padding is 20vp"}) 73 .padding({top:20}) 74 .borderWidth(2) 75 .borderColor(Color.Black) 76 MenuItem({content:"bottom padding is 20vp"}) 77 .padding({bottom: 20}) 78 .borderWidth(2) 79 .borderColor(Color.Black) 80 } 81 } 82 } 83 84 build() { 85 Column() { 86 Button("菜单") 87 .bindMenu(this.MenuWithPadding) 88 } 89 .width('100%') 90 } 91} 92``` 93 94| 变更前 | 变更后 | 95|---------|---------| 96|  |  | 97 98**起始API Level** 99 100API 7 101 102**变更发生版本** 103 104从OpenHarmony SDK 5.1.0.45 版本开始。 105 106**变更的接口/组件** 107 108MenuItem组件。 109 110**适配指导** 111 112MenuItem设置padding属性时默认布局效果变更，开发者无需适配。 113 114## cl.arkui.3 DatePickerDialog和TimePickerDialog调用show()方法，参数缺省时的行为变更 115 116**访问级别** 117 118公开接口 119 120**变更原因** 121 122DatePickerDialog和TimePickerDialog调用show()方法，若参数缺省，无法弹出对话框。该参数为可选参数，会对开发者造成困惑。 123 124**变更影响** 125 126此变更不涉及应用适配。 127 128举例说明，执行以下用例： 129 130```ts 131@Entry 132@Component 133struct PickerDialogExample { 134 build() { 135 Column() { 136 Button("DatePickerDialog") 137 .onClick(() => { 138 DatePickerDialog.show() 139 }) 140 141 Button("TimePickerDialog") 142 .margin(20) 143 .onClick(() => { 144 TimePickerDialog.show() 145 }) 146 } 147 } 148} 149``` 150 151变更前: 152DatePickerDialog.show()和TimePickerDialog.show()无法弹出日期选择器对话框。 153 154变更后: 155DatePickerDialog.show()和TimePickerDialog.show()可以弹出日期选择器对话框。 156 157**起始API Level** 158 159API 8 160 161**变更发生版本** 162 163从OpenHarmony 5.1.0.45开始。 164 165**变更的接口/组件** 166 167TimePickerDialog和DatePickerDialog组件。 168 169**适配指导** 170 171DatePickerDialog和TimePickerDialog调用show()方法，参数缺省时，可弹出默认样式的对话框。 172 173## cl.arkui.4 Gauge设置第一个颜色占比过小时绘制效果更改 174 175**访问级别** 176 177公开接口 178 179**变更原因** 180 181Gauge设置第一个颜色占比过小时绘制效果不符合UX效果。 182 183**变更影响** 184 185此变更无需应用适配。 186 187| 变更前 | 变更后 | 188| -------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | 189| 设置第一个颜色占比过小时，第一个圆环未被正确裁切，出现逆时针向0的方向绘制的情况。<br>| 设置第一个颜色占比过小时，第一个圆环绘制正常，能被正常裁切。<br> | 190 191**起始API Level** 192 19311 194 195**变更发生版本** 196 197从OpenHarmony 5.1.0.45 版本开始。 198 199**变更的接口/组件** 200 201Gauge。 202 203**适配指导** 204 205展示效果变更，无需适配，但应注意变更后的效果是否符合开发者预期。 206 207## cl.arkui.5 Repeat VirtualScroll 支持二级缓存冻结 208 209**访问级别** 210 211公开接口 212 213**变更原因** 214 215开发者使用Repeat VirtualScroll，进入二级缓存（复用池）中的组件是为了通过更新其各项属性后作为新组件使用，在更新成为新组件之前不应该被刷新。 216 217**变更影响** 218 219此变更不涉及应用适配。 220 221变更前：启用组件冻结，状态变量改动会触发二级缓存中的组件刷新，并执行@Monitor对应方法。 222 223变更后：启用组件冻结，状态变量改动不会触发二级缓存中的组件刷新，不执行@Monitor对应方法。 224 225举例说明，执行以下用例： 226 227```ts 228@Entry 229@ComponentV2 230struct RepeatVirtualScrollDemo { 231 @Local simpleList: Array<string> = []; 232 @Local bgColor: Color = Color.Pink; 233 234 aboutToAppear(): void { 235 for (let i = 0; i < 7; i++) { 236 this.simpleList.push(`item${i}`); 237 } 238 } 239 240 build() { 241 Column() { 242 Row() { 243 Button(`Reduce length to 5`) 244 .onClick(() => { 245 this.simpleList = this.simpleList.slice(0, 5); 246 }) 247 Button(`Change bgColor`) 248 .onClick(() => { 249 this.bgColor = this.bgColor == Color.Pink ? Color.Blue : Color.Pink; 250 }) 251 } 252 253 List() { 254 Repeat(this.simpleList) 255 .each((obj: RepeatItem<string>) => { 256 }) 257 .key((item: string, index: number) => item) 258 .virtualScroll({ totalCount: this.simpleList.length }) 259 .templateId(() => `a`) 260 .template(`a`, (ri) => { 261 ChildComponent({ 262 message: ri.item, 263 bgColor: this.bgColor 264 }) 265 }, { cachedCount: 2 }) 266 } 267 .cachedCount(0) 268 .height(500) 269 } 270 .height(`100%`) 271 } 272} 273 274@ComponentV2({ freezeWhenInactive: true }) 275struct ChildComponent { 276 @Param @Require message: string; 277 @Param @Require bgColor: Color; 278 // 支持后二级缓存中的组件不刷新，不会打印相应日志 279 @Monitor(`bgColor`) 280 onMessageChange(monitor: IMonitor) { 281 monitor.dirty.forEach((path: string) => { 282 console.log(`repeat---${path} change from ${monitor.value(path)?.before} to ${monitor.value(path)?.now}`) 283 }) 284 } 285 286 build() { 287 Text(`[a]: ${this.message}`) 288 .fontSize(50) 289 .backgroundColor(this.bgColor) 290 } 291} 292``` 293 294**起始API Level** 295 29612 297 298**变更发生版本** 299 300从OpenHarmony 5.1.0.45 版本开始。 301 302**变更的接口/组件** 303 304Repeat freezeWhenInactive。 305 306**适配指导** 307 308展示效果不变，@Monitor监听属性变化执行方法次数会减少。如果需要刷新缓存中的数据，可以关闭组件冻结。 309 310```ts 311// 关闭组件冻结，freezeWhenInactive设置为false 312@ComponentV2({ freezeWhenInactive: false }) 313struct ChildComponent { 314 @Param @Require message: string; 315 @Param @Require bgColor: Color; 316 // 关闭冻结后，二级缓存中的组件会刷新，并打印相应日志 317 @Monitor(`bgColor`) 318 onMessageChange(monitor: IMonitor) { 319 monitor.dirty.forEach((path: string) => { 320 console.log(`repeat---${path} change from ${monitor.value(path)?.before} to ${monitor.value(path)?.now}`) 321 }) 322 } 323 324 build() { 325 Text(`[a]: ${this.message}`) 326 .fontSize(50) 327 .backgroundColor(this.bgColor) 328 } 329} 330``` 331 332## cl.arkui.6 Image组件的borderRadius接口支持百分比输入 333 334**访问级别** 335 336公开接口 337 338**变更原因** 339 340为了增强功能的灵活性，Image组件的borderRadius接口支持百分比输入，功能与通用属性的borderRadius对齐。 341 342**变更影响** 343 344此变更涉及应用适配。 345 346| 变更前 | 变更后 | 347| -------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ | 348| Image组件的borderRadius接口输入百分比不生效。<br>| Image组件的borderRadius接口输入百分比，百分比依据组件宽度生效。<br> | 349 350**起始API Level** 351 3527 353 354**变更发生版本** 355 356从OpenHarmony SDK 5.1.0.45 版本开始。 357 358**变更的接口/组件** 359 360Image组件的borderRadius接口。 361 362**适配指导** 363 364如果代码中依赖borderRadius传入百分比不生效的行为，建议传入0，或者不设置borderRadius，例如：borderRadius(0)。 365 366```ts 367@Entry 368@Component 369struct Index { 370 build() { 371 Column() { 372 Image($r("app.media.startIcon")) 373 .width(100) 374 .height(100) 375 .borderRadius("10%") 376 } 377 .height('100%') 378 .width('100%') 379 } 380} 381``` 382 383## cl.arkui.7 ImageSpan组件borderRadius边框圆角属性Modifier设置变更 384 385**访问级别** 386 387公开接口 388 389**变更原因** 390 391ImageSpan组件的borderRadius边框圆角属性通过Modifier设置不生效，边框实际不显示圆角效果。 392 393**变更影响** 394 395此变更不涉及应用适配。 396 397| 变更前 | 变更后 | 398| ----------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ | 399| ImageSpan组件borderRadius边框圆角属性通过Modifier设置不生效。<br>| ImageSpan组件borderRadius边框圆角属性通过Modifier设置生效。<br> | 400 401**起始API Level** 402 403ImageSpanModifier ： 12 404 405**变更发生版本** 406 407从OpenHarmony SDK 5.1.0.45开始。 408 409**变更的接口/组件** 410 411ImageSpanModifier接口的borderRadius属性 412 413**适配指导** 414 415无需应用适配，变更后ImageSpan组件的borderRadius边框圆角在Modifier接口设置生效，效果与开发者实际设置的圆角值显示一致。 416 417## cl.arkui.8 Search组件回车键类型为EnterKeyType.NEW_LINE（换行）时onSubmit回调中执行keepEditableState()函数，参数缺省时的行为变更 418 419**访问级别** 420 421公开接口 422 423**变更原因** 424 425开发者通过Search组件的onSubmit接口设置自定义提交事件，并在keepEditableState()函数中配置是否收起键盘。当回车键类型设置为EnterKeyType.NEW_LINE（换行）时，无论是否设置keepEditableState()接口，用户点击输入法软键盘上的换行按钮或按下回车键，键盘均不会收起。 426 427**变更影响** 428 429此变更不涉及应用适配。 430 431变更前：回车键类型为EnterKeyType.NEW_LINE（换行），不设置keepEditableState()接口，用户点击输入法软键盘上的换行按钮或按下回车键，Search组件保持编辑态。 432 433变更后：回车键类型为EnterKeyType.NEW_LINE（换行），不设置keepEditableState()接口，用户点击输入法软键盘上的换行按钮或按下回车键，Search组件退出编辑态。 434 435**起始API Level** 436 43712 438 439**变更发生版本** 440 441从OpenHarmony 5.1.0.45 版本开始。 442 443**变更的接口/组件** 444 445onSubmit事件keepEditableState()接口 446 447**适配指导** 448 449使用Search组件onSubmit接口设置自定义提交事件。触发onSubmit时，如果回车键类型为EnterKeyType.NEW_LINE（换行）且未设置keepEditableState()接口，键盘退出编辑态。举例说明： 450 451```ts 452import { SymbolGlyphModifier } from '@kit.ArkUI' 453 454@Entry 455@Component 456struct EnterKeyTypeIsNewLineDemo { 457 mySearchController: SearchController = new SearchController() 458 459 build() { 460 Column() { 461 Text('Search').fontSize(25).fontColor(Color.Blue) 462 Search({ value: '', placeholder: 'Type to search ...', controller: this.mySearchController }) 463 .searchIcon(new SymbolGlyphModifier($r('sys.symbol.magnifyingglass')).fontColor([Color.Red])) 464 .searchButton('SEARCH') 465 // 回车键类型设置为EnterKeyType.NEW_LINE（换行） 466 .enterKeyType(EnterKeyType.NEW_LINE) 467 .onSubmit((value: string, event?: SubmitEvent) => { 468 // 设置键盘保持编辑态，否则，默认情况键盘退出编辑态 469 event?.keepEditableState() 470 }) 471 }.width('100%').margin({ top: 100 }) 472 } 473} 474``` 475 476## cl.arkui.9 TextInput/TextArea组件border属性dashGap、dashWidth参数Modifier设置变更 477 478**访问级别** 479 480公开接口 481 482**变更原因** 483 484TextInput/TextArea组件的border属性中，虚线参数dashGap和dashWidth通过Modifier设置后未生效。当前TextInput/TextArea组件的实际虚线边框显示为默认效果，而非Modifier设置的值。 485 486**变更影响** 487 488此变更不涉及应用适配。 489 490| 变更前 | 变更后 | 491| ----------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | 492| TextInput/TextArea组件的border属性中，虚线参数dashGap和dashWidth通过Modifier设置后未生效。| TextInput/TextArea组件的border属性中，虚线参数dashGap和dashWidth通过Modifier设置后生效。 | 493 494**起始API Level** 495 496TextInputModifier ：12 497 498TextAreaModifier ：12 499 500**变更发生版本** 501 502从OpenHarmony SDK 5.1.0.45开始。 503 504**变更的接口/组件** 505 506TextInputModifier、TextAreaModifier接口的border属性dashGap、dashWidth参数 507 508**适配指导** 509 510无需应用适配，变更后TextInput/TextArea组件的border属性虚线参数dashGap、dashWidth通过Modifier设置生效，显示虚线边框间距和长度效果与开发者设置值一致。 511
