1# Scrollable Component Common APIs 2 3The common attributes and events for scrollable components currently only support the [List](ts-container-list.md), [Grid](ts-container-grid.md), [Scroll](ts-container-scroll.md), and [WaterFlow](ts-container-waterflow.md) components. 4 5> **NOTE** 6> 7> The initial APIs of this module are supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version. 8 9## Attributes 10 11### scrollBar<sup>11+</sup> 12 13scrollBar(barState: BarState): T 14 15Sets the scrollbar state. 16 17**Atomic service API**: This API can be used in atomic services since API version 11. 18 19**System capability**: SystemCapability.ArkUI.ArkUI.Full 20 21**Parameters** 22 23| Name | Type | Mandatory| Description | 24| -------- | ----------------------------------------- | ---- | -------------------------------------- | 25| barState | [BarState](ts-appendix-enums.md#barstate) | Yes | Scrollbar state.<br>Default value: **BarState.Auto** for the **List**, **Grid**, and **Scroll** components and **BarState.Off** for the **WaterFlow** component| 26 27### scrollBarColor<sup>11+</sup> 28 29scrollBarColor(color: Color | number | string): T 30 31Sets the scrollbar color. 32 33**Atomic service API**: This API can be used in atomic services since API version 11. 34 35**System capability**: SystemCapability.ArkUI.ArkUI.Full 36 37**Parameters** 38 39| Name| Type | Mandatory| Description | 40| ------ | ------------------------------------------------------------ | ---- | -------------- | 41| color | string \| number \| [Color](ts-appendix-enums.md#color) | Yes | Scrollbar color.<br>Default value: **'\#182431'** (40% opacity)<br>A number value indicates a HEX color in RGB or ARGB format, for example, **0xffffff**. A string value indicates a color in RGB or ARGB format, for example, **'#ffffff'**.| 42 43### scrollBarWidth<sup>11+</sup> 44 45scrollBarWidth(value: number | string): T 46 47Sets the scrollbar width. This attribute cannot be set in percentage. After the width is set, the scrollbar is displayed with the set width in normal state and pressed state. If the set width exceeds the height of the scrollable component on the main axis, the scrollbar reverts to the default width. 48 49**Atomic service API**: This API can be used in atomic services since API version 11. 50 51**System capability**: SystemCapability.ArkUI.ArkUI.Full 52 53**Parameters** 54 55| Name| Type | Mandatory| Description | 56| ------ | -------------------------- | ---- | ----------------------------------------- | 57| value | string \| number | Yes | Scrollbar width.<br>Default value: **4**<br>Unit: vp<br>If this parameter is set to a value less than or equal to 0, the default value is used. The value **0** means not to show the scrollbar.| 58 59### edgeEffect<sup>11+</sup> 60 61edgeEffect(edgeEffect: EdgeEffect, options?: EdgeEffectOptions): T 62 63Sets the effect used when the scroll boundary is reached. 64 65**Atomic service API**: This API can be used in atomic services since API version 11. 66 67**System capability**: SystemCapability.ArkUI.ArkUI.Full 68 69**Parameters** 70 71| Name | Type | Mandatory| Description | 72| --------------------- | ------------------------------------------------- | ---- | ------------------------------------------------------------ | 73| edgeEffect | [EdgeEffect](ts-appendix-enums.md#edgeeffect) | Yes | Effect used when the scroll boundary is reached. The spring and shadow effects are supported.<br>Default value: **EdgeEffect.None** for the **Grid**, **Scroll**, and **WaterFlow** components and **EdgeEffect.Spring** for the **List** component| 74| options | [EdgeEffectOptions](#edgeeffectoptions11) | No | Whether to enable the scroll effect when the component content is smaller than the component itself. The value **{ alwaysEnabled: true }** means to enable the scroll effect, and **{ alwaysEnabled: false }** means the opposite.<br>Default value:<br>**{ alwaysEnabled: false }** for the **List**, **Grid**, and **WaterFlow** components, and **{ alwaysEnabled: true }** for the **Scroll** component| 75 76### nestedScroll<sup>11+</sup> 77 78nestedScroll(value: NestedScrollOptions): T 79 80Sets the nested scrolling options. You can set the nested scrolling mode in the forward and backward directions to implement scrolling linkage with the parent component. 81 82**Atomic service API**: This API can be used in atomic services since API version 11. 83 84**System capability**: SystemCapability.ArkUI.ArkUI.Full 85 86**Parameters** 87 88| Name| Type | Mandatory| Description | 89| ------ | ----------------------------------------------------- | ---- | -------------- | 90| value | [NestedScrollOptions](#nestedscrolloptions10) | Yes | Nested scrolling options.| 91 92### enableScrollInteraction<sup>11+</sup> 93 94enableScrollInteraction(value: boolean): T 95 96Sets whether to support scroll gestures. When this attribute is set to **false**, scrolling by finger or mouse is not supported, but the scroll controller API is not affected. 97 98**Atomic service API**: This API can be used in atomic services since API version 11. 99 100**System capability**: SystemCapability.ArkUI.ArkUI.Full 101 102**Parameters** 103 104| Name| Type | Mandatory| Description | 105| ------ | ------- | ---- | ----------------------------------- | 106| value | boolean | Yes | Whether to support scroll gestures.<br>Default value: **true**| 107 108### friction<sup>11+</sup> 109 110friction(value: number | Resource): T 111 112Sets the friction coefficient. It applies only to gestures in the scrolling area, and it affects only indirectly the scroll chaining during the inertial scrolling process. If this attribute is set to a value less than or equal to 0, the default value is used. 113 114**Atomic service API**: This API can be used in atomic services since API version 11. 115 116**System capability**: SystemCapability.ArkUI.ArkUI.Full 117 118**Parameters** 119 120| Name| Type | Mandatory| Description | 121| ------ | ---------------------------------------------------- | ---- | --------------------------------------------------------- | 122| value | number \| [Resource](ts-types.md#resource) | Yes | Friction coefficient.<br>Default value: **0.9** for wearable devices and **0.6** for non-wearable devices<br>Since API version 11, the default value for non-wearable devices is **0.7**.<br>Since API version 12, the default value for non-wearable devices is **0.75**.<br>Value range: (0, +∞). If this parameter is set to a value less than or equal to 0, the default value is used.| 123 124### flingSpeedLimit<sup>11+</sup> 125 126flingSpeedLimit(speedLimit: number): T 127 128Sets the maximum initial velocity at the start of the fling animation that occurs after gesture-driven scrolling ends. 129 130**Atomic service API**: This API can be used in atomic services since API version 11. 131 132**System capability**: SystemCapability.ArkUI.ArkUI.Full 133 134**Parameters** 135 136| Name | Type | Mandatory| Description | 137| ---------- | ------ | ---- | ------------------------------- | 138| speedLimit | number | Yes | Maximum initial velocity at the start of the fling animation.<br>Default value: **9000**<br>Unit: vp/s<br>Value range: (0, +∞). If this parameter is set to a value less than or equal to 0, the default value is used.| 139 140### fadingEdge<sup>14+</sup> 141 142fadingEdge(enabled: Optional<boolean>, options?: FadingEdgeOptions): T 143 144Sets whether to enable the edge fading effect and the length of the fading edge. 145 146**Atomic service API**: This API can be used in atomic services since API version 14. 147 148**System capability**: SystemCapability.ArkUI.ArkUI.Full 149 150**Parameters** 151 152| Name | Type | Mandatory| Description | 153| ------- | ------------------------------------------------- | ---- | ------------------------------------------------------------ | 154| enabled | Optional<boolean> | Yes | Whether to enable the edge fading effect.<br>When **fadingEdge** is set to **true**, it overrides the **.overlay()** attribute of the component.<br>With **fadingEdge** set to **true**, avoid setting background-related attributes on the component, as this may affect the display of the fading effect.<br>With **fadingEdge** set to **true**, the component is clipped to the boundary, and setting the component's **clip** attribute to **false** will not take effect.<br>Default value: **false**, which means not to enable the edge fading effect| 155| options | [FadingEdgeOptions](#fadingedgeoptions14) | No | Object defining edge fading effect properties, such as the fading edge length.| 156 157### clipContent<sup>14+</sup> 158 159clipContent(clip: ContentClipMode | RectShape): T 160 161Sets the content clipping area for this scrollable component. 162 163**Atomic service API**: This API can be used in atomic services since API version 14. 164 165**System capability**: SystemCapability.ArkUI.ArkUI.Full 166 167**Parameters** 168 169| Name | Type | Mandatory| Description | 170| ------- | ------------------------------------------------- | ---- | ------------------------------------------------------------ | 171| clip | [ContentClipMode](#contentclipmode14) \| [RectShape](../js-apis-arkui-shape.md#rectshape) | Yes | Clipping to apply, which is effective only for the content (that is, child components) of the scrollable component, not the background. When a custom rectangular area is passed through **RectShape**, only width, height, and [offset](../js-apis-arkui-shape.md#offset) relative to the component's upper left corner are supported, and rounded corners are not supported.<br></div>Default value: The default value for **Grid** and **Scroll** is **ContentClipMode.BOUNDARY**, and the default value for **List** and **WaterFlow** is **ContentClipMode.CONTENT_ONLY**.| 172 173### backToTop<sup>15+</sup> 174 175backToTop(backToTop: boolean) 176 177Sets whether to enable the back-to-top feature for a scrollable component when the status bar is touched. 178 179If this feature is enabled, the scrollable component on the current page scrolls to the top when the user touches the status bar. This behavior does not affect scrollable components in background applications, which will not scroll to the top. This attribute is independent of the [enableScrollInteraction](#enablescrollinteraction11) setting. 180 181**Atomic service API**: This API can be used in atomic services since API version 15. 182 183**System capability**: SystemCapability.ArkUI.ArkUI.Full 184 185**Parameters** 186 187| Name| Type | Mandatory| Description | 188| ------ | ------- | ---- | ---------------------------------------------- | 189| backToTop | boolean | Yes | Whether to enable the back-to-top feature for a scrollable component when the status bar is touched.<br>Default value: **false**| 190 191 192 193## Events 194 195### onReachStart<sup>11+</sup> 196 197onReachStart(event: () => void): T 198 199Triggered when the scrollable component reaches the start position. 200 201This event is triggered once when the component is initialized and once when the component scrolls to the start position. If the edge effect is set to a spring effect, this event is triggered once when the swipe passes the start position, and triggered again when the swipe rebounds back to the start position. 202 203**Atomic service API**: This API can be used in atomic services since API version 11. 204 205**System capability**: SystemCapability.ArkUI.ArkUI.Full 206 207### onReachEnd<sup>11+</sup> 208 209onReachEnd(event: () => void): T 210 211Triggered when the scrollable component reaches the end position. 212 213If the edge effect is set to a spring effect, this event is triggered once when the swipe passes the end position, and triggered again when the swipe rebounds back to the end position. 214 215**Atomic service API**: This API can be used in atomic services since API version 11. 216 217**System capability**: SystemCapability.ArkUI.ArkUI.Full 218 219### onScrollStart<sup>11+</sup> 220 221onScrollStart(event: () => void): T 222 223Triggered when the scrollable component starts scrolling initiated by the user's finger dragging the component or its scrollbar. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](ts-container-scroll.md#scroller) starts. 224 225**NOTE** 226 2271. This event is triggered when the scrollable component starts to scroll, and it supports various input methods that can initiate the scroll, including keyboard and mouse operations. 228 2292. This event is triggered when the controller API is called, accompanied by a transition animation. 230 231**Atomic service API**: This API can be used in atomic services since API version 11. 232 233**System capability**: SystemCapability.ArkUI.ArkUI.Full 234 235### onScrollStop<sup>11+</sup> 236 237onScrollStop(event: () => void): T 238 239Triggered when scrolling stops after the user's finger leaves the screen. This event is also triggered when the animation contained in the scrolling triggered by [Scroller](ts-container-scroll.md#scroller) stops. 240 241**NOTE** 242 2431. The event is triggered when the scrollable component stops scrolling, and it supports various input methods that can initiate the scroll, including keyboard and mouse operations. 244 2452. This event is triggered when the controller API is called, accompanied by a transition animation. 246 247**Atomic service API**: This API can be used in atomic services since API version 11. 248 249**System capability**: SystemCapability.ArkUI.ArkUI.Full 250 251### onWillScroll<sup>12+</sup> 252 253onWillScroll(handler: Optional<OnWillScrollCallback>): T 254 255Triggered when the scrollable component is about to scroll. 256 257The callback provides the amount of offset that is about to be scrolled in the current frame, along with the current scroll status and the source of the scrolling operation. The offset provided in the callback is the calculated intended scrolling offset, not the final actual scrolling offset. You can specify the intended scrolling offset for the scrollable component through the return value of this callback. 258 259**Atomic service API**: This API can be used in atomic services since API version 12. 260 261**System capability**: SystemCapability.ArkUI.ArkUI.Full 262 263**Parameters** 264 265| Name| Type| Mandatory| Description| 266| ------ | ------ | ------ | ------| 267| handler | Optional<[OnWillScrollCallback](#onwillscrollcallback12)> | Yes| Callback triggered when the scrollable component is about to scroll.| 268 269> **NOTE** 270> 271> When **ScrollEdge** and **ScrollToIndex** that does not involve animation is called, **onWillScroll** is not invoked. 272 273 274### onDidScroll<sup>12+</sup> 275 276onDidScroll(handler: OnScrollCallback): T 277 278Triggered when the scrollable component scrolls. The return value is the offset amount by which the list has scrolled and the current scroll state. 279 280**Widget capability**: This API can be used in ArkTS widgets since API version 12. 281 282**Atomic service API**: This API can be used in atomic services since API version 12. 283 284**System capability**: SystemCapability.ArkUI.ArkUI.Full 285 286**Parameters** 287 288| Name| Type| Mandatory| Description| 289| ------ | ------ | ------ | ------| 290| handler | [OnScrollCallback](#onscrollcallback12) | Yes| Callback triggered when the scrollable component scrolls.| 291 292### onScroll<sup>(deprecated)</sup> 293 294onScroll(event: (scrollOffset: number, scrollState: ScrollState) => void): T 295 296Triggered when the scrollable component scrolls. 297 298This API is supported since API version 11. 299 300This API is deprecated since API version 12. For the **Scroll** component, the **onScroll** event is triggered before layout calculations, and you are advised to use [onWillScroll](#onwillscroll12) instead. For the **List**, Grid, and **WaterFlow** components, the **onScroll** event is triggered after layout calculations, and you are advised to use [onDidScroll](#ondidscroll12) instead. 301 302**Atomic service API**: This API can be used in atomic services since API version 11. 303 304**System capability**: SystemCapability.ArkUI.ArkUI.Full 305 306**Parameters** 307 308| Name| Type| Mandatory| Description| 309| ------ | ------ | ------ | ------| 310| scrollOffset | number | Yes| Scroll offset of each frame. The offset is positive when the scrollable component is scrolled up and negative when it is scrolled down.<br>Unit: vp| 311| scrollState | [ScrollState](ts-container-list.md#scrollstate)| Yes| Current scroll state.| 312 313## ItemDragInfo 314 315Provides information about the drag point. 316 317**Atomic service API**: This API can be used in atomic services since API version 11. 318 319**System capability**: SystemCapability.ArkUI.ArkUI.Full 320 321| Name | Type | Description | 322| ---------- | ---------- | ---------- | 323| x | number | X coordinate of the dragged item, in vp. | 324| y | number | Y coordinate of the dragged item, in vp. | 325 326## NestedScrollOptions<sup>10+</sup> 327 328Implements an object used to configure the [nestedScroll](#nestedscroll11) attribute. 329 330**Atomic service API**: This API can be used in atomic services since API version 11. 331 332**System capability**: SystemCapability.ArkUI.ArkUI.Full 333 334| Name | Type | Mandatory| Description | 335| ----- | ------ | ------ | ----------------- | 336| scrollForward | [NestedScrollMode](ts-appendix-enums.md#nestedscrollmode10) | Yes| Nested scrolling options when the scrollable component scrolls forward.| 337| scrollBackward | [NestedScrollMode](ts-appendix-enums.md#nestedscrollmode10) | Yes| Nested scrolling options when the scrollable component scrolls backward.| 338 339## EdgeEffectOptions<sup>11+</sup> 340 341Implements an object used to configure the [edgeEffect](#edgeeffect11) attribute. 342 343**Atomic service API**: This API can be used in atomic services since API version 12. 344 345**System capability**: SystemCapability.ArkUI.ArkUI.Full 346 347| Name | Type | Mandatory| Description | 348| ----- | ------| ------- | ----------------- | 349| alwaysEnabled | boolean | Yes| Whether to enable the scroll effect when the component content is smaller than the component itself.| 350| effectEdge<sup>18+</sup> | number | No| Edge where the edge effect is applied.<br>With **[EffectEdge](#effectedge18).START**, the edge effect is applied to the start edge only. With **[EffectEdge](#effectedge18).END**, the edge effect is applied to the end edge only.<br>The default value is [EffectEdge](#effectedge18).START \| [EffectEdge](#effectedge18).END, which means that the edge effect is applied to both the start and end edges. If an invalid value is set, the edge effect is applied to both the start and end edges.<br>To disable the effect on both edges, set **edgeEffect** to **EdgeEffect.None**.| 351 352## FadingEdgeOptions<sup>14+</sup> 353 354Implements an object used to configure the [fadingEdge](#fadingedge14) attribute. 355 356**Atomic service API**: This API can be used in atomic services since API version 14. 357 358**System capability**: SystemCapability.ArkUI.ArkUI.Full 359 360| Name | Type | Mandatory| Description | 361| ---------------- | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 362| fadingEdgeLength | [LengthMetrics](../js-apis-arkui-graphics.md#lengthmetrics12) | No | Length of the fading edge. If the value is smaller than 0, the default length, 32 vp, is used.<br>If the value exceeds half the height of the container, it is adjusted to exactly half the height of the container.| 363 364## EffectEdge<sup>18+</sup> 365 366Enumerates the edges where the edge effect is applied. 367 368**Atomic service API**: This API can be used in atomic services since API version 18. 369 370**System capability**: SystemCapability.ArkUI.ArkUI.Full 371 372| Name | Value | Description | 373| ----- | ---- | ------------ | 374| START | 1 | Start edge.| 375| END | 2 | End edge.| 376 377## ContentClipMode<sup>14+</sup> 378 379Enumerates the content clipping modes for the scrollable container. 380 381**Atomic service API**: This API can be used in atomic services since API version 14. 382 383**System capability**: SystemCapability.ArkUI.ArkUI.Full 384 385The figure below illustrates the clipping areas corresponding to each enumeration value after the component has been configured with margin and padding attributes. 386 387 388 389| Name | Value | Description | 390| ------ | ------ | ---------------------------------------- | 391| CONTENT_ONLY | 0 | Clip to the content area, corresponding to the green area in the figure.| 392| BOUNDARY | 1 | Clip to the component area, corresponding to the entire blue area in the figure.| 393| SAFE_AREA | 2 | Clip to the safe area configured for the component, corresponding to the entire yellow area in the figure.| 394 395## OnWillScrollCallback<sup>12+</sup> 396 397type OnWillScrollCallback = (scrollOffset: number, scrollState: ScrollState, scrollSource: ScrollSource) => void | ScrollResult 398 399Callback triggered when the scrollable component is about to scroll. 400 401**Atomic service API**: This API can be used in atomic services since API version 12. 402 403**System capability**: SystemCapability.ArkUI.ArkUI.Full 404 405**Parameters** 406 407| Name| Type| Mandatory| Description| 408| ------ | ------ | ------ | ------| 409| scrollOffset | number | Yes| Scroll offset of each frame. The offset is positive when the scrollable component is scrolled up and negative when it is scrolled down.<br>Unit: vp| 410| scrollState | [ScrollState](ts-container-list.md#scrollstate)| Yes| Current scroll state.| 411| scrollSource | [ScrollSource](ts-appendix-enums.md#scrollsource12) | Yes| Source of the current scrolling operation.| 412 413**Return value** 414 415| Type | Description | 416| ----------------------------- | ------------------------------------ | 417| void \| [ScrollResult](#scrollresult12) | Returns a **ScrollResult** object if the scrollable component scrolls by the offset specified by you; returns no **ScrollResult** object if the component scrolls by the offset specified by **scrollOffset** in the callback.<br>Value range: (-∞, +∞)| 418 419## OnScrollCallback<sup>12+</sup> 420 421type OnScrollCallback = (scrollOffset: number, scrollState: ScrollState) => void 422 423Callback triggered when the scrollable component scrolls. 424 425**Widget capability**: This API can be used in ArkTS widgets since API version 12. 426 427**Atomic service API**: This API can be used in atomic services since API version 12. 428 429**System capability**: SystemCapability.ArkUI.ArkUI.Full 430 431| Name| Type| Mandatory| Description| 432| ------ | ------ | ------ | ------| 433| scrollOffset | number | Yes| Scroll offset of each frame. The offset is positive when the scrollable component is scrolled up and negative when it is scrolled down.<br>Unit: vp| 434| scrollState | [ScrollState](ts-container-list.md#scrollstate)| Yes| Current scroll state.| 435 436## ScrollResult<sup>12+</sup> 437 438Implements a return value object of the [OnWillScrollCallback](#onwillscrollcallback12) callback. 439 440**Atomic service API**: This API can be used in atomic services since API version 12. 441 442**System capability**: SystemCapability.ArkUI.ArkUI.Full 443 444| Name| Type| Mandatory| Description| 445| ------ | ------ | ------ | ------| 446| offsetRemain | number | Yes| Amount by which the component is about to be scrolled, in vp.| 447 448## ChildrenMainSize<sup>12+</sup> 449 450Provides the size information of the child components of the **List** or **ListItemGroup** component along the main axis. This object only supports one-to-one binding to the **List** or **ListItemGroup** component. 451 452**Atomic service API**: This API can be used in atomic services since API version 12. 453 454**System capability**: SystemCapability.ArkUI.ArkUI.Full 455 456### constructor<sup>12+</sup> 457 458constructor(childDefaultSize: number): void 459 460A constructor used to create a **ChildrenMainSize** object. 461 462**Atomic service API**: This API can be used in atomic services since API version 12. 463 464**System capability**: SystemCapability.ArkUI.ArkUI.Full 465 466**Parameters** 467 468| Name | Type | Mandatory | Description | 469| ---- | ----------------------------- | ---- | -------------------- | 470| childDefaultSize | number | Yes | Default size of the child component along the main axis.<br>Unit: vp<br>**NOTE**<br>The value must be a finite non-negative number; otherwise, an exception will be thrown.| 471 472 473### childDefaultSize<sup>12+</sup> 474 475set childDefaultSize(value: number): void 476 477Sets the default size of the child component along the main axis. 478 479**Atomic service API**: This API can be used in atomic services since API version 12. 480 481**System capability**: SystemCapability.ArkUI.ArkUI.Full 482 483**Parameters** 484 485| Name | Type | Mandatory | Description | 486| ---- | ----------------------------- | ---- | -------------------- | 487| value | number | Yes | Default size of the child component along the main axis.<br>Unit: vp<br>**NOTE**<br>The value must be a finite non-negative number; otherwise, an exception will be thrown.| 488 489**Error codes** 490 491For details about the error codes, see [Universal Error Codes](../../errorcode-universal.md). 492 493| ID| Error Message| 494| ------- | -------- | 495| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameter types; 3. Parameter verification failed. | 496 497get childDefaultSize(): number 498 499Obtains the default size of the child component along the main axis. 500 501**Atomic service API**: This API can be used in atomic services since API version 12. 502 503**System capability**: SystemCapability.ArkUI.ArkUI.Full 504 505**Return value** 506 507| Type | Description | 508| ------------------------------------------------------------ | ------------------------------------------------------------ | 509| number | Default size of the child component along the main axis.<br>Unit: vp<br>Value range: [0, +∞)| 510 511### splice<sup>12+</sup> 512 513splice(start: number, deleteCount?: number, childrenSize?: Array\<number>): void 514 515Performs batch operations to add, delete, or modify the size information of child components along the main axis. 516 517**Atomic service API**: This API can be used in atomic services since API version 12. 518 519**System capability**: SystemCapability.ArkUI.ArkUI.Full 520 521**Parameters** 522 523| Name | Type | Mandatory | Description | 524| ---- | ----------------------------- | ---- | -------------------- | 525| start | number | Yes | Index starting from 0, which indicates the position at which to begin modifying the size information of child components along the main axis.<br>**NOTE**<br>1. The value must be a finite non-negative number; otherwise, an exception will be thrown.<br>2. Non-integer values are truncated to the nearest integer.<br>3. Values exceeding the maximum index do not take effect.<br>Value range: [0, +∞)| 526| deleteCount | number | No | Number of size information entries to be deleted starting from the **start** position.<br>**NOTE**<br>1. The value must be a finite non-negative number; otherwise, it will be treated as **0**.<br>2. Non-integer values are truncated to the nearest integer.<br>3. The result of (start + deleteCount - 1) can exceed the maximum index, which will delete all size information of child components starting from the **start** position.<br>Default value: **+∞**<br>Value range: [0, +∞)| 527| childrenSize | Array\<number > | No | Size information of all child components to be inserted, starting from the **start** position.<br>Unit for each value in the array: vp<br>**NOTE**<br>1. If the values in the array are finite non-negative number, they are considered specified sizes and will not change with the default size.<br>2. 2. If the values in the array are not finite non-negative number, they will be treated as the default size and will change with the default size.<br>The default value is an empty array.<br>Value range: [0, +∞)| 528 529 530**Error codes** 531 532For details about the error codes, see [Universal Error Codes](../../errorcode-universal.md). 533 534| ID| Error Message| 535| ------- | -------- | 536| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameter types; 3. Parameter verification failed. | 537 538 539> **NOTE** 540> 541> - If only the **start** parameter is used, it means to delete the size information of the child components starting from the **start** position and beyond. 542> - If only the **start** and **deleteCount** parameters are used, it means to delete the **deleteCount**-specified number of size information entries starting from the **start** position. This is generally used when you remove child components. 543> - If all three parameters are used, it means to delete the **deleteCount**-specified number of size information entries starting from the **start** position, and then insert all the size information from **childrenSize** at the **start** position. This is generally used when you add child components or batch update the main axis size of child components. If it's only about adding child components, **deleteCount** should be **0**, and the number of elements in **childrenSize** should be equal to the number of child components being added. If it's only about batch updating the main axis size of child components, the number of elements in **childrenSize** should be equal to **deleteCount**, which is the number of updates being made. 544> - If you want to notify that the size of a child component should be the default size, the corresponding value in **childrenSize** should not be given as a finite non-negative value, but rather as **NaN**, any negative value, or any other value that can be processed as the default size. 545 546### update<sup>12+</sup> 547 548update(index: number, childSize: number): void 549 550Updates the main axis size information of the child component corresponding to the specified index. 551 552**Atomic service API**: This API can be used in atomic services since API version 12. 553 554**System capability**: SystemCapability.ArkUI.ArkUI.Full 555 556**Parameters** 557 558| Name | Type | Mandatory | Description | 559| ---- | ----------------------------- | ---- | -------------------- | 560| index | number | Yes | Index starting from 0, which indicates the position at which to begin modifying the size information of child components along the main axis.<br>**NOTE**<br>1. The value must be a finite non-negative number; otherwise, an exception will be thrown.<br>2. Non-integer values are truncated to the nearest integer.<br>3. Values exceeding the maximum index do not take effect.<br>Value range: [0, +∞)| 561| childSize | number | Yes | Size to be updated to.<br>Unit: vp<br>**NOTE**<br>1. If the value is a finite non-negative number, it is considered a specified size and will not change with the default size.<br>2. 2. If the value is not a finite non-negative number, it will be processed as the default size and will change with the default size.<br>Value range: [0, +∞)| 562 563**Error codes** 564 565For details about the error codes, see [Universal Error Codes](../../errorcode-universal.md). 566 567| ID| Error Message| 568| ------- | -------- | 569| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameter types; 3. Parameter verification failed. | 570