• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# GridCol
2
3The **\<GridCol>** component must be used as a child component of the **[\<GridRow>](ts-container-gridrow.md)** container.
4
5>  **NOTE**
6>
7> This component is supported since API version 9. Updates will be marked with a superscript to indicate their earliest API version.
8
9## Child Components
10
11This component can contain only one child component.
12## APIs
13
14GridCol(option?:{span?: number | GridColColumnOption, offset?: number | GridColColumnOption, order?: number | GridColColumnOption})
15
16Since API version 9, this API is supported in ArkTS widgets.
17
18**Parameters**
19
20| Name| Type                                                 | Mandatory| Description                                                        |
21| ------ | ----------------------------------------------------- | ---- | ------------------------------------------------------------ |
22| span   | number \| [GridColColumnOption](#gridcolcolumnoption) | No  | Number of occupied columns. If it is set to **0**, the element is not involved in layout calculation, that is, the element is not rendered.<br>Default value: **1**|
23| offset | number \| [GridColColumnOption](#gridcolcolumnoption) | No  | Number of offset columns relative to the previous child component of the grid<br>Default value: **0**          |
24| order  | number \| [GridColColumnOption](#gridcolcolumnoption) | No  | Sequence number of the element. Child components of the grid are sorted in ascending order based on their sequence numbers.<br>Default value: **0**|
25
26## Attributes
27
28| Name| Type                         | Mandatory| Description                                                        |
29| ------ | ----------------------------- | ---- | ------------------------------------------------------------ |
30| span   | number \| GridColColumnOption | No  | Number of occupied columns. If it is set to **0**, the element is not involved in layout calculation, that is, the element is not rendered.<br>Default value: **1**<br>Since API version 9, this API is supported in ArkTS widgets.|
31| gridColOffset | number \| GridColColumnOption | No  | Number of offset columns relative to the previous child component of the grid<br>Default value: **0**<br>Since API version 9, this API is supported in ArkTS widgets.|
32| order  | number \| GridColColumnOption | No  | Sequence number of the element. Child components of the grid are sorted in ascending order based on their sequence numbers.<br>Default value: **0**<br>Since API version 9, this API is supported in ArkTS widgets.|
33
34## GridColColumnOption
35
36Since API version 9, this API is supported in ArkTS widgets.
37
38| Name  | Type  | Mandatory  | Description                                    |
39| ----- | ------ | ---- | ---------------------------------------- |
40| xs  | number | No   | Device of the minimum size.   |
41| sm  | number | No   | Small-sized device.     |
42| md  | number | No   | Medium-sized device.   |
43| lg  | number | No   | Large-sized device.     |
44| xl  | number | No   | Extra-large-sized device.   |
45| xxl | number | No   | Ultra-large-sized device.   |
46
47The values of `span`, `offset`, and `order` attributes are inherited in the sequence of `xs`, `sm`, `md`, `lg`, `xl`, and `xxl`. If no value is set for a breakpoint, the value is obtained from the previous breakpoint.
48
49|Parameter\Breakpoint|xs|sm|md|lg|xl|xxl|
50|---|---|---|---|---|---|---|
51|span   |2  |2  |3  |3  |4  |4  |
52|offset |2  |2  |3  |5  |5  |5  |
53|order  |20 |20 |20 |3  |3  |3  |
54
55## Example
56See [GridRow](ts-container-gridrow.md#example).
57