1e41f4b71Sopenharmony_ci# GridCol 2e41f4b71Sopenharmony_ci 3e41f4b71Sopenharmony_ci栅格子组件，必须作为栅格容器组件([GridRow](ts-container-gridrow.md))的子组件使用。 4e41f4b71Sopenharmony_ci 5e41f4b71Sopenharmony_ci> **说明：** 6e41f4b71Sopenharmony_ci> 7e41f4b71Sopenharmony_ci> 该组件从API Version 9开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。 8e41f4b71Sopenharmony_ci 9e41f4b71Sopenharmony_ci## 子组件 10e41f4b71Sopenharmony_ci 11e41f4b71Sopenharmony_ci可以包含单个子组件。 12e41f4b71Sopenharmony_ci## 接口 13e41f4b71Sopenharmony_ci 14e41f4b71Sopenharmony_ciGridCol(option?: GridColOptions) 15e41f4b71Sopenharmony_ci 16e41f4b71Sopenharmony_ci**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。 17e41f4b71Sopenharmony_ci 18e41f4b71Sopenharmony_ci**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。 19e41f4b71Sopenharmony_ci 20e41f4b71Sopenharmony_ci**系统能力：** SystemCapability.ArkUI.ArkUI.Full 21e41f4b71Sopenharmony_ci 22e41f4b71Sopenharmony_ci**参数：** 23e41f4b71Sopenharmony_ci| 参数名 | 类型 | 必填 | 说明 | 24e41f4b71Sopenharmony_ci| ------ | ----------------------------------------------------- | ---- | ------------------------------------------------------------ | 25e41f4b71Sopenharmony_ci| option | [GridColOptions](#gridcoloptions对象说明) | 否 | 栅格布局子组件参数。 | 26e41f4b71Sopenharmony_ci 27e41f4b71Sopenharmony_ci## GridColOptions对象说明 28e41f4b71Sopenharmony_ci 29e41f4b71Sopenharmony_ci**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。 30e41f4b71Sopenharmony_ci 31e41f4b71Sopenharmony_ci**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。 32e41f4b71Sopenharmony_ci 33e41f4b71Sopenharmony_ci**系统能力：** SystemCapability.ArkUI.ArkUI.Full 34e41f4b71Sopenharmony_ci 35e41f4b71Sopenharmony_ci| 名称 | 类型 | 必填 | 说明 | 36e41f4b71Sopenharmony_ci| ------ | ----------------------------------------------------- | ---- | ------------------------------------------------------------ | 37e41f4b71Sopenharmony_ci| span | number \| [GridColColumnOption](#gridcolcolumnoption) | 否 | 栅格子组件占用栅格容器组件的列数。span为0表示该元素不参与布局计算，即不会被渲染。<br/>默认值：1 | 38e41f4b71Sopenharmony_ci| offset | number \| [GridColColumnOption](#gridcolcolumnoption) | 否 | 栅格子组件相对于原本位置偏移的列数。<br/>默认值：0 | 39e41f4b71Sopenharmony_ci| order | number \| [GridColColumnOption](#gridcolcolumnoption) | 否 | 元素的序号，根据栅格子组件的序号，从小到大对栅格子组件做排序。<br/>默认值：0<br/>**说明：**<br/>当子组件不设置order或者设置相同的order, 子组件按照代码顺序展示。<br/>当子组件部分设置order，部分不设置order时，未设置order的子组件依次排序靠前，设置了order的子组件按照数值从小到大排列。 | 40e41f4b71Sopenharmony_ci 41e41f4b71Sopenharmony_ci`span`、`offset`、`order`属性按照`xs`、`sm`、`md`、`lg`、`xl`、`xxl`的顺序具有“继承性”，未设置值的断点将会从前一个断点取值。 42e41f4b71Sopenharmony_ci 43e41f4b71Sopenharmony_ci## 属性 44e41f4b71Sopenharmony_ci除支持[通用属性](ts-universal-attributes-size.md)外，还支持以下属性： 45e41f4b71Sopenharmony_ci 46e41f4b71Sopenharmony_ci### span 47e41f4b71Sopenharmony_ci 48e41f4b71Sopenharmony_cispan(value: number | GridColColumnOption) 49e41f4b71Sopenharmony_ci 50e41f4b71Sopenharmony_ci设置占用列数。span为0，意味着该元素不参与布局计算，即不会被渲染。 51e41f4b71Sopenharmony_ci 52e41f4b71Sopenharmony_ci**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。 53e41f4b71Sopenharmony_ci 54e41f4b71Sopenharmony_ci**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。 55e41f4b71Sopenharmony_ci 56e41f4b71Sopenharmony_ci**系统能力：** SystemCapability.ArkUI.ArkUI.Full 57e41f4b71Sopenharmony_ci 58e41f4b71Sopenharmony_ci**参数：** 59e41f4b71Sopenharmony_ci 60e41f4b71Sopenharmony_ci| 参数名 | 类型 | 必填 | 说明 | 61e41f4b71Sopenharmony_ci| ------ | ------------------------------------------------------------ | ---- | ------------------------ | 62e41f4b71Sopenharmony_ci| value | number \| [GridColColumnOption](#gridcolcolumnoption) | 是 | 占用列数。<br/>默认值：1 | 63e41f4b71Sopenharmony_ci 64e41f4b71Sopenharmony_ci### gridColOffset 65e41f4b71Sopenharmony_ci 66e41f4b71Sopenharmony_cigridColOffset(value: number | GridColColumnOption) 67e41f4b71Sopenharmony_ci 68e41f4b71Sopenharmony_ci设置相对于前一个栅格子组件偏移的列数。 69e41f4b71Sopenharmony_ci 70e41f4b71Sopenharmony_ci**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。 71e41f4b71Sopenharmony_ci 72e41f4b71Sopenharmony_ci**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。 73e41f4b71Sopenharmony_ci 74e41f4b71Sopenharmony_ci**系统能力：** SystemCapability.ArkUI.ArkUI.Full 75e41f4b71Sopenharmony_ci 76e41f4b71Sopenharmony_ci**参数：** 77e41f4b71Sopenharmony_ci 78e41f4b71Sopenharmony_ci| 参数名 | 类型 | 必填 | 说明 | 79e41f4b71Sopenharmony_ci| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------ | 80e41f4b71Sopenharmony_ci| value | number \| [GridColColumnOption](#gridcolcolumnoption) | 是 | 相对于前一个栅格子组件偏移的列数。<br/>默认值：0 | 81e41f4b71Sopenharmony_ci 82e41f4b71Sopenharmony_ci### order 83e41f4b71Sopenharmony_ci 84e41f4b71Sopenharmony_ciorder(value: number | GridColColumnOption) 85e41f4b71Sopenharmony_ci 86e41f4b71Sopenharmony_ci设置元素的序号，根据栅格子组件的序号，从小到大对栅格子组件做排序。 87e41f4b71Sopenharmony_ci 88e41f4b71Sopenharmony_ci**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。 89e41f4b71Sopenharmony_ci 90e41f4b71Sopenharmony_ci**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。 91e41f4b71Sopenharmony_ci 92e41f4b71Sopenharmony_ci**系统能力：** SystemCapability.ArkUI.ArkUI.Full 93e41f4b71Sopenharmony_ci 94e41f4b71Sopenharmony_ci**参数：** 95e41f4b71Sopenharmony_ci 96e41f4b71Sopenharmony_ci| 参数名 | 类型 | 必填 | 说明 | 97e41f4b71Sopenharmony_ci| ------ | ------------------------------------------------------------ | ---- | ------------------------------------------------------------ | 98e41f4b71Sopenharmony_ci| value | number \| [GridColColumnOption](#gridcolcolumnoption) | 是 | 元素的序号，根据栅格子组件的序号，从小到大对栅格子组件做排序。<br/>默认值：0 | 99e41f4b71Sopenharmony_ci 100e41f4b71Sopenharmony_ci## GridColColumnOption 101e41f4b71Sopenharmony_ci 102e41f4b71Sopenharmony_ci用于自定义指定在不同宽度设备类型上，栅格子组件占据的栅格数量单位。 103e41f4b71Sopenharmony_ci 104e41f4b71Sopenharmony_ci**卡片能力：** 从API version 9开始，该接口支持在ArkTS卡片中使用。 105e41f4b71Sopenharmony_ci 106e41f4b71Sopenharmony_ci**原子化服务API：** 从API version 11开始，该接口支持在原子化服务中使用。 107e41f4b71Sopenharmony_ci 108e41f4b71Sopenharmony_ci**系统能力：** SystemCapability.ArkUI.ArkUI.Full 109e41f4b71Sopenharmony_ci 110e41f4b71Sopenharmony_ci| 名称 | 类型 | 必填 | 说明 | 111e41f4b71Sopenharmony_ci| ----- | ------ | ---- | ---------------------------------------- | 112e41f4b71Sopenharmony_ci| xs | number | 否 | 在栅格大小为xs的设备上，栅格容器组件的栅格列数。 | 113e41f4b71Sopenharmony_ci| sm | number | 否 | 在栅格大小为sm的设备上，栅格容器组件的栅格列数。 | 114e41f4b71Sopenharmony_ci| md | number | 否 | 在栅格大小为md的设备上，栅格容器组件的栅格列数。 | 115e41f4b71Sopenharmony_ci| lg | number | 否 | 在栅格大小为lg的设备上，栅格容器组件的栅格列数。 | 116e41f4b71Sopenharmony_ci| xl | number | 否 | 在栅格大小为xl的设备上，栅格容器组件的栅格列数。 | 117e41f4b71Sopenharmony_ci| xxl | number | 否 | 在栅格大小为xxl的设备上，栅格容器组件的栅格列数。 | 118e41f4b71Sopenharmony_ci 119e41f4b71Sopenharmony_ci## 示例 120e41f4b71Sopenharmony_ci请参考栅格容器示例代码([GridRow](ts-container-gridrow.md#示例))