• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# Accessibility
2
3You can set accessibility attributes and events for components.
4
5>  **NOTE**
6>
7>  The APIs of this module are supported since API version 10. Updates will be marked with a superscript to indicate their earliest API version.
8
9## accessibilityGroup
10
11accessibilityGroup(value: boolean)
12
13Sets whether to enable accessibility grouping. When accessibility grouping is enabled, the component and all its children are treated as a single selectable unit, and the accessibility service will no longer focus on the individual child components.
14
15If accessibility grouping is enabled and the component does not contain a universal text attribute or an [accessibility text](#accessibilitytext) attribute, the system will concatenate the universal text attributes of its child components to form a merged text for the component. If a child component lacks a universal text attribute, it will be ignored in the concatenation process. The merged text will not use the accessibility text of the child components.
16
17**Widget capability**: This API can be used in ArkTS widgets since API version 12.
18
19**Atomic service API**: This API can be used in atomic services since API version 11.
20
21**System capability**: SystemCapability.ArkUI.ArkUI.Full
22
23**Parameters**
24
25| Name| Type   | Mandatory| Description                                                        |
26| ------ | ------- | ---- | ------------------------------------------------------------ |
27| value  | boolean | Yes  | Whether to enable accessibility grouping. When accessibility grouping is enabled, the component and all its children are treated as a single selectable unit, and the accessibility service will no longer focus on the individual child components.<br>Default value: **false**|
28
29## accessibilityGroup<sup>14+</sup>
30
31accessibilityGroup(isGroup: boolean, accessibilityOptions: AccessibilityOptions)
32
33Sets whether to enable accessibility grouping, with support for prioritizing the concatenation of accessibility text for accessibility announcement. When accessibility grouping is enabled, the component and all its children are treated as a single selectable entity, and the accessibility service will no longer focus on the individual child components.
34
35If accessibility grouping is enabled and the component does not contain a universal text attribute or an [accessibility text](#accessibilitytext) attribute, the system will concatenate the universal text attributes of its child components to form a merged text for the component. If a child component lacks a universal text attribute, it will be ignored in the concatenation process.
36
37When **accessibilityPreferred** is set to **true**, the system will prioritize concatenating the accessibility text attributes of the child components to form the merged text. If a child component lacks an accessibility text attribute, the system will continue to concatenate its universal text attribute. If a child component lacks both, it will be ignored.
38
39**Widget capability**: This API can be used in ArkTS widgets since API version 14.
40
41**Atomic service API**: This API can be used in atomic services since API version 14.
42
43**System capability**: SystemCapability.ArkUI.ArkUI.Full
44
45**Parameters**
46
47| Name              | Type                                                   | Mandatory| Description                                                        |
48| -------------------- | ------------------------------------------------------- | ---- | ------------------------------------------------------------ |
49| isGroup              | boolean                                                 | Yes  | Whether to enable accessibility grouping. When accessibility grouping is enabled, the component and all its children are treated as a single selectable unit, and the accessibility service will no longer focus on the individual child components.<br>Default value: **false**|
50| accessibilityOptions | [AccessibilityOptions](#accessibilityoptions14) | Yes  | Options for accessibility grouping. When **accessibilityPreferred** is set to **true**, the system will prioritize concatenating the accessibility text attributes of the child components to form the merged text.<br>Default value: **false**           |
51
52## AccessibilityOptions<sup>14+</sup>
53
54**System capability**: SystemCapability.ArkUI.ArkUI.Full
55
56| Name                  | Type   | Mandatory| Description                                                        |
57| ---------------------- | ------- | ---- | ------------------------------------------------------------ |
58| accessibilityPreferred | boolean | No  | Whether to prioritize the accessibility text of child components during a deep traversal. The value **true** means to prioritize the accessibility text of child components.<br>If a child component's accessibility text is empty, the accessibility service uses the component's own text content. The concatenated text is then assigned to the parent node if both its accessibility text and text content are empty.<br>Default value: **false**|
59
60## accessibilityText
61
62accessibilityText(value: string)
63
64Sets the accessibility text. When a component does not contain a text attribute, you can use this API to set an accessibility text attribute, so that accessibility services can announce the specified content for the component.
65
66**Widget capability**: This API can be used in ArkTS widgets since API version 12.
67
68**Atomic service API**: This API can be used in atomic services since API version 11.
69
70**System capability**: SystemCapability.ArkUI.ArkUI.Full
71
72**Parameters**
73
74| Name| Type  | Mandatory| Description                                                        |
75| ------ | ------ | ---- | ------------------------------------------------------------ |
76| value  | string | Yes  | Accessibility text. If a component does not contain text information, it will not be announced by the screen reader when selected. In this case, the screen reader user cannot know which component is selected. To solve this problem, you can set accessibility text for components without text information. When such a component is selected, the screen reader announces the specified accessibility text, informing the user which component is selected.<br>Default value: **""**<br>**NOTE**<br>If a component has both text content and accessibility text, only the accessibility text is announced.<br>If a component is grouped for accessibility purposes but lacks both text content and accessibility text, the screen reader will concatenate text from its child components (depth-first traversal).<br>To prioritize accessibility text concatenation, set **accessibilityPreferred** in **accessibilityGroup**.|
77
78## accessibilityText<sup>12+</sup>
79
80accessibilityText(text: Resource)
81
82Sets the accessibility text, with support for resource references using **Resource**. When a component does not contain a text attribute, you can use this API to set an accessibility text attribute, so that accessibility services can announce the specified content for the component.
83
84**Widget capability**: This API can be used in ArkTS widgets since API version 12.
85
86**Atomic service API**: This API can be used in atomic services since API version 12.
87
88**System capability**: SystemCapability.ArkUI.ArkUI.Full
89
90**Parameters**
91
92| Name| Type  | Mandatory| Description                                                                                                                                                                                                                                                                  |
93| ------ | ------ | ---- |----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
94| text  | [Resource](ts-types.md#resource) | Yes  | Reference resource of accessibility text. If a component does not contain text information, it will not be announced by the screen reader when selected. In this case, the screen reader user cannot know which component is selected. To solve this problem, you can set accessibility text for components without text information. When such a component is selected, the screen reader announces the specified accessibility text, informing the user which component is selected.<br>**NOTE**<br>If a component has both text content and accessibility text, only the accessibility text is announced.<br>If a component is grouped for accessibility purposes but lacks both text content and accessibility text, the screen reader will concatenate text from its child components (depth-first traversal).<br>To prioritize accessibility text concatenation, set **accessibilityPreferred** in **accessibilityGroup**.|
95
96
97## accessibilityDescription
98
99accessibilityDescription(value: string)
100
101Sets the accessibility description. This property provides additional context or explanation for the component, helping users understand the action or function it performs.
102
103**Widget capability**: This API can be used in ArkTS widgets since API version 12.
104
105**Atomic service API**: This API can be used in atomic services since API version 11.
106
107**System capability**: SystemCapability.ArkUI.ArkUI.Full
108
109**Parameters**
110
111| Name| Type  | Mandatory| Description                                                        |
112| ------ | ------ | ---- | ------------------------------------------------------------ |
113| value  | string | Yes  | Accessibility description. You can specify further explanation of the current component, for example, possible operation consequences, especially those that cannot be learned from component attributes and accessibility text. If a component contains both text information and the accessibility description, the text is read first and then the accessibility description, when the component is selected.<br>Default value: **""**|
114
115## accessibilityDescription<sup>12+</sup>
116
117accessibilityDescription(description: Resource)
118
119Sets the accessibility description, with support for resource references using **Resource**. This property provides additional context or explanation for the component, helping users understand the action or function it performs.
120
121**Widget capability**: This API can be used in ArkTS widgets since API version 12.
122
123**Atomic service API**: This API can be used in atomic services since API version 12.
124
125**System capability**: SystemCapability.ArkUI.ArkUI.Full
126
127**Parameters**
128
129| Name| Type  | Mandatory| Description                                                                                                                                                                                   |
130| ------ | ------ | ---- |---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
131| description  | [Resource](ts-types.md#resource) | Yes  | Reference resource of the accessibility description. You can specify further explanation of the current component, for example, possible operation consequences, especially those that cannot be learned from component attributes and accessibility text. If a component contains both text information and the accessibility description, the text is read first and then the accessibility description, when the component is selected.|
132
133## accessibilityLevel
134
135accessibilityLevel(value: string)
136
137Sets the accessibility level. This property determines whether the component can be recognized by accessibility services.
138
139**Widget capability**: This API can be used in ArkTS widgets since API version 12.
140
141**Atomic service API**: This API can be used in atomic services since API version 11.
142
143**System capability**: SystemCapability.ArkUI.ArkUI.Full
144
145**Parameters**
146
147| Name| Type  | Mandatory| Description                                                        |
148| ------ | ------ | ---- | ------------------------------------------------------------ |
149| value  | string | Yes  | Accessibility level, which is used to decide whether a component can be identified by the accessibility service.<br>The options are as follows:<br>**"auto"**: The component's recognizability is determined by the accessibility grouping service and ArkUI.<br>**"yes"**: The component can be recognized by accessibility services.<br>**"no"**: The component cannot be recognized by accessibility services.<br>**"no-hide-descendants"**: Neither the component nor its child components can be recognized by accessibility services.<br>Default value: **"auto"**<br>**NOTE**<br>When accessibilityLevel is set to **"auto"**, the component's recognizability depends on the following factors:<br>1. The accessibility service internally determines whether the component can be recognized.<br>2. If the parent component's **accessibilityGroup** property has **isGroup** set to **true**, the accessibility service will not focus on its child components, making them unrecognizable.<br>3. If the parent component's **accessibilityLevel** is set to **"no-hide-descendants"**, the component will not be recognized by accessibility services.|
150
151## accessibilityVirtualNode<sup>11+</sup>
152
153accessibilityVirtualNode(builder: CustomBuilder)
154
155Sets an accessibility virtual child node. For custom drawing components, a **CustomBuilder** is passed, which is used to provide accessibility information. The components within the **CustomBuilder** are only used for layout and not for display. When the accessibility service obtains node information, it returns the node information from the **CustomBuilder**.
156
157**Widget capability**: This API can be used in ArkTS widgets since API version 12.
158
159**Atomic service API**: This API can be used in atomic services since API version 11.
160
161**System capability**: SystemCapability.ArkUI.ArkUI.Full
162
163**Parameters**
164
165| Name| Type  | Mandatory| Description                                                        |
166| ------ | ------ | ---- | ------------------------------------------------------------ |
167| builder  | [CustomBuilder](ts-types.md#custombuilder8) | Yes  | Accessibility virtual node, which enables you to pass in a custom builder to the self-drawing component. The components in the custom builder are only laid out but not displayed at the backend. When the accessibility application obtains the accessibility node information, the node information in the custom builder is returned.|
168
169## accessibilityChecked<sup>13+</sup>
170
171accessibilityChecked(isCheck: boolean)
172
173Sets the checked state of the accessibility component. This property is used in multiselect scenarios.
174
175**Widget capability**: This API can be used in ArkTS widgets since API version 13.
176
177**Atomic service API**: This API can be used in atomic services since API version 13.
178
179**System capability**: SystemCapability.ArkUI.ArkUI.Full
180
181**Parameters**
182
183| Name | Type   | Mandatory| Description                                                        |
184| ------- | ------- | ---- | ------------------------------------------------------------ |
185| isCheck | boolean | Yes  | Whether the current component is selected.<br>The options are as follows:<br>**true**: The component is selected.<br>**false**: The component is not selected.<br>**undefined**: The component determines its own selected state.<br>Default value: **undefined**<br>**NOTE**<br>1. Setting this parameter to **true** or **false** will automatically set the component's **checkable** attribute to **true**.<br>2. When this parameter is set to **true** or **false**, to use it with **accessibilitySelected**, set the **accessibilitySelected** parameter to **undefined**.|
186
187## accessibilitySelected<sup>13+</sup>
188
189accessibilitySelected(isSelect: boolean)
190
191Sets the selected state of the accessibility component. This property is used in single-select scenarios.
192
193**Widget capability**: This API can be used in ArkTS widgets since API version 13.
194
195**Atomic service API**: This API can be used in atomic services since API version 13.
196
197**System capability**: SystemCapability.ArkUI.ArkUI.Full
198
199**Parameters**
200
201| Name  | Type   | Mandatory| Description                                                        |
202| -------- | ------- | ---- | ------------------------------------------------------------ |
203| isSelect | boolean | Yes  | Whether the current component is selected.<br>The options are as follows:<br>**true**: The component is selected.<br>**false**: The component is not selected.<br>**undefined**: The component determines its own selected state.<br>Default value: **undefined**<br>**NOTE**<br>1. When this parameter is set to **true** or **false**, to use it with **accessibilityChecked**, set the **accessibilityChecked** parameter to **undefined**.|
204
205## accessibilityRole<sup>18+</sup>
206
207accessibilityRole(role: AccessibilityRoleType)
208
209Sets the role type of the accessibility component, which affects how the component is announced by screen readers.
210
211**Widget capability**: This API can be used in ArkTS widgets since API version 18.
212
213**Atomic service API**: This API can be used in atomic services since API version 18.
214
215**System capability**: SystemCapability.ArkUI.ArkUI.Full
216
217**Parameters**
218
219| Name  | Type   | Mandatory| Description                                                        |
220| -------- | ------- | ---- | ------------------------------------------------------------ |
221| role | [AccessibilityRoleType](ts-universal-attributes-accessibility.md#AccessibilityRoleType18) | Yes  | Role of the component as announced by screen readers (for example, button or chart). You can define custom roles.|
222
223## onAccessibilityFocus<sup>18+</sup>
224
225onAccessibilityFocus(callback: AccessibilityFocusCallback)
226
227Triggered when the accessibility component gains or loses focus. Callback triggered when the component gains or loses focus.
228
229**Widget capability**: This API can be used in ArkTS widgets since API version 18.
230
231**Atomic service API**: This API can be used in atomic services since API version 18.
232
233**System capability**: SystemCapability.ArkUI.ArkUI.Full
234
235**Parameters**
236
237| Name  | Type   | Mandatory| Description                                                        |
238| -------- | ------- | ---- | ------------------------------------------------------------ |
239| callback | [AccessibilityFocusCallback](ts-universal-attributes-accessibility.md#AccessibilityFocusCallback18) | Yes  | Callback that notifies the registered component of focus and blur events.|
240
241## AccessibilityFocusCallback<sup>18+</sup>
242
243type AccessibilityFocusCallback = (isFocus: boolean) => void
244
245Defines the callback type used in **onAccessibilityFocus**.
246
247**Atomic service API**: This API can be used in atomic services since API version 18.
248
249**System capability**: SystemCapability.ArkUI.ArkUI.Full
250
251**Parameters**
252
253| Name | Type   | Mandatory| Description             |
254| ------ | ------ | ---- | ---------------- |
255| isFocus | boolean | Yes| Whether the component has gained or lost focus.|
256
257## AccessibilityRoleType<sup>18+</sup>
258
259Enumerates the component role types used by screen readers.
260
261**Atomic service API**: This API can be used in atomic services since API version 18.
262
263**System capability**: SystemCapability.ArkUI.ArkUI.Full
264
265| Name| Value | Description            |
266| ---- | ---- | ------------------ |
267| ACTION_SHEET | 0 | Action sheet.|
268| ALERT_DIALOG | 1 | Alert dialog box.|
269| INDEXER_COMPONENT | 2 | Indexer component.|
270| BADGE_COMPONENT | 3 | Badge component.|
271| BLANK  | 4 | Blank placeholder component.|
272| BUTTON | 5 | Button.|
273| BACK_BUTTON | 6 | Back button on a large image page.|
274| SHEET_DRAG_BAR | 7 | Drag bar for sheets.|
275| CALENDAR_PICKER | 8 | Calendar picker.|
276| CALENDAR | 9 | Calendar.|
277| CANVAS | 10 | Canvas component.|
278| CANVAS_GRADIENT | 11 | Gradient object.|
279| CANVAS_PATTERN | 12 | Pattern for image filling based on a specified source image and repetition mode.|
280| CHECKBOX | 13 | Check box component.|
281| CHECKBOX_GROUP | 14 | Check box group.|
282| CIRCLE | 15 | Component for drawing circles.|
283| COLUMN_SPLIT | 16 | Vertical layout of child components with horizontal dividers.|
284| COLUMN | 17 | Container that lays out child components vertically.|
285| CANVAS_RENDERING_CONTEXT_2D | 18 | 2D drawing object, which can be used to draw rectangles, images, and texts on the canvas component.|
286| CHART | 19 | Chart component.|
287| COUNTER | 20 | Counter component.|
288| CONTAINER_MODAL | 21 | Modal container.|
289| DATA_PANEL | 22 | Data panel component.|
290| DATE_PICKER | 23 | Date picker.|
291| DIALOG | 24 | Dialog box.|
292| DIVIDER | 25 | Divider component.|
293| DRAG_BAR | 26 | Drag bar.|
294| EFFECT_COMPONENT | 27 | Container component for special effects.|
295| ELLIPSE | 28 | Ellipse drawing component.|
296| FLEX | 29 | Container that allows for flexible layout of child components.|
297| FLOW_ITEM | 30 | Child component of a waterfall layout container.|
298| FORM_COMPONENT | 31 | Widget component.|
299| FORM_LINK | 32 | Static widget interaction component.|
300| GAUGE | 33 | Gauge component.|
301| GRID | 34 | Grid container.|
302| GRID_COL | 35 | Grid column component.|
303| GRID_CONTAINER | 36 | Grid container that lays out child components vertically.|
304| GRID_ITEM | 37 | Single-item container within a grid container.|
305| GRID_ROW | 38 | Grid row component.|
306| HYPERLINK | 39 | Hyperlink component.|
307| IMAGE | 40 | Image component|
308| IMAGE_ANIMATOR | 41 | Frame animation component.|
309| IMAGE_BITMAP | 42 | Pixel data for canvas rendering.|
310| IMAGE_DATA | 43 | Pixel data for canvas rendering.|
311| IMAGE_SPAN | 44 | Component used to display inline images.|
312| LABEL | 45 | Label.|
313| LINE | 46 | Line.|
314| LIST | 47 | List.|
315| LIST_ITEM | 48 | Specific item in a list.|
316| LIST_ITEM_GROUP | 49 | List item group.|
317| LOADING_PROGRESS | 50 | Component for display loading animations.|
318| MARQUEE | 51 | Marquee component.|
319| MATRIX2D | 52 | 2D matrix object.|
320| MENU | 53 | Menu.|
321| MENU_ITEM | 54 | Menu item.|
322| MENU_ITEM_GROUP | 55 | Menu item group.|
323| NAV_DESTINATION | 56 | Content area of the **Navigation** component.|
324| NAV_ROUTER | 57 | Navigation component.|
325| NAVIGATION | 58 | Root view container for navigation routing.|
326| NAVIGATION_BAR | 59 | Navigation bar.|
327| NAVIGATION_MENU | 60 | Navigation menu.|
328| NAVIGATOR | 61 | Navigation container component.|
329| OFFSCREEN_CANVAS | 62 | Canvas for custom drawing of graphics.|
330| OFFSCREEN_CANVAS_RENDERING_CONTEXT2D | 63 | 2D drawing object, which can be used to draw rectangles, images, and texts on a canvas component.|
331| OPTION | 64 | Specific item.|
332| PANEL | 65 | Slidable panel.|
333| PAPER_PAGE | 66 | Page.|
334| PATH | 67 | Path drawing component.|
335| PATH2D | 68 | Path object.|
336| PATTERN_LOCK | 69 | Pattern lock component.|
337| PICKER | 70 | Picker.|
338| PICKER_VIEW | 71 | Picker view.|
339| PLUGIN_COMPONENT | 72 | Plugin component.|
340| POLYGON | 73 | Component used to draw a polygon.|
341| POLYLINE | 74 | Component used to draw a polyline.|
342| POPUP | 75 | Popup with a specific style.|
343| PROGRESS | 76 | Text download button.|
344| QRCODE | 77 | QR code.|
345| RADIO | 78 | Radio button.|
346| RATING | 79 | Component for selecting a rating within a given range.|
347| RECT | 80 | Component used to draw a rectangle.|
348| REFRESH | 81 | Pull-to-refresh container component.|
349| RELATIVE_CONTAINER | 82 | Relative layout component.|
350| REMOTE_WINDOW | 83 | Remote control window component.|
351| RICH_EDITOR | 84 | Component that supports rich text editing and interactive text editing.|
352| RICH_TEXT | 85 | Rich text component.|
353| ROLE_PAGER | 86 | Pagination component.|
354| ROW | 87 | Container that lays out child components horizontally.|
355| ROW_SPLIT | 88 | Horizontal layout of child components with vertical dividers.|
356| SCROLL | 89 | Scrollable container component.|
357| SCROLL_BAR | 90 | Scrollbar.|
358| SEARCH | 91 | Search box component.|
359| SEARCH_FIELD | 92 | Search box.|
360| SELECT | 93 | Drop-down list component.|
361| SHAPE | 94 | Parent component of the drawing components.|
362| SIDEBAR_CONTAINER | 95 | Sidebar container that can show and hide the sidebar.|
363| SLIDER | 96 | Vertical slider.|
364| SPAN | 97 | Component used to display inline text.|
365| STACK | 98 | Stack container.|
366| STEPPER | 99 | Stepper component.|
367| STEPPER_ITEM | 100 | Page child component of the stepper component.|
368| SWIPER | 101 | Swiper view container.|
369| SWIPER_INDICATOR | 102 | Navigation indicator for the **Swiper** component.|
370| SWITCH | 103 | Switch.|
371| SYMBOL_GLYPH | 104 | Component for displaying a symbol glyph.|
372| TAB_CONTENT | 105 | Content view for a tab in the **Tabs** component.|
373| TAB_BAR | 106 | Tab bar.|
374| TABS | 107 | Container that allows users to switch between content views through tabs.|
375| TEXT | 108 | Text.|
376| TEXT_CLOCK | 109 | Text clock component.|
377| TEXT_ENTRY | 110 | Text input.|
378| TEXT_INPUT | 111 | Text box component.|
379| TEXT_PICKER | 112 | Text picker.|
380| TEXT_TIMER | 113 | Component that displays timing information and is controlled in text format.|
381| TEXT_AREA | 114 | Text area component.|
382| TEXT_FIELD | 115 | Text box.|
383| TIME_PICKER | 116 | Time picker.|
384| TITLE_BAR | 117 | Title bar.|
385| TOGGLER | 118 | Status component.|
386| UI_EXTENSION_COMPONENT | 119 | UI extension component.|
387| VIDEO | 120 | Component for playing video files and controlling playback.|
388| WATER_FLOW | 121 | Waterfall layout container.|
389| WEB | 122 | Component for loading web pages.|
390| XCOMPONENT | 123 | Custom rendering component.|
391| ROLE_NONE | 124 | Null.|
392
393## accessibilityNextFocusId<sup>18+</sup>
394
395accessibilityNextFocusId(nextId: string)
396
397Sets the next focus target for the component during focus traversal.
398
399**Widget capability**: This API can be used in ArkTS widgets since API version 18.
400
401**Atomic service API**: This API can be used in atomic services since API version 18.
402
403**System capability**: SystemCapability.ArkUI.ArkUI.Full
404
405**Parameters**
406
407| Name| Type  | Mandatory| Description                                                        |
408| ------ | ------ | ---- | ------------------------------------------------------------ |
409| nextId | string | Yes  | [Unique ID](ts-universal-attributes-component-id.md#id) of the next component to receive focus. If the ID does not correspond to any component, the setting is invalid.|
410
411## accessibilityDefaultFocus<sup>18+</sup>
412
413accessibilityDefaultFocus(focus: boolean)
414
415Sets whether the component is the default initial focus for screen readers on the current page.
416
417**Widget capability**: This API can be used in ArkTS widgets since API version 18.
418
419**Atomic service API**: This API can be used in atomic services since API version 18.
420
421**System capability**: SystemCapability.ArkUI.ArkUI.Full
422
423**Parameters**
424
425| Name| Type   | Mandatory| Description                                                        |
426| ------ | ------- | ---- | ------------------------------------------------------------ |
427| focus  | boolean | Yes  | Whether the component is the default initial focus for screen readers on the current page. The value **true** means the component is the default initial focus for screen readers on the current page. Other values are invalid.|
428
429## accessibilityUseSamePage<sup>18+</sup>
430
431accessibilityUseSamePage(pageMode: AccessibilitySamePageMode)
432
433Solves focus jumping issues in sub-tree scenarios like UIExtensionComponent. Sets the same-page mode for this UIExtensionComponent and the host application. This property is intended to solve focus jumping issues in sub-tree scenarios. Due to the timing of page events sent by the UIExtensionComponent and the host application, focus may jump from one component to another, causing "focus jumping."
434
435**Widget capability**: This API can be used in ArkTS widgets since API version 18.
436
437**Atomic service API**: This API can be used in atomic services since API version 18.
438
439**System capability**: SystemCapability.ArkUI.ArkUI.Full
440
441**Parameters**
442
443| Name  | Type                                                        | Mandatory| Description                                            |
444| -------- | ------------------------------------------------------------ | ---- | ------------------------------------------------ |
445| pageMode | [AccessibilitySamePageMode](#accessibilitysamepagemode18) | Yes  | Same-page mode for the current UIExtensionComponent and the host application.|
446
447## AccessibilitySamePageMode<sup>18+</sup>
448
449Enumerates the same-page modes for the current UIExtensionComponent and the host application.
450
451**Atomic service API**: This API can be used in atomic services since API version 18.
452
453**System capability**: SystemCapability.ArkUI.ArkUI.Full
454
455| Name       | Value  | Description                                                        |
456| ----------- | ---- | ------------------------------------------------------------ |
457| SEMI_SILENT | 0    | Ignores page events sent by the root node of the UIExtensionComponent page or during the initial page load.|
458| FULL_SILENT | 1    | Ignores all page events in the UIExtensionComponent.                                     |
459
460## accessibilityScrollTriggerable<sup>18+</sup>
461
462accessibilityScrollTriggerable(isTriggerable: boolean)
463
464Sets whether to enable automatic scrolling for screen readers when the current page has no focusable components.
465
466**Widget capability**: This API can be used in ArkTS widgets since API version 18.
467
468**Atomic service API**: This API can be used in atomic services since API version 18.
469
470**System capability**: SystemCapability.ArkUI.ArkUI.Full
471
472**Parameters**
473
474| Name        |  Type   | Mandatory| Description                                                        |
475| -------------- | ------- | ---- | ------------------------------------------------------------ |
476| isTriggerable  | boolean | Yes  | Whether the component supports automatic scrolling for screen readers when the current page has no focusable components.<br>The options are as follows:<br>**true**: The component triggers automatic scrolling for screen readers when the current page has no focusable components.<br>**false**: The component does not trigger automatic scrolling for screen readers when the current page has no focusable components.<br>**undefined**: The default settings are restored.<br>Default value: **true**<br>**NOTE**<br>1. This parameter does not affect the original **scrollable** attribute of the component.<br>2. The final scrolling behavior is determined by the screen reader based on this parameter and whether the component supports scrolling.<br>3. This API applies to all basic components. It is recommended for scrollable components, including **List**, **Grid**, **Scroll**, **Waterflow**, and **Swiper**.|
477
478## accessibilityTextHint<sup>12+</sup>
479
480accessibilityTextHint(value: string)
481
482Sets the text hint for the component, which can be queried by accessibility services.
483
484**Widget capability**: This API can be used in ArkTS widgets since API version 12.
485
486**Atomic service API**: This API can be used in atomic services since API version 12.
487
488**System capability**: SystemCapability.ArkUI.ArkUI.Full
489
490**Parameters**
491
492| Name        |  Type   | Mandatory| Description                                                        |
493| -------------- | ------- | ---- | ------------------------------------------------------------ |
494| value  | string | Yes  | Text hint for the component, which can be queried by accessibility services.|
495
496
497## Example 1: Setting Accessibility Text and Description
498
499This example demonstrates how to use **accessibilityText** and **accessibilityDescription** to customize the content announced by screen readers.
500
501```
502// xxx.ets
503@Entry
504@Component
505struct Index {
506
507  @Builder customAccessibilityNode() {
508    Column() {
509      Text(`virtual node`)
510    }
511    .width(10)
512    .height(10)
513  }
514
515  build() {
516    Row() {
517      Column() {
518        Text("Text 1")
519          .fontSize(50)
520          .fontWeight(FontWeight.Bold)
521        Text("Text 2")
522          .fontSize(50)
523          .fontWeight(FontWeight.Bold)
524      }
525      .width('100%')
526      .accessibilityGroup(true)
527      .accessibilityLevel("yes")
528      .accessibilityText("Group") // If a component has both text content and accessibility text, only the accessibility text is announced.
529      .accessibilityDescription("The Column component is selectable , and the text to be read out is "Group".)
530      .accessibilityVirtualNode(this.customAccessibilityNode)
531      .accessibilityChecked(true)
532      .accessibilitySelected(undefined)
533    }
534    .height('100%')
535  }
536}
537```
538
539## Example 2: Setting the Accessibility Group
540
541This example shows how to use **accessibilityGroup** to prioritize reading the accessibility text of child components.
542
543```
544// xxx.ets
545@Entry
546@Component
547struct Focus {
548  build() {
549    Column({ space: 10 }) {
550      Text('123456')
551        .focusable(true)
552        .borderRadius(5)
553        .accessibilityText("Accessibility text is announced if both accessibility text and text content are present")
554        .accessibilityLevel("yes")
555      Button().accessibilityLevel("yes").accessibilityText("Accessibility text is announced if no text is present")
556      Button("Text content is announced if no accessibility text is present").accessibilityLevel("yes")
557      Button()
558      Button('btnl23').accessibilityText("Button with both accessibility text and text").accessibilityLevel("yes")
559      Button('btn123').accessibilityLevel("yes")
560    }
561    .accessibilityGroup(true, { accessibilityPreferred: true })
562    //.accessibilityGroup(true)
563    .borderWidth(5)
564    .width('100%')
565    .height('100%')
566  }
567}
568```
569
570