HarmonyOS Grid占用行和列的问题

在使用Grid不能够在列上面占用指定大小

HarmonyOS  Grid占用行和列的问题  -鸿蒙开发者社区

HarmonyOS
2024-12-24 16:35:19
浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
Excelsior_abit

GridItem设置多行单列的时候默认是不拉伸的,只会保持原有节点的高度,不过可以尝试给需要占多行的元素设置一个高度,示例如下:

@Entry
@Component
struct GridExample {
  @State numbers: String[] = ['0', '1', '2', '3', '4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23']

  layoutOptions2: GridLayoutOptions = {
    regularSize: [1, 1],
    irregularIndexes: [0, 7],   // 索引为0和7的GridItem占用的列数由onGetIrregularSizeByIndex指定
    onGetIrregularSizeByIndex: (index: number) => {
      if (index === 0) {
        return [1, 5]
      } else if(index == 7) {
        return [3,1]
      }
      return [1, 1]
    }
  }

  build() {
    Column({ space: 5 }) {
      Grid(null, this.layoutOptions2) {
        ForEach(this.numbers, (day: string) => {
          GridItem() {
            Text(day)
              .fontSize(16)
              .backgroundColor(0xF9CF93)
              .width('100%')
              .textAlign(TextAlign.Center)
                // 目前只能通过给单个元素设置高度进行拉升
              .height(day === '7' ? 92 : 24)
          }
        }, (day: string) => day)
      }
      .columnsTemplate('1fr 1fr 1fr 1fr 1fr')
      .columnsGap(10)
      .rowsGap(10)
      .scrollBar(BarState.Off)
      .width('100%')
      .backgroundColor(0xFAEEE0)
      .height('100%')
    }.width('100%').padding(12)
  }
}
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
分享
微博
QQ
微信
回复
2024-12-24 18:14:19
相关问题
innodb中,空占用存储吗?
3297浏览 • 1回复 待解决
HarmonyOS 如何实现一列表
1001浏览 • 1回复 待解决
HarmonyOS Grid半模态问题
928浏览 • 1回复 待解决
HarmonyOS 使用GridGriItem组合问题
939浏览 • 1回复 待解决
HarmonyOS gridlist混合布局问题
832浏览 • 1回复 待解决
HarmonyOS Grid自适应高度拖拽问题
1309浏览 • 1回复 待解决
HarmonyOS TextPicker多问题
894浏览 • 1回复 待解决
关于Grid容器WaterFlow使用上问题
1434浏览 • 1回复 待解决
HarmonyOS List嵌套ListList嵌套Grid问题
879浏览 • 1回复 待解决
HarmonyOS webview内存占用问题
874浏览 • 1回复 待解决
HarmonyOS Grid相关问题
1240浏览 • 1回复 待解决
HarmonyOS Grid间距问题
573浏览 • 1回复 待解决
HarmonyOS Tabs嵌套Grid问题
738浏览 • 1回复 待解决
HarmonyOS Grid拖拽动画问题
889浏览 • 1回复 待解决
HarmonyOS tabsgrid实现滑动
606浏览 • 1回复 待解决
linux排除带空行#开头
5757浏览 • 1回复 待解决
HarmonyOS 关于Grid组件拖拽排序问题
1419浏览 • 1回复 待解决
HarmonyOS grid拖拽增删动画效果
821浏览 • 1回复 待解决