• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# ArkUI子系统Changelog
2
3## cl.arkui.1 ChipGroup选项后缀图标属性变更
4
5**访问级别**
6
7公开接口
8
9**变更原因**
10
11 ChipGroup 选项后缀图标需要支持配置无障碍信息以实现屏幕朗读功能，而前缀图标不需要实现屏幕朗读功能，同时后缀图标配置参数（suffixIcon）与前缀图标配置参数（prefixIcon）共用了同一个数据类型（IconOptions），不可以直接扩展IconOptions参数。因此决定废弃suffixIcon配置参数，并提供suffixImageIcon替代。
12
13**变更影响**
14
15该变更为不兼容性变更。
16
17变更前：使用suffixIcon配置ChipGroup选项的后缀图标信息；
18
19变更后：使用suffixImageIcon配置ChipGroup选项的后缀图标信息。
20
21**起始API Level**
22
2312
24
25**变更发生版本**
26
27从OpenHarmony SDK 5.0.0.51开始
28
29**变更的接口/组件**
30
31废弃suffixIcon配置参数，并新增suffixImageIcon替代。
32
33**适配指导**
34
35使用suffixImageIcon配置ChipGroup选项的后缀图标信息。示例如下:
36
37```ts
38import { ChipGroup, IconGroupSuffix, SymbolGlyphModifier } from '@kit.ArkUI';
39
40@Builder function DefaultFunction(): void {}
41
42@Component
43struct SectionGroup {
44  @Prop
45  @Require
46  title: ResourceStr;
47  @BuilderParam
48  @Require
49  content: () => void = DefaultFunction;
50
51  build() {
52    Column({ space: 4 }) {
53      Text(this.title)
54        .fontColor('#FF666666')
55        .fontSize(12)
56      Column({ space: 8 }) {
57        this.content()
58      }
59    }
60    .alignItems(HorizontalAlign.Start)
61    .width('100%')
62  }
63}
64@Component
65struct SectionItem {
66  @Prop
67  @Require
68  title: ResourceStr;
69  @BuilderParam
70  @Require
71  content: () => void = DefaultFunction;
72
73  build() {
74    Column({ space: 12 }) {
75      Text(this.title)
76      this.content()
77    }
78    .backgroundColor('#FFFFFFFF')
79    .borderRadius(12)
80    .padding(12)
81    .width('100%')
82  }
83}
84
85@Entry
86@Component
87export struct ChipGroupExample2 {
88  @LocalBuilder
89  Suffix() {
90    IconGroupSuffix({
91      items: [
92        {
93          icon: { src: $r('sys.media.ohos_ic_public_more'), },
94          accessibilityText: '更多',
95          accessibilityDescription: '新手提醒',
96          action: () => {
97            this.getUIContext().getPromptAction().showToast({
98              message: '更多按钮被点击！'
99            });
100          }
101        },
102        {
103          symbol: new SymbolGlyphModifier($r('sys.symbol.more'))
104            .accessibilityText('更多')
105            .accessibilityDescription('新手提醒'),
106          action: () => {
107            this.getUIContext().getPromptAction().showToast({
108              message: '更多按钮被点击！'
109            });
110          }
111        },
112        {
113          icon: { src: $r('sys.media.ohos_ic_public_more'), },
114          accessibilityText: '更多',
115          accessibilityDescription: '新手提醒',
116          accessibilityLevel: 'no',
117          action: () => {
118            this.getUIContext().getPromptAction().showToast({
119              message: '更多按钮被点击！'
120            });
121          }
122        }
123      ]
124    })
125  }
126
127  build() {
128    NavDestination() {
129      Scroll() {
130        Column({ space: 12 }) {
131          SectionGroup({ title: '可用的' }) {
132            SectionItem({ title: '单选 无后缀区域' }) {
133              ChipGroup({
134                items: [
135                  {
136                    prefixIcon: {
137                      src: $r('app.media.startIcon')
138                    },
139                    label: { text: "选项1" },
140                    suffixImageIcon: {
141                      src: $r('sys.media.save_button_picture'),
142                      accessibilityText: '保存',
143                      action: () => {
144                        this.getUIContext().getPromptAction().showToast({
145                          message: '后缀图标被点击！'
146                        });
147                      },
148                    }
149                  },
150                  {
151                    label: { text: "选项2" },
152                    suffixSymbol: {
153                      normal: new SymbolGlyphModifier($r('sys.symbol.save')),
154                      activated: new SymbolGlyphModifier($r('sys.symbol.save'))
155                    },
156                    suffixSymbolOptions: {
157                      normalAccessibility: {
158                        accessibilityText: '保存'
159                      },
160                      action: () => {
161                        this.getUIContext().getPromptAction().showToast({
162                          message: '后缀图标被点击！'
163                        });
164                      }
165                    }
166                  },
167                  {
168                    label: { text: "选项3" },
169                    suffixIcon: { src: $r('sys.media.save_button_picture'), }
170                  },
171                  { label: { text: "选项4" } },
172                  { label: { text: "选项5" } },
173                  { label: { text: "选项6" } },
174                  { label: { text: "选项7" } },
175                  { label: { text: "选项8" } },
176                  { label: { text: "选项9" } },
177                ]
178              })
179            }
180          }
181        }
182      }
183    }
184    .title('基础用法')
185    .backgroundColor('#F1F3F5')
186  }
187}
188```
189
190## cl.arkui.2 ImageAttributeModifier支持new方式创建ColorFilter对象传入colorFilter接口变更
191
192**访问级别**
193
194公开接口
195
196**变更原因**
197
198ImageAttributeModifier不支持new方式创建ColorFilter对象传入colorFilter接口，修复后即可增加colorFilter接口的支持范围，并且ColorFilter在业务代码中传递更加便捷。
199
200**变更影响**
201
202该变更为不兼容变更。
203
204变更前：ImageAttributeModifier不支持new方式创建ColorFilter对象传入colorFilter接口。
205
206变更后：ImageAttributeModifier支持new方式创建ColorFilter对象传入colorFilter接口。
207
208**起始API Level**
209
210API 9
211
212**变更发生版本**
213
214从OpenHarmony SDK 5.0.0.51开始。
215
216**变更的接口/组件**
217
218ImageAttributeModifier的colorFilter接口。
219
220**适配指导**
221
222已知bug修复，无需适配。使用ImageAttributeModifier的colorFilter接口时，已经支持new方式创建ColorFilter对象传入接口中。示例如下:
223
224```ts
225class ColorFilterModifier implements AttributeModifier<ImageAttribute> {
226  private colorFilter: ColorFilter | undefined = undefined
227
228  constructor(colorFilter: ColorFilter) {
229    this.colorFilter = colorFilter
230  }
231
232  applyNormalAttribute(instance: ImageAttribute): void {
233    instance.colorFilter(this.colorFilter)
234  }
235}
236
237
238@Entry
239@Component
240struct ColorFilters {
241  @State modifier: ColorFilterModifier = new ColorFilterModifier(new ColorFilter([0.1, 0.1, 0.1, 0.1, 0.1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0.8, 0,]))
242
243  build() {
244    Column() {
245      Image($r('app.media.startIcon'))
246        .width(100)
247        .height(100)
248        .attributeModifier(this.modifier)
249    }
250    .height('100%')
251    .width('100%')
252  }
253}
254```
255
256## cl.arkui.3  空格/回车响应按键事件行为变更
257
258**访问级别**
259
260公开接口
261
262**变更原因**
263
264空格键和回车键能够默认触发获焦组件的点击事件。即便当前界面未进入焦点激活状态（即未显示焦点框），这些按键依然会触发相应的事件。
265
266**变更影响**
267
268影响范围：依赖空格键/回车键响应点击事件的应用；
269
270- 变更前：组件获焦，无需进入焦点激活态，空格/回车可以触发点击事件。
271- 变更后：组件获焦且界面进入焦点激活态，空格/回车才可以触发点击事件。
272
273
274**起始API Level**
275
2767
277
278**变更发生版本**
279
280从OpenHarmony SDK 5.0.0.51 版本开始。
281
282**变更的接口/组件**
283
284不涉及
285
286**适配指导**
287
288系统行为变更，应用无需进行适配。如果应用需要在非聚焦状态下使组件响应点击事件，适配方案是在原绑定点击事件的组件上新增按键事件绑定，因为按键事件的触发不依赖于聚焦状态。示例如下：
289
290**示例**
291
292```ts
293import { KeyCode } from '@kit.InputKit';
294
295@Entry
296@Component
297struct KeyEventExample {
298  @State text1: string = "can not respond event"
299  @State text2: string = "can not respond event"
300
301  build() {
302    Column() {
303      Text(this.text1)
304      // Button中仅包含onClick事件，在非走焦态的时，即使Button获焦，空格键和回车键依然不响应onClick事件。
305      Button('KeyEvent')
306        .onClick(() => {
307          this.text1 = 'respond click event'
308        })
309      Text(this.text2)
310      // 若需要在非走焦态下，Button获焦且空格键或回车键能够响应，需要通过增加onKeyEvent事件来触发。
311      Button('KeyEvent')
312        .onClick(() => {
313          this.text2 = 'respond click event'
314        })
315        .onKeyEvent((event?: KeyEvent) => {
316          if (event && event.type == KeyType.Down &&
317            (event.keyCode == KeyCode.KEYCODE_ENTER || event.keyCode == KeyCode.KEYCODE_NUMPAD_ENTER ||
318              event.keyCode == KeyCode.KEYCODE_SPACE)) {
319            this.text2 = 'respond onKeyEvent event'
320            return true
321          }
322          return false
323        })
324    }
325  }
326}
327```