1# ArkUI子系统Changelog
2
3## cl.arkui.1 Toggle组件Switch样式移除宽高比1.8倍限制
4
5**访问级别**
6
7公开接口
8
9**变更原因**
10
11a)Toggle组件Switch样式原宽高比固定为1.8倍，导致开发者无法不受限制自定义宽高。现移除1.8倍限制，增强开发者自定义能力。
12
13**变更影响**
14
15该变更为非兼容性变更。
16
17API version 11及以前，Toggle组件Switch样式宽高比固定为1.8倍，开发者设置宽高比大于1.8倍时以高度为基准，小于1.8倍时以宽度为基准。
18
19例：宽度设置为200vp，高度设置为100vp，则宽度会被重置为180vp，高度保持100vp；宽度设置为180vp，高度设置为150vp，则高度会被重置为100vp，宽度保持180vp；
20
21API version 12及以后，Toggle组件Switch样式宽高比没有限制。
22
23**起始API Level**
24
25width，height通用属性的起始支持版本为API 7
26
27**变更发生版本**
28
29从OpenHarmony SDK 5.0.0.21 版本开始。
30
31**变更的接口/组件**
32
33Toggle组件
34
35**适配指导**
36
37取消组件宽高比例限制， 如果此前设置组件宽高比例大于1.8倍时需要以高度为基准修改业务代码，小于1.8倍时需要以宽度为基准修改业务代码，才能保持原有组件样式。
38
39其他适配请查阅[Toggle组件](../../../application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-toggle.md)文档进行适配。
40
41## cl.arkui.2  Radio组件单选项样式风格增强、支持显示自定义图标
42
43**访问级别**
44
45公开接口
46
47**变更原因**
48
49允许用户自定义单选项的选中状态：
50
511.可以选择不同的样式，如圆饼样式，对勾样式，自定义图标样式。
52
532.用户自定义图标时，设置选中状态时图标显示，非选中状态时图标不显示。
54
55**变更影响**
56
57该变更为非兼容性变更。
58
59- 变更前：默认选中状态DOT（圆圈样式）。
60- 变更后：默认选中状态TICK（对勾样式）。
61
62| DOT | TICK |
63|---------|---------|
64| ![](figures/radio_changelog_DOT.jpg) | ![](figures/radio_changelog_TICK.jpg) |
65
66**API Level**
67
6812
69
70**变更发生版本**
71
72从OpenHarmony SDK 5.0.0.21版本开始。
73
74**示例：**
75该示例实现了自定义选中状态
76```
77@Entry
78@Component
79struct RadioExample {
80  @Builder
81  indicatorBuilder() {
82    Image($r("app.media.star"))
83  }
84  build() {
85    Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
86      Column() {
87        Text('Radio1')
88        Radio({ value: 'Radio1', group: 'radioGroup',
89          indicatorType:RadioIndicatorType.TICK
90        }).checked(true)
91          .height(50)
92          .width(80)
93          .onChange((isChecked: boolean) => {
94            console.log('Radio1 status is ' + isChecked)
95          })
96      }
97      Column() {
98        Text('Radio2')
99        Radio({ value: 'Radio2', group: 'radioGroup',
100          indicatorType:RadioIndicatorType.DOT
101        }).checked(false)
102          .height(50)
103          .width(80)
104          .onChange((isChecked: boolean) => {
105            console.log('Radio2 status is ' + isChecked)
106          })
107      }
108      Column() {
109        Text('Radio3')
110        Radio({ value: 'Radio3', group: 'radioGroup',
111          indicatorType:RadioIndicatorType.CUSTOM,
112          indicatorBuilder:()=>{this.indicatorBuilder()}
113        }).checked(false)
114          .height(50)
115          .width(80)
116          .onChange((isChecked: boolean) => {
117            console.log('Radio3 status is ' + isChecked)
118          })
119      }
120    }.padding({ top: 30 })
121  }
122}
123```
124
125**变更的接口/组件**
126
127Radio组件
128
129**适配指导**
130
131请查阅[Radio组件](../../../application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-radio.md)文档进行适配。
132
133## cl.arkui.3 文本组件的文本选择行为变更
134
135**访问级别**
136
137公开接口
138
139**变更原因**
140
141依照UX规范
142
143**变更影响**
144
145该变更为非兼容性变更。API version 11及以前：
146
147a)当前Text组件长按出现菜单时，旋转屏幕，此时依旧出现菜单。
148
149b)当前Text/TextInput/TextArea/Search/RichEditor组件长按出现菜单，进行复制行为，文本退出选中态。
150
151c)当前TextInput/TextArea/Search/RichEditor组件在手机和平板设备上通过代码选区，只出现选中态，无手柄。
152
153API version 12及以后：
154
155a)当前Text组件长按出现菜单时，旋转屏幕，隐藏菜单，保持选中态。
156
157b)当前TextInput/TextArea/Search/RichEditor组件长按出现菜单时，进行复制行为，隐藏菜单，保持选中态。
158
159c)当前TextInput/TextArea/Search/RichEditor组件在手机和平板设备上通过代码选区，出现选中态和手柄，用户可自定义出现菜单。
160
161| 变更前 | 变更后 |
162|---------|---------|
163| ![](figures/text_before.png) | ![](figures/text_after.png) |
164| ![](figures/copy_before.png) | ![](figures/copy_after.png) |
165| ![](figures/selection_before.png) | ![](figures/select_after.png) |
166
167**API Level**
168
16912
170
171**变更发生版本**
172
173从OpenHarmony SDK 5.0.0.21 版本开始。
174
175**变更的接口/组件**
176
177Text/TextInput/TextArea/Search/RichEditor组件。
178
179**适配指导**
180
181默认行为变更，无需适配，但应注意变更后的行为是否对整体应用逻辑产生影响
182
183## c1.arkui.4 TextInput组件underline默认样式变更
184
185**访问级别**
186
187公开接口
188
189**变更原因**
190
191依照UX规范
192
193**变更影响**
194
195该变更为非兼容性变更。API version 11及以前，TextInput组件设置underline时，组件出现的时候无圆角，组件获焦失焦后有圆角，且圆角值不同。API version 12及以后，依照UX规范统一默认都设置无圆角。
196
197| 变更前 | 变更后 |
198|---------|---------|
199| ![](figures/init.png) | ![](figures/init.png) |
200| ![](figures/focus.png) | ![](figures/init.png) |
201| ![](figures/blur.png) | ![](figures/init.png) |
202
203**API Level**
204
20512
206
207**变更发生版本**
208
209从OpenHarmony SDK 5.0.0.21 版本开始。
210
211**变更的接口/组件**
212
213TextInput组件。
214
215**适配指导**
216
217默认效果变更，无需适配，但应注意变更后的默认效果是否符合开发者预期，如不符合则应自定义修改效果控制变量以达到预期
218
219## cl.arkui.5 AlphabetIndexer组件的默认样式变更
220
221**访问级别**
222
223公开接口
224
225**变更原因**
226
227a)当前AlphabetIndexer组件的字母索引条默认字体大小为12vp，依照UX规范修改字母索引条默认字体大小到10vp。
228
229b)当前AlphabetIndexer组件的字母索引条默认字重为Normal，依照UX规范修改字母索引条默认字重到Medium。
230
231c)当前AlphabetIndexer组件的字母索引条选中项文字默认字体大小为12vp，依照UX规范修改字母索引条选中项文字默认字体大小到10vp。
232
233d)当前AlphabetIndexer组件的字母索引条选中项文字默认字重为Normal，依照UX规范修改字母索引条选中项文字默认字重到Medium。
234
235e)当前AlphabetIndexer组件的字母索引条索引项背板圆角默认为4vp，依照UX规范修改字母索引条索引项背板圆角默认为8vp。
236
237f)当前AlphabetIndexer组件的字母索引条背板圆角默认为0vp，依照UX规范修改字母索引条索引项背板圆角默认为12vp。
238
239g)当前AlphabetIndexer组件的字母索引条背板上下padding默认为2vp，依照UX规范修改字母索引条索引项背板上下padding默认为4vp。
240
241h)当前AlphabetIndexer组件的字母索引条pressed状态文字背板颜色默认为'#0c182431'，依照UX规范修改字母索引条pressed状态文字背板颜色默认为'#19182431'。
242
243i)当前AlphabetIndexer组件的弹出窗口默认背板阴影尺寸为DefaultShadowM、依照UX规范变更默认背板阴影尺寸为DefaultShadowL。
244
245j)当前AlphabetIndexer组件的弹出窗口默认背板最大高度为336vp、依照UX规范变更弹出窗口默认背板最大高度为342vp。
246
247k)当前AlphabetIndexer组件的弹出窗口自适应折叠模式默认背板最大高度为224vp、依照UX规范变更弹出窗口自适应折叠模式默认背板最大高度为186vp。
248
249l)当前AlphabetIndexer组件的弹出窗口上下padding默认为0vp、依照UX规范变更弹出窗口上下padding默认为4vp。
250
251m)当前AlphabetIndexer组件的弹出窗口背板圆角默认为16vp，依照UX规范修改弹出窗口背板圆角默认为28vp。
252
253n)当前AlphabetIndexer组件的弹出窗口索引项默认尺寸为56vp、依照UX规范变更弹出窗口索引项默认尺寸为48vp。
254
255o)当前AlphabetIndexer组件的弹出窗口索引项间隔为0vp、依照UX规范变更弹出窗口索引项间隔为4vp。
256
257p)当前AlphabetIndexer组件的弹出窗口索引项背板圆角默认为0vp，依照UX规范修改弹出窗口索引项背板圆角默认为24vp。
258
259q)当前AlphabetIndexer组件的弹出窗口背板颜色默认为'#FFFFFFFF'，依照UX规范修改弹出窗口背板颜色默认为'#66808080'。
260
261r)当前AlphabetIndexer组件的弹出窗口字母部分背板颜色默认为'#FFFFFFFF'，依照UX规范修改弹出窗口字母部分背板颜色默认为'#0c182431'。
262
263s)当前AlphabetIndexer组件的弹出窗口非字母部分背板颜色默认为'#FFFFFFFF'，依照UX规范修改弹出窗口非字母部分背板颜色默认为'#00000000'。
264
265t)当前AlphabetIndexer组件的弹出窗口非字母部分点击时背板颜色默认为0x1A000000，依照UX规范修改弹出窗口非字母部分背板颜色默认为'#0c182431'。
266
267u)当前AlphabetIndexer组件的弹出窗口背板模糊材质默认为NONE，依照UX规范修改弹出窗口背板模糊材质默认为COMPONENT_REGULAR。
268
269**变更影响**
270
271该变更为非兼容性变更。API version 11及以前，采用当前默认值。API version 12及以后，采用修改后默认值。
272
273**API Level**
274
27512
276
277**变更发生版本**
278
279从OpenHarmony SDK 5.0.0.21 版本开始。
280
281**变更的接口/组件**
282
283AlphabetIndexer组件
284
285**适配指导**
286
287请查阅[AlphabetIndexer组件](../../../application-dev/reference/apis-arkui/arkui-ts/ts-container-alphabet-indexer.md)文档进行适配。
288
289## cl.arkui.6  AlphabetIndexer组件允许用户自定义AlphabetIndexer的样式风格
290
291**访问级别**
292
293公开接口
294
295**变更原因**
296
297允许用户自定义AlphabetIndexer的样式风格：
298
2991、设置AlphabetIndexer索引项背板圆角、AlphabetIndexer背板圆角自适应变化
300
3012、设置AlphabetIndexer提示弹窗索引项背板圆角、AlphabetIndexer提示弹窗背板圆角自适应变化
302
3033、设置AlphabetIndexer提示弹窗首个索引项背板颜色
304
3054、设置AlphabetIndexer提示弹窗背板模糊风格
306
307**变更影响**
308
309该变更为非兼容性变更。
310
311API version 11及以前，不允许用户自定义AlphabetIndexer索引项背板圆角、提示弹窗索引项背板圆角、提示弹窗首个索引项背板颜色、提示弹窗背板模糊风格。
312
313![AlphabetIndexerBefore](figures/AlphabetIndexerBefore.gif)
314
315API version 12及以后，允许用户自定义AlphabetIndexer索引项背板圆角、提示弹窗索引项背板圆角、提示弹窗首个索引项背板颜色、提示弹窗背板模糊风格。
316
317![AlphabetIndexerAfter](figures/AlphabetIndexerAfter.gif)
318
319**API Level**
320
32112
322
323**变更发生版本**
324
325从OpenHarmony SDK 5.0.0.21 版本开始。
326
327**示例：**
328
329```
330@Entry
331@Component
332struct AlphabetIndexerSample {
333  private arrayA: string[] = ['安']
334  private arrayB: string[] = ['卜', '白', '包', '毕', '丙']
335  private arrayC: string[] = ['曹', '成', '陈', '催']
336  private arrayL: string[] = ['刘', '李', '楼', '梁', '雷', '吕', '柳', '卢']
337  private value: string[] = ['#', 'A', 'B', 'C', 'D', 'E', 'F', 'G',
338    'H', 'I', 'J', 'K', 'L', 'M', 'N',
339    'O', 'P', 'Q', 'R', 'S', 'T', 'U',
340    'V', 'W', 'X', 'Y', 'Z']
341
342  build() {
343    Stack({ alignContent: Alignment.Start }) {
344      Row() {
345        List({ space: 20, initialIndex: 0 }){}
346        .width('50%')
347        .height('100%')
348
349        AlphabetIndexer({ arrayValue: this.value, selected: 0 })
350          .popupBackground(0xD2B48C) // 弹出框背景颜色
351          .popupBackgroundBlurStyle(BlurStyle.COMPONENT_ULTRA_THICK) // 设置AlphabetIndexer提示弹窗背板模糊风格
352          .popupTitleBackground(0x00FF00) // 设置AlphabetIndexer提示弹窗首个索引项背板颜色
353          .popupItemBorderRadius(20) // 设置AlphabetIndexer提示弹窗索引项背板圆角
354          .itemBorderRadius(5) // 设置AlphabetIndexer索引项背板圆角
355          .onSelect((index: number) => {
356            console.info(this.value[index] + ' Selected!')
357          })
358          .onRequestPopupData((index: number) => {
359            if (this.value[index] == 'A') {
360              return this.arrayA // 当选中A时，弹出框里面的提示文本列表显示A对应的列表arrayA，选中B、C、L时也同样
361            } else if (this.value[index] == 'B') {
362              return this.arrayB
363            } else if (this.value[index] == 'C') {
364              return this.arrayC
365            } else if (this.value[index] == 'L') {
366              return this.arrayL
367            } else {
368              return [] // 选中其余子母项时，提示文本列表为空
369            }
370          })
371          .onPopupSelect((index: number) => {
372            console.info('onPopupSelected:' + index)
373          })
374      }
375      .width('100%')
376      .height('100%')
377    }
378  }
379}
380```
381
382**变更的接口/组件**
383
384AlphabetIndexer组件
385
386**适配指导**
387
388请查阅[AlphabetIndexer组件](../../../application-dev/reference/apis-arkui/arkui-ts/ts-container-alphabet-indexer.md)文档进行适配。
389
390## cl.arkui.7 MenuItemGroup组件header、footer对齐方式变更
391
392**访问级别**
393
394公开接口
395
396**变更原因**
397
398优化MenuItemGroup组件header、footer的对齐方式，以提供更好的视觉效果。
399
400**变更影响**
401
402API12变更之前：header、footer与菜单文本左对齐。
403
404![MenuItemGroup组件默认值变更前效果图](figures/MenuItemGroup_HeaderAlign_Before.png)
405
406API12变更之后：header、footer与左侧图标左对齐。当header、footer较长时，变更后，菜单宽度可能自适应变窄。
407
408![MenuItemGroup组件默认值变更后效果图](figures/MenuItemGroup_HeaderAlign_After.png)
409
410**起始API Level**
411
4129
413
414**变更发生版本**
415
416从OpenHarmony SDK 5.0.0.21 版本开始。
417
418**变更的接口/组件**
419
420MenuItemGroup组件。
421
422**适配指导**
423
424UX默认行为变更，无需适配。
425
426## cl.arkui.8 DatePickerDialog列宽比例、picker上下间距、内容与弹窗边距样式变更
427
428**访问级别**
429
430公开接口
431
432**变更原因**
433
434修正视觉效果以获得更好的用户体验。
435
436**变更影响**
437
438该变更为非兼容性变更。
439
440a) DatePickerDialog列宽比例变更
441
442变更前：年/月/日选择器列宽比例为1：1：1；展示时间时，日月/上下午/时/分 选择器列宽比例为12：7：7：7。
443
444变更后：年/月/日选择器列宽比例为3：2：2；展示时间时，日月/上下午/时/分 选择器列宽比例为4：3：2：2。
445
446b) DatePickerDialog内容与弹窗左右边界间距变更
447
448变更前：内容与弹窗左右边界无间距。
449
450变更后：内容与弹窗左右边界有24vp间距。
451
452c) DatePickerDialog中picker上下间距变更
453
454变更前：dialog中datePicker无上下间距。
455
456变更后：dialog中datePicker上下间距为8vp。
457
458如下图所示为变更前后效果对比：
459
460| 变更前 | 变更后 |
461|---------|---------|
462| ![](figures/DatePickerDialog_Before.jpg) | ![](figures/DatePickerDialog_After.jpg) |
463| ![](figures/DatePickerDialogWithTime_Before.jpg) | ![](figures/DatePickerDialogWithTime_After.jpg) |
464
465**API Level**
466
467API Level 8，在API 12进行版本隔离
468
469**变更发生版本**
470
471从OpenHarmony SDK 5.0.0.21开始。
472
473**适配指导**
474
475默认行为变更，无需适配，但应注意变更后的行为是否对整体应用逻辑产生影响。
476
477## cl.arkui.9 快捷键接口keyboardShortcut匹配规则变更为严格匹配，匹配成功后拦截后续按键事件处理
478
479**访问级别**
480
481公开接口
482
483**变更原因**
484
485快捷键匹配原则过于宽松，例如绑定了CTRL+A的快捷键事件，实际使用CTRL+SHIFT+A依然能成功触发该事件。
486快捷键事件被匹配并消费后依然会继续下发，并可能触发后续按键事件，例如被输入法响应。
487
488**变更影响**
489
490该变更为非兼容性变更。
491
492变更前：绑定的快捷键是当前已触发按键的子集，即可触发快捷键。触发快捷键后，按键事件会继续触发`onKeyEvent`事件等其他按键事件。
493
494变更后：绑定的快捷键必须与当前触发的按键完全一致，方能触发快捷键。触发快捷键即视为按键已消费，不再触发其他按键事件。
495
496**API Level**
497
49810
499
500**变更发生版本**
501
502从OpenHarmony SDK 5.0.0.19开始。
503
504**适配指导**
505
506快捷键的按键集合严格对应所需要的按键。
507
508## cl.arkui.10 onPageHide变更
509
510**访问级别**
511
512公开接口
513
514**变更背景**
515
516当前router中会在页面创建之前调用onPageHide生命周期，但是对应页面实际上并没有隐藏。
517
518**变更影响**
519
520该行为变更为非兼容性变更。
521
522**API Level**
523
524API Level 7，在API Version 12生效。
525
526**变更发生版本**
527
528从OpenHarmony SDK 5.0.0.21开始。
529
530**变更的接口/组件**
531
532涉及接口 [onPageHide](../../../application-dev/reference/apis-arkui/arkui-ts/ts-custom-component-lifecycle.md#onpagehide)。
533
534API Version 12前：页面生命周期先触发退出页面隐藏onPageHide,再触发进场页面的aboutToAppear
535
536API Version 12后：页面跳转时，先触发进来页面的创建生命周期aboutToAppear,再触发退出页面的onPageHide生命周期。
537
538**适配指导**
539
540依赖退出页面的onPageHide与进场页面的aboutToAppear生命周期执行的场景可以在aboutToAppear中通过事件通知机制，将触发退出页面的onPageHide中的实现逻辑。
541
542## cl.arkui.11 NavDestination生命周期变更
543
544**访问级别**
545
546公开接口
547
548**变更原因**
549
5501. NavDestination组件有转场动画场景和无转场动画场景生命周期不一致。
551
5522. NavDestination所在自定义组件销毁生命周期早于Destination的销毁生命周期。
553
554**变更影响**
555
556该变更为非兼容性变更。如果开发者依赖Destination所在外层自定义组件onAboutToDisAppear以及Destination的onDisAppear生命周期执行顺序可能会受到影响。
557
558**起始API Level**
559
560API Level 10
561
562**变更发生版本**
563
564从OpenHarmony SDK 5.0.0.21开始。
565
566**变更的接口/组件**
567
568[NavDestination](../../../application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-navdestination.md)生命周期
569
570变更前:
571
572| 变更前有动画 | 变更前无动画 |
573|---|---|
574|![](./figures/navigation_lifecycle_before.PNG) | ![](./figures/navigation_lifecycle_before_without_animtion.PNG) |
575
5761. 有动画场景：onAboutToAppear(进场NavDestination页面) -> onAppear(进场NavDestination页面) -> onHidden(退出NavDestination页面) -> onShown(进场NavDestination页面) -> onAboutToDisAppear(退场NavDestination页面) -> onDisAppear(退场NavDestination页面)。
577
5782. 无动画场景：
579onAboutToAppear(进场NavDestination页面) -> onAppear(进场NavDestination页面) -> onHidden(退出NavDestination页面) -> onAboutToDisAppear(退场NavDestination页面) -> onDisAppear(退场NavDestination页面)-> onShown(进场NavDestination页面)。
580
581变更后：
582![](./figures/navigation_lifecycle_after.PNG)
583onAboutToAppear(进场NavDestination页面)->onAppear(进场NavDestination页面) -> onHidden(退出NavDestination页面) -> onShown(进场NavDestination页面) -> onDisAppear(退出NavDestination页面) -> onAboutToDisAppear(退出NavDestination页面)。
584
585**适配指导**
586
587依赖进场页面的aboutToAppear与退场页面aboutToDisAppear执行时间先后顺序的场景，可以将aboutToDisAppear生命周期转到willDisAppear生命周期中或者Navigation路由拦截setInterception的didShow回调中处理。
588
589## cl.arkui.12 select组件样式变更
590
591**访问级别**
592
593公开接口
594
595**变更原因**
596
597提供小型化Select组件下拉按钮，相比于正常尺寸更小，以满足开发者在不同场景下的需求，获得更好的用户体验。
598
599**变更影响**
600
601该变更为非兼容性变更。
602
6031. 新增加controlSize设置select下拉按钮默认尺寸（NORMAL、SMALL）
604
605涉及属性列表：
606
607| 属性         | NORMAL 组件                        | SMALL 组件               |
608| ------------ | --------------------------------- | --------------------------------- |
609| 背板高度     | 40vp                              | 28vp                              |
610| 背板最小宽度 | 68vp                              | 56vp                              |
611| 背板圆角     | 20vp                              | 14vp                              |
612| 图标高度     | 24vp                              | 20vp                              |
613| 图标宽度     | 12vp                              | 10vp                              |
614| 图标间距     | 上间距8vp 、右间距16vp、下间距8vp   | 上间距4vp 、右间距12vp、下间距4vp   |
615| 文本大小     | 16fp                              | 14fp                              |
616| 文本间距     | 上间距8vp 、左间距16vp、下间距8vp   | 上间距4vp 、左间距12vp、下间距4vp   |
617
618变更前，NORMAL的背板最小宽度是66vp；
619
620![select_min_width_66vp_api11](figures/select_min_width_66vp_api11.png)
621
622变更后，NORMAL的背板最小宽度是68vp；
623
624![select_min_width_68vp_api12](figures/select_min_width_68vp_api12.png)
625
6262. 修改select下拉按钮默认颜色，
627
628变更前，默认背景颜色是系统资源中的`ohos_id_color_card_bg`；
629
630![select_default_backgroundColor_api11](figures/select_default_backgroundColor_api11.png)
631
632变更后，默认背景颜色是系统资源中的`ohos_id_color_button_normal`。
633
634![select_default_backgroundColor_api12](figures/select_default_backgroundColor_api12.png)
635
6363. controlSize、width、height接口作用优先级：
637
638   1）如果开发者只设置了width和height，当文字大小设置的是比较大的值的时候，文字超出组件大小，且以省略号方式显示；
639
640   2）如果开发者只设置了controlSize，没有设置width和height，组件宽高自适应文字，文字不超出组件，并设置最小宽度minWidth和最小高度minHeight；
641
642   3）如果controlSize、width、height接口都设置了，width和height设置的值生效，但如果width和height设置的值小于controlSize设置的最小宽度minWidth和最小高度minHeight，width和height设置的值不生效，宽高仍保持controlSize设置的最小宽度minWidth和最小高度minHeight。
643
644      宽度和高度随字体大小自适应示意图：
645
646      ![select_adaptation](figures/select_adaptation.gif)
647
6484. disabled状态的select下拉按钮背景色的opacity：
649
650变更前，disabled状态的select下拉按钮背景色不透明。
651
652![select_disabled_opacity_api11](figures/select_disabled_opacity_api11.png)
653
654变更后，disabled状态的select下拉按钮背景色与字体的opacity一致。
655
656![select_disabled_opacity_api12](figures/select_disabled_opacity_api12.png)
657
658**起始 API Level**
659
66012
661
662**变更发生版本**
663
664从OpenHarmony SDK 5.0.0.21 版本开始。
665
666**变更的接口/组件**
667
668Select组件
669
670**适配指导**
671
672请查阅[select组件](../../../application-dev/reference/apis-arkui/arkui-ts/ts-basic-components-select.md)文档进行适配。
673
674## cl.arkui.13 富文本的SetSelection接口，光标行为变更
675
676**访问级别**
677
678公开接口
679
680**变更原因**
681
682依照UX规范
683
684**变更影响**
685
686该变更为非兼容性变更。API version 11及以前：
687
688SetSelection接口start=end!=-1时，将光标移动到start位置。
689
690API version 12及以后：
691
692SetSelection接口start=end!=-1时，视为选中失败，不改变光标位置。
693
694| 变更前 | 变更后 |
695|---------|---------|
696| ![](figures/richeditor_setselection_before.gif) | ![](figures/richeditor_setselection_after.gif) |
697
698**起始 API Level**
699
70011
701
702**变更发生版本**
703
704从OpenHarmony SDK 5.0.0.21 版本开始。
705
706**变更的接口/组件**
707
708RichEditor组件。
709
710**适配指导**
711
712默认效果变更，无需适配，但应注意变更后的默认效果是否符合开发者预期，如不符合则应自定义修改效果控制变量以达到预期。
713
714## cl.arkui.14 NavDestination标题栏按钮默认背板、标题字体字号等默认样式变更
715
716**访问级别**
717
718公开接口
719
720**变更原因**
721
722UX样式变更
723
724**变更影响**
725
726该变更为非兼容性变更，只影响NavDestination组件的默认样式。
727
728- 变更前
729  1. NavDestination标题栏按钮无背板。
730  2. NavDestination标题栏主标题字重为MEDIUM。
731
732- 变更后
733  1. NavDestination标题栏按钮增加圆形背板。
734  2. NavDestination标题栏主标题字重为BOLD。
735  3. NavDestination默认返回按钮图标更新。
736
737  如下图所示为变更前后效果对比：
738
739 | 变更前 | 变更后 |
740|---------|---------|
741| ![](figures/NavDestination_Before.png)  |  ![](figures/NavDestination_After.png)  |
742
743**起始 API Level**
744
745API 9
746
747**变更发生版本**
748
749从OpenHarmony SDK 5.0.0.21 版本开始。
750
751**变更的接口/组件**
752
753NavDestination组件。
754
755**适配指导**
756
757默认效果变更，无需适配，但应注意变更后的默认效果是否符合开发者预期，如不符合则应自定义修改效果控制变量以达到预期。
758
759## cl.arkui.15 EditableTitleBar默认样式变化
760
761**访问级别**
762
763公开接口
764
765**变更原因**
766
767UX样式增强
768
769**变更影响**
770
771该变更为非兼容性变更。
772
773变更前：
7741. 主标题字重为Regular；
7752. 图标大小为24*24；
7763. 图标热区大小为48*48，圆角方形；
7774. 标题栏高度为56vp；
7785. 标题与左侧图标间距12vp。
779
780变更后：
7811. 主标题字重为Bold；
7822. 图标大小为20*20；
7833. 图标增加40*40灰色圆形背板；
7844. 标题栏最小高度为56vp，标题上下间距4vp，超过56vp时，高度自适应；
7855. 标题与左侧图标间距8vp。
786
787back图标样式变更。
788
789变更前后对比效果，如下图所示：
790| 变更前 | 变更后 |
791|---------|---------|
792| ![](figures/EditableTitleBar_Before.jpg) | ![](figures/EditableTitleBar_After.png) |
793
794**起始API Level**
795
79610
797
798**变更发生版本**
799
800从OpenHarmony SDK 5.0.0.21 版本开始。
801
802**变更的接口/组件**
803
804EditableTitleBar
805
806**适配指导**
807
808默认效果变更，无需适配。但应注意变更后的默认效果是否符合预期。
809
810
811## cl.arkui.16 Navigation默认样式变化
812
813**访问级别**
814
815公开接口
816
817**变更原因**
818
819UX样式增强
820
821**变更影响**
822
823该变更为非兼容性变更。
824
825变更前：
8261. Full、Free模式非自定义主标题字重为Medium；
8272. Menu图标大小为24*24；
8283. Menu图标热区大小为48*48，圆角方形；
8294. 标题栏左、右间距为24vp；
8305. Free模式收齐时，非自定义主标题字号为24fp。
831
832变更后：
8331. Full、Free模式非自定义主标题字重为Bold；
8342. Menu图标大小为20*20；
8353. Menu图标增加40*40灰色圆形背板；
8364. 标题栏左、右间距为16vp；
8375. Free模式收齐时，非自定义主标题字号为26fp。
838
839变更前后对比效果，如下图所示：
840| 变更前 | 变更后 |
841|---------|---------|
842| ![](figures/NavigationFull_Before.jpeg) | ![](figures/NavigationFull_After.jpeg) |
843| ![](figures/NavigationFree_Before.jpeg) | ![](figures/NavigationFree_After.jpeg) |
844
845**起始API Level**
846
8478
848
849**变更发生版本**
850
851从OpenHarmony SDK 5.0.0.21 版本开始。
852
853**变更的接口/组件**
854
855EditableTitleBar
856
857**适配指导**
858
859默认效果变更，无需适配。但应注意变更后的默认效果是否符合预期。
860
861## cl.arkui.17 TimePicker时分秒前置零默认样式变更
862
863**访问级别**
864
865公开接口
866
867**变更原因**
868
869UX样式变更
870
871**变更影响**
872
873该变更为非兼容性变更，只影响TimePicker组件的默认样式。
874
875- 变更前
876  TimePicker组件12小时制小时默认有前置零。
877
878- 变更后
879  TimePicker组件12小时制小时默认没有前置零。
880
881  如下图所示为变更前后效果对比：
882
883 | 变更前 | 变更后 |
884|---------|---------|
885| ![](figures/TimePicker_Before.png)  |  ![](figures/TimePicker_After.png)  |
886
887**起始 API Level**
888
889API 12
890
891**变更发生版本**
892
893从OpenHarmony SDK 5.0.0.21 版本开始。
894
895**变更的接口/组件**
896
897TimePicker组件。
898
899**适配指导**
900
901默认效果变更，无需适配，但应注意变更后的默认效果是否符合开发者预期，如不符合则应自定义修改效果控制变量以达到预期。
902
903## cl.arkui.18 RichEditor组件symbol动效变更
904
905**访问级别**
906
907公开接口
908
909**变更原因**
910
911依照UX规范
912
913**变更影响**
914
915该变更为非兼容性变更。
916
917变更前：
918RichEditor组件在编辑态支持播放symbol动效。
919
920变更后：
921RichEditor组件在编辑态不支持播放symbol动效。
922
923**起始API Level**
924
92511
926
927**变更发生版本**
928
929从OpenHarmony SDK 5.0.0.21 版本开始。
930
931**变更的接口/组件**
932
933RichEditor
934
935**适配指导**
936
937默认效果变更，无需适配。
938
939## cl.arkui.19 allowDrop校验变更
940
941**访问级别**
942
943公开接口
944
945**变更原因**
946
947allowDrop用于接受方组件指定自己支持的拖拽数据类型，并将该值应用到拖拽方组件的角标显示上。但没有严格执行不匹配时的禁止落入逻辑，仍然会回调开发者的onDrop并传递数据。
948
949**变更影响**
950
951该变更为不兼容变更。
952
953变更前：
954当allowDrop声明的数据类型与拖拽组件的数据类型完全不匹配时，仍然会回调开发者设置的onDrop并传递数据。
955
956变更后：
957当allowDrop声明的数据类型与拖拽组件的数据类型完全不匹配时，不会回调开发者设置的onDrop。
958
959**起始API Level**
960
96112
962
963**变更发生版本**
964
965从OpenHarmony SDK 5.0.0.21 版本开始。
966
967**变更的接口/组件**
968
969allowDrop
970
971**适配指导**
972
9731.  以下两种情况无影响，无需适配：
974
975    （1）未配置allowDrop属性，系统默认其可处理所有类型数据。
976
977    （2）配置了数据类型，且onDrop中也可处理配置的数据类型。
978
9792.  以下情况会受到影响，需适配：
980
981    配置了allowDrop属性，并声明了一些数据类型。但是，onDrop会对未声明过的数据类型进行处理，可在allowdrop中增加onDrop需要处理的数据类型声明。
982
983    **示例：**
984
985    ```
986    // xxx.ets
987
988    @Entry
989    @Component
990    struct ImageExample {
991      @State uri: string = ""
992      @State AblockArr: string[] = []
993      @State BblockArr: string[] = []
994      @State AVisible: Visibility = Visibility.Visible
995      @State dragSuccess :Boolean = false
996      @State dragDataTypes: UniformDataType[] | null = [ null ]
997
998      build() {
999        Column() {
1000          Text('Image拖拽')
1001            .fontSize('30dp')
1002          Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceAround }) {
1003            Image($r('app.media.icon'))
1004              .width(100)
1005              .height(100)
1006              .border({ width: 1 })
1007              .visibility(this.AVisible)
1008              .draggable(true)
1009              .onDragEnd((event: DragEvent) => {
1010                let ret = event.getResult();
1011                if(ret == 0) {
1012                  console.log("enter ret == 0")
1013                  this.AVisible = Visibility.Hidden;
1014                } else {
1015                  console.log("enter ret != 0")
1016                  this.AVisible = Visibility.Visible;
1017                }
1018              })
1019          }
1020          .margin({ bottom: 20 })
1021          Row() {
1022            Column(){
1023              List(){
1024                ForEach(this.AblockArr, (item:string, index) => {
1025                  ListItem() {
1026                    Image(item)
1027                      .width(100)
1028                      .height(100)
1029                      .border({width: 1})
1030                  }
1031                  .margin({ left: 30 , top : 30})
1032                }, (item:string) => item)
1033              }
1034              .height('90%')
1035              .width('100%')
1036              .allowDrop(this.dragDataTypes)
1037              .onDrop((event?: DragEvent, extraParams?: string) => {
1038                this.uri = JSON.parse(extraParams as string).extraInfo;
1039                this.AblockArr.splice(JSON.parse(extraParams as string).insertIndex, 0, this.uri);
1040                console.log("ondrop not udmf data");
1041              })
1042              .border({width: 1})
1043            }
1044            .height("50%")
1045            .width("45%")
1046          }
1047        }.width('100%')
1048      }
1049    }
1050    ```