!10723 [UI组件重构]更新Grid组件文档描述

Merge pull request !10723 from caocan/develop

zh-cn/application-dev/reference/arkui-ts/ts-container-grid.md

@@ -27,8 +27,8 @@ Grid(scroller?: Scroller)
 
 | 名称 | 参数类型 | 描述 |
 | -------- | -------- | -------- |
-| columnsTemplate | string | 设置当前网格布局列的数量，不设置时默认1列。<br/>例如,&nbsp;'1fr&nbsp;1fr&nbsp;2fr'&nbsp;是将父组件分3列，将父组件允许的宽分为4等份，第一列占1份，第二列占1份，第三列占2份。<br/>默认值：'1fr' |
-| rowsTemplate | string | 设置当前网格布局行的数量，不设置时默认1行。<br/>例如,&nbsp;'1fr&nbsp;1fr&nbsp;2fr'是将父组件分三行，将父组件允许的高分为4等份，第一行占1份，第二行占一份，第三行占2份。<br/>默认值：'1fr' |
+| columnsTemplate | string | 设置当前网格布局列的数量，不设置时默认1列。<br/>例如,&nbsp;'1fr&nbsp;1fr&nbsp;2fr'&nbsp;是将父组件分3列，将父组件允许的宽分为4等份，第一列占1份，第二列占1份，第三列占2份。|
+| rowsTemplate | string | 设置当前网格布局行的数量，不设置时默认1行。<br/>例如,&nbsp;'1fr&nbsp;1fr&nbsp;2fr'是将父组件分三行，将父组件允许的高分为4等份，第一行占1份，第二行占一份，第三行占2份。 |
 | columnsGap | Length | 设置列与列的间距。<br/>默认值：0 |
 | rowsGap | Length | 设置行与行的间距。<br/>默认值：0 |
 | scrollBar      | [BarState](ts-appendix-enums.md#barstate) | 设置滚动条状态。<br/>默认值：BarState.Off |
@@ -37,12 +37,32 @@ Grid(scroller?: Scroller)
 | cachedCount | number                                   | 设置预加载的GridItem的数量。具体使用可参考[减少应用白块说明](../../ui/ts-performance-improvement-recommendation.md#减少应用滑动白块)。<br/>默认值：1 |
 | editMode <sup>8+</sup>                   | boolean | 设置Grid是否进入编辑模式，进入编辑模式可以拖拽Grid组件内部[GridItem](ts-container-griditem.md)。<br/>默认值：flase |
 | layoutDirection<sup>8+</sup>             | [GridDirection](#griddirection8枚举说明) | 设置布局的主轴方向。<br/>默认值：GridDirection.Row |
-| maxCount<sup>8+</sup> | number  | 当layoutDirection是Row/RowReverse时，表示可显示的最大行数<br/>当layoutDirection是Column/ColumnReverse时，表示可显示的最大列数。<br/>默认值：1 |
-| minCount<sup>8+</sup> | number  | 当layoutDirection是Row/RowReverse时，表示可显示的最小行数。<br/>当layoutDirection是Column/ColumnReverse时，表示可显示的最小列数。<br/>默认值：1 |
-| cellLength<sup>8+</sup> | number  | 当layoutDirection是Row/RowReverse时，表示一行的高度。<br/>当layoutDirection是Column/ColumnReverse时，表示一列的宽度。<br/>默认值：0 |
+| maxCount<sup>8+</sup> | number  | 当layoutDirection是Row/RowReverse时，表示可显示的最大列数<br/>当layoutDirection是Column/ColumnReverse时，表示可显示的最大行数。<br/>默认值：Infinity |
+| minCount<sup>8+</sup> | number  | 当layoutDirection是Row/RowReverse时，表示可显示的最小列数。<br/>当layoutDirection是Column/ColumnReverse时，表示可显示的最小行数。<br/>默认值：1 |
+| cellLength<sup>8+</sup> | number  | 当layoutDirection是Row/RowReverse时，表示一行的高度。<br/>当layoutDirection是Column/ColumnReverse时，表示一列的宽度。<br/>默认值：第一个元素的大小 |
 | multiSelectable<sup>8+</sup> | boolean | 是否开启鼠标框选。<br/>默认值：false<br/>-&nbsp;false：关闭框选。<br/>-&nbsp;true：开启框选。 |
 | supportAnimation<sup>8+</sup> | boolean | 是否支持动画。<br/>默认值：false |
 
+Grid组件根据rowsTemplate、columnsTemplate属性的设置情况，可分为以下三种布局模式：
+
+1、rowsTemplate、columnsTemplate同时设置：
+
+Grid只展示固定行列数的元素，其余元素不展示，且Grid不可滚动。例如rowsTemplate、columnsTemplate都设置为"1fr 1fr"时，则仅展示两行两列，共4个元素，其他元素不展示。
+
+此模式下以下属性不生效：layoutDirection、maxCount、minCount、cellLength。
+
+2、rowsTemplate、columnsTemplate仅设置其中的一个：
+
+元素按照设置的方向进行排布，超出的元素可通过滚动的方式展示。例如Grid有十个元素，且设置columnsTemplate为"1fr 1fr 1fr"，则Grid有三列，元素先填满一行，再填充下一行。在Grid区域外的元素，可通过竖直方向的滚动，进行展示。
+
+此模式下以下属性不生效：layoutDirection、maxCount、minCount、cellLength。
+
+3、rowsTemplate、columnsTemplate都不设置：
+
+元素在layoutDirection方向上排布，列数由Grid的宽度、首个元素的宽度、minCount、maxCount、columnsGap共同决定；行数由Grid高度、首个元素高度、cellLength、rowsGap共同决定。超出行列容纳范围的元素不显示，也不能通过滚动进行展示。
+
+此模式下仅生效以下属性：layoutDirection、maxCount、minCount、cellLength、editMode、columnsGap、rowsGap。
+
 ## GridDirection<sup>8+</sup>枚举说明
 
 | 名称   | 描述                                   |