1# ArkUI子系统Changelog 2 3## cl.arkui.1 Tabs组件的页签可滚动且为非子页签样式时增加页签默认切换动效 4 5**访问级别** 6 7公开接口 8 9**变更原因** 10 11快速连续切换页签时,页签产生跳变现象,视觉效果不佳。 12 13**变更影响** 14 15该变更为兼容性变更。 16 17变更前:Tabs组件的barMode为BarMode.Scrollable,TabContent组件的tabBar为子页签样式时有默认切换动效,即切换页签后,选中页签执行动画平移至tabBar中间位置。但非子页签样式时无默认切换动效,即切换页签后,选中页签立即跳变至tabBar中间位置。 18 19变更后:Tabs组件的barMode为BarMode.Scrollable,TabContent组件的tabBar为任意页签样式时均有默认切换动效,切换动效的时长为Tabs组件的animationDuration属性值。 20 21| 变更前 | 变更后 | 22|---------|---------| 23|  |  | 24 25**起始API Level** 26 277 28 29**变更发生版本** 30 31从OpenHarmony SDK 5.0.0.36开始。 32 33**变更的接口/组件** 34 35Tabs组件 36 37**适配指导** 38 39若希望关闭页签的默认切换动效,可设置Tabs组件的animationDuration属性值为0,但同时TabContent页面的默认切换动效也会被关闭。示例代码如下: 40```ts 41@Entry 42@Component 43struct TabsSample { 44 @State currentIndex: number = 0; 45 46 @Builder TabBuilder(index: number, name: string) { 47 Text(name) 48 .fontColor(this.currentIndex === index ? Color.White : Color.Black) 49 .fontSize(this.currentIndex === index ? 18 : 16) 50 .fontWeight(this.currentIndex === index ? 500 : 400) 51 .textAlign(TextAlign.Center) 52 .width(100) 53 .height(48) 54 .margin({ left: 4, right: 4 }) 55 .backgroundColor(this.currentIndex === index ? '#007DFF' : '#F1F3F5') 56 .borderRadius(24) 57 } 58 59 build() { 60 Column() { 61 Tabs({ index: this.currentIndex }) { 62 TabContent() { 63 Column().width('100%').height('100%').backgroundColor('#00CB87') 64 }.tabBar(this.TabBuilder(0, 'green')) 65 66 TabContent() { 67 Column().width('100%').height('100%').backgroundColor('#007DFF') 68 }.tabBar(this.TabBuilder(1, 'blue')) 69 70 TabContent() { 71 Column().width('100%').height('100%').backgroundColor('#FFBF00') 72 }.tabBar(this.TabBuilder(2, 'yellow')) 73 74 TabContent() { 75 Column().width('100%').height('100%').backgroundColor('#E67C92') 76 }.tabBar(this.TabBuilder(3, 'pink')) 77 } 78 .height(300) 79 .barMode(BarMode.Scrollable, { margin: 16 }) 80 .fadingEdge(false) 81 .animationDuration(0) 82 .onChange((index: number) => { 83 this.currentIndex = index 84 }) 85 }.width('100%') 86 } 87} 88``` 89 90## cl.arkui.2 Refresh组件promptText参数设置为undefined时清空文本内容 91 92**访问级别** 93 94公开接口 95 96**变更原因** 97 98Refresh组件通过promptText参数可传入文本字符串显示在刷新区域,该参数设置为undefined时未清空文本内容,不符合ArkUI通用规范,变更后开发者可设置该参数为undefined清空文本内容。 99 100**变更影响** 101 102该变更为不兼容变更。 103 104变更前,promptText参数设置为undefined时会保持当前值不变,刷新区域显示对应文本内容。 105 106变更后,promptText参数设置为undefined时会清空当前文本内容,刷新区域不显示文本内容。 107 108| 变更前 | 变更后 | 109|---------|---------| 110||| 111 112**起始API Level** 113 11412 115 116**变更发生版本** 117 118从OpenHarmony SDK 5.0.0.36开始。 119 120**变更的接口/组件** 121 122Refresh组件promptText参数 123 124**适配指导** 125 126开发者需要判断变更后promptText参数设置undefined时清空文本内容后的效果是否符合预期,如不符合可通过对[Refresh组件](../../../application-dev/reference/apis-arkui/arkui-ts/ts-container-refresh.md)promptText参数设置期望值以达到预期。 127 128```ts 129@Entry 130@Component 131struct RefreshExample { 132 @State isRefreshing: boolean = false 133 @State arr: String[] = ['0', '1', '2', '3', '4','5','6','7','8','9','10'] 134 @State promptText: string|undefined = "Loading..." 135 136 build() { 137 Column() { 138 Refresh({ refreshing: $$this.isRefreshing , 139 promptText: this.promptText // 设置刷新区域显示文本内容,设置为undefined时清空文本内容 140 }) { 141 List() { 142 ForEach(this.arr, (item: string) => { 143 ListItem() { 144 Text('' + item) 145 .width('80%').height(100).fontSize(16).margin(10) 146 .textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF) 147 } 148 }, (item: string) => item) 149 } 150 .width('100%') 151 .height('100%') 152 .alignListItem(ListItemAlign.Center) 153 .scrollBar(BarState.Off) 154 } 155 .backgroundColor(0x89CFF0) 156 .refreshOffset(96) 157 } 158 } 159} 160``` 161 162## cl.arkui.3 Popup(气泡组件)UX样式变更 163 164**访问级别** 165 166公开接口 167 168**变更原因** 169 170Popup(气泡组件)UX样式不符合规范 171 172**变更影响** 173 174该变更为不兼容变更。 175 176变更前: 1771、按钮与文本左侧没有对齐 1782、按钮上方与文本下方间距不足8vp 179 180 181 182变更后: 1831、按钮与文本左侧对齐 1842、按钮上方与文本下方间距8vp 185 186 187 188**起始API Level** 189 190API 11 191 192**变更发生版本** 193 194从OpenHarmony SDK 5.0.0.36开始。 195 196**变更的接口/组件** 197 198Popup(气泡组件) 199 200**适配指导** 201 202默认效果变更,无需适配,但应注意变更后的默认效果是否符合开发者预期,如不符合则应自定义修改效果控制变量以达到预期。 203 204## cl.arkui.4 Menu(菜单组件)组件内borderRadius方法支持设置LocalizedBorderRadiuses类型参数 205 206**访问级别** 207 208公开接口 209 210**变更原因** 211 212bindMenu和bindContextMenu组件内borderRadius方法不支持设置LocalizedBorderRadiuses类型参数 213 214**变更影响** 215 216该变更为不兼容变更。 217 218变更前: 219在menu内使用borderRadius方法设置菜单圆角时,不支持LocalizedBorderRadiuses类型的参数。 220 221 222 223变更后: 224在menu内使用borderRadius方法设置菜单圆角时,支持LocalizedBorderRadiuses类型的参数,并支持镜像。 225 226 227 228**起始API Level** 229 230API 12 231 232**变更发生版本** 233 234从OpenHarmony SDK 5.0.0.36开始。 235 236**变更的接口/组件** 237 238Menu(菜单组件) 239 240**适配指导** 241 242开发者可以在menu内通过borderRadius接口设置菜单圆角,且当参数类型为LocalizedBorderRadiuses类型时,支持镜像能力。 243 244```ts 245import { LengthMetrics } from '@ohos.arkui.node'; 246 247@Entry 248@Component 249struct Index { 250 251 @Builder 252 MyMenu(){ 253 Menu() { 254 MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }) 255 MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }) 256 MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }) 257 MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }) 258 MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }) 259 MenuItem({ startIcon: $r("app.media.icon"), content: "菜单选项" }) 260 .enabled(true) 261 } 262 } 263 264 build() { 265 Row() { 266 Column() { 267 Text('click to show menu') 268 .fontSize(50) 269 .fontWeight(FontWeight.Bold) 270 } 271 .bindMenu(this.MyMenu, { 272 enableArrow: true, 273 // 设置圆角 274 borderRadius: { topStart: LengthMetrics.vp(20), bottomStart: LengthMetrics.vp(60) } 275 }) 276 .width('100%') 277 } 278 .height('100%') 279 } 280} 281``` 282 283## cl.arkui.5 setWindowSystemBarEnable 接口废弃变更 284 285**访问级别** 286 287公开接口 288 289**变更原因** 290 291该接口有Promise和callback两种调用方式,使用callback方式的接口错误码不满足ArkTS API异常处理规范,标废弃,使用同名的Promise接口代替。 292 293**变更影响** 294 295该变更为兼容性变更。 296 297从API version 12开始,setWindowSystemBarEnable的callback方式调用将不推荐使用,推荐使用Promise方式的同名接口。 298 299**起始 API Level** 300 301API 9 302 303**变更发生版本** 304 305从OpenHarmony SDK 5.0.0.36版本开始。 306 307**变更的接口/组件** 308 309Window#setWindowSystemBarEnable(names: Array<'status' | 'navigation'>, callback: AsyncCallback<void>): void。 310 311**适配指导** 312 313不涉及 314 315## cl.arkui.6 setWindowLayoutFullScreen 接口废弃变更 316 317**访问级别** 318 319公开接口 320 321**变更原因** 322 323该接口有Promise和callback两种调用方式,使用callback方式的接口错误码不满足ArkTS API异常处理规范,标废弃,使用同名的Promise接口代替。 324 325**变更影响** 326 327该变更为兼容性变更。 328 329从API version 12 setWindowLayoutFullScreen的callback方式调用将不推荐使用,推荐使用Promise方式的同名接口。 330 331**起始 API Level** 332 333API 9 334 335**变更发生版本** 336 337从OpenHarmony SDK 5.0.0.36版本开始。 338 339**变更的接口/组件** 340 341Window#setWindowLayoutFullScreen(isLayoutFullScreen: boolean, callback: AsyncCallback<void>): void。 342 343**适配指导** 344 345不涉及 346 347## cl.arkui.7 setWindowSystemBarProperties 接口废弃变更 348 349**访问级别** 350 351公开接口 352 353**变更原因** 354 355该接口有Promise和callback两种调用方式,使用callback方式的接口错误码不满足ArkTS API异常处理规范,标废弃,使用同名的Promise接口代替。 356 357**变更影响** 358 359该变更为兼容性变更。 360 361从API version 12开始,setWindowSystemBarProperties的callback方式调用将不推荐使用,推荐使用Promise方式的同名接口。 362 363**起始 API Level** 364 365API 9 366 367**变更发生版本** 368 369从OpenHarmony SDK 5.0.0.36版本开始。 370 371**变更的接口/组件** 372 373Window#setWindowSystemBarProperties(systemBarProperties: SystemBarProperties, callback: AsyncCallback<void>): void。 374 375**适配指导** 376 377不涉及 378 379## cl.arkui.8 Toast弹窗UX样式变更 380 381**访问级别** 382 383公开接口 384 385**变更原因** 386 387UX规格变更 388 389**变更影响** 390 391该变更为不兼容变更。 392 393- API version 11及之前,Toast弹窗背景色为深黑色、字色为白色,最大高度没有限制,界面语超长没有截断。<br/> 394 395- API version 12及之后,Toast弹窗在常规亮色显示风格下toast透明模糊背景、字色黑色,暗色显示风格下透明模糊背景、字色白色。<br/> 396Toast的最大高度 =(屏幕高度-信号栏-导航条)*0.65,最大宽度:基于屏幕宽度-2侧margin,根据容器自适应,最大到400vp不再变化。<br/> 397界面语超长逐级缩小字号至12fp,超出截断。 398 399- API version 11及之前对比API version 12及之后属性变更如下 400 401 | 属性名 | 变更前 | 变更后 | 402|---------|---------|---------| 403| 背景色 | bg_color | COMPONENT_ULTRA_THICK | 404| 圆角 | toast_border_radius | corner_radius_level9 | 405| padding-left | toast_padding_horizontal | padding_level8 | 406| padding-top | toast_padding_vertical | padding_level4 | 407| padding-right | toast_padding_horizontal | padding_level8 | 408| padding-bottom | toast_padding_vertical | padding_level4 | 409| 字体大小 | text_font_size | Body_M | 410| 字体颜色 | text_color | font_primary | 411| 字重 | toast_text_font_weight | font_weight_regular | 412 413示例如下: 414如下图所示为变更前后效果对比: 415 416 | 变更前 | 变更后 | 417|---------|---------| 418|  |  | 419 420**API Level** 421 42212 423 424**变更发生版本** 425 426从OpenHarmony SDK 5.0.0.36 版本开始。 427 428**变更的接口/组件** 429 430promptAction.showToast 431 432**适配指导** 433 434UX默认行为变更,无需适配。可以通过[promptAction](../../../application-dev/reference/apis-arkui/js-apis-promptAction.md)中ShowToastOptions接口自定义Toast背景色、字色等。 435 436 437## cl.arkui.9 QRCode深浅色适配修改 438 439**访问级别** 440 441公开接口 442 443**变更原因** 444 445QRCode在深色模式下使用默认颜色生成的二维码无法被正常识别。 446 447**变更影响** 448 449该变更为不兼容变更。 450 451变更前:在深色模式下,QRCode生成的二维码背景颜色为黑色,图案颜色为白色。 452 453变更后:在深色模式下,QRCode生成的二维码背景颜色为白色,图案颜色为黑色,与浅色模式相同。 454 455**起始API Level** 456 45712 458 459**变更发生版本** 460 461从OpenHarmony SDK 5.0.0.36开始。 462 463**变更的接口/组件** 464 465QRcode组件 466 467**适配指导** 468 469默认效果变更,无需适配。