HarmonyOS Grid占用行和列的问题

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

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

HarmonyOS
2天前
浏览
收藏 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)
  }
}
分享
微博
QQ
微信
回复
2天前
相关问题
innodb中,空占用存储吗?
2822浏览 • 1回复 待解决
HarmonyOS 如何实现一列表
52浏览 • 1回复 待解决
HarmonyOS Grid半模态问题
40浏览 • 1回复 待解决
HarmonyOS 使用GridGriItem组合问题
375浏览 • 1回复 待解决
HarmonyOS gridlist混合布局问题
34浏览 • 1回复 待解决
HarmonyOS webview内存占用问题
19浏览 • 1回复 待解决
HarmonyOS TextPicker多问题
41浏览 • 1回复 待解决
HarmonyOS Grid自适应高度拖拽问题
563浏览 • 1回复 待解决
关于Grid容器WaterFlow使用上问题
925浏览 • 1回复 待解决
HarmonyOS Grid相关问题
409浏览 • 1回复 待解决
linux排除带空行#开头
5038浏览 • 1回复 待解决
HarmonyOS Grid拖拽动画问题
77浏览 • 1回复 待解决
HarmonyOS Tabs嵌套Grid问题
115浏览 • 1回复 待解决
HarmonyOS tabsgrid实现滑动
35浏览 • 1回复 待解决
HarmonyOS 关于Grid组件拖拽排序问题
504浏览 • 1回复 待解决
获取应用CPU使用率内存占用
290浏览 • 1回复 待解决
HarmonyOS Grid拖动排序长按冲突
555浏览 • 2回复 待解决
HarmonyOS grid拖拽增删动画效果
37浏览 • 1回复 待解决