• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# GridCol
2
3栅格子组件，必须作为栅格容器组件([GridRow](ts-container-gridrow.md))的子组件使用。
4
5>  **说明：**
6>
7> 该组件从API Version 9开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。
8
9## 子组件
10
11可以包含单个子组件。
12## 接口
13
14GridCol(option?:{span?: number | GridColColumnOption, offset?: number | GridColColumnOption, order?: number | GridColColumnOption})
15
16从API version 9开始，该接口支持在ArkTS卡片中使用。
17
18**参数：**
19
20| 参数名 | 类型                                                  | 必填 | 说明                                                         |
21| ------ | ----------------------------------------------------- | ---- | ------------------------------------------------------------ |
22| span   | number \| [GridColColumnOption](#gridcolcolumnoption) | 否   | 占用列数。span为0表示该元素不参与布局计算，即不会被渲染。<br/>默认值：1。 |
23| offset | number \| [GridColColumnOption](#gridcolcolumnoption) | 否   | 相对于前一个栅格子组件偏移的列数。<br/>默认值：0。           |
24| order  | number \| [GridColColumnOption](#gridcolcolumnoption) | 否   | 元素的序号，根据栅格子组件的序号，从小到大对栅格子组件做排序。<br/>默认值：0。 |
25
26## 属性
27
28| 参数名 | 类型                          | 必填 | 说明                                                         |
29| ------ | ----------------------------- | ---- | ------------------------------------------------------------ |
30| span   | number \| GridColColumnOption | 否   | 占用列数。span为0，意味着该元素不参与布局计算，即不会被渲染。<br/>默认值：1。<br/>从API version 9开始，该接口支持在ArkTS卡片中使用。 |
31| gridColOffset | number \| GridColColumnOption | 否   | 相对于前一个栅格子组件偏移的列数。<br/>默认值：0。<br/>从API version 9开始，该接口支持在ArkTS卡片中使用。 |
32| order  | number \| GridColColumnOption | 否   | 元素的序号，根据栅格子组件的序号，从小到大对栅格子组件做排序。<br/>默认值：0。<br/>从API version 9开始，该接口支持在ArkTS卡片中使用。 |
33
34## GridColColumnOption
35
36从API version 9开始，该接口支持在ArkTS卡片中使用。
37
38| 参数名   | 参数类型   | 必填   | 参数描述                                     |
39| ----- | ------ | ---- | ---------------------------------------- |
40| xs  | number | 否    | 最小宽度类型设备。    |
41| sm  | number | 否    | 小宽度类型设备。      |
42| md  | number | 否    | 中等宽度类型设备。    |
43| lg  | number | 否    | 大宽度类型设备。      |
44| xl  | number | 否    | 特大宽度类型设备。    |
45| xxl | number | 否    | 超大宽度类型设备。    |
46
47`span`、`offset`、`order`属性按照`xs`、`sm`、`md`、`lg`、`xl`、`xxl`的顺序具有“继承性”，未设置值的断点将会从前一个断点取值。
48
49|参数\断点 |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## 示例
56请参考栅格容器示例代码([GridRow](ts-container-gridrow.md#示例))