創建網格（Grid/GridItem）

1. 網格布局主要用于處理固定行列的UI，也支持動態調整。很類似iOS中的UICollectionView。
2. [Grid]容器的子組件一定是[GridItem]
3. 開發前請熟悉鴻蒙開發指導文檔：[gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md]

Grid，GridItem關系

容器內每一個條目對應一個GridItem組件

行列數量可配

1. Grid組件提供了rowsTemplate和columnsTemplate屬性用于設置網格布局行列數量與尺寸占比。
2. rowsTemplate和columnsTemplate屬性值是一個由多個空格和'數字+fr'間隔拼接的字符串，fr的個數即網格布局的行或列數，fr前面的數值大小，用于計算該行或列在網格布局寬度上的占比，最終決定該行或列的寬度

typescript
復制代碼
Grid() {
...
}
.rowsTemplate('1fr 1fr 1fr')
.columnsTemplate('1fr 2fr 1fr')

單個網格可以橫跨多行或多列

通過設置GridItem的rowStart、rowEnd、columnStart和columnEnd可以實現單個網格橫跨多行或多列的場景

typescript
復制代碼
Grid() {
    GridItem() {}
    GridItem() {}
    GridItem() {}
    .columnStart(1)
    .columnEnd(2)

    GridItem() {}
    .rowStart(1)
    .rowEnd(2)
    GridItem() {}
    GridItem() {}
    GridItem() {}
    
    GridItem() {}
    .columnStart(1)
    .columnEnd(3)
}
.rowsTemplate('1fr 1fr 1fr')
.columnsTemplate('1fr 1fr 1fr 1fr')
.columnsGap(8)
.rowsGap(8)

`HarmonyOS與OpenHarmony鴻蒙文檔籽料：mau123789是v直接拿`

審核編輯 黃宇