HarmonyOS Grid布局,按行排列,列数不固定,GridItem大小固定,如何让所有GridItem在中间,目前向左对齐了

HarmonyOS
2024-12-20 17:25:24
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
zbw_apple

如果是相对Grid容器居中显示, 可以使用margin属性设置偏移量。rowsTemplate、columnsTemplate仅设置其中的一个:元素按照设置的方向进行排布,超出Grid显示区域后,Grid可通过滚动的方式展示。如果设置了rowsTemplate,Grid滚动方向为水平方向,主轴方向为水平方向,交叉轴方向为垂直方向。最左边子组件是最先渲染的。

@Entry
@Component
struct Page617 {
  @State message: string = 'Hello World';
  @State numbers1: String[] = ['0', '1', '2', '3', '4']

  build() {
    RelativeContainer() {
      Grid() {
        ForEach(this.numbers1, (day: string) => {
          ForEach(this.numbers1, (day: string) => {
            GridItem() {
              Text(day)
                .fontSize(16)
                .backgroundColor(0xF9CF93)
                .width('50')
                .height('50')
                .textAlign(TextAlign.Center)
            }.margin({left:20,right:20})
          }, (day: string) => day)
        }, (day: string) => day)
      }

      // .columnsTemplate('1fr 1fr 1fr')
      .rowsTemplate('1fr 1fr 1fr')
      .columnsGap(20)
      .rowsGap(20)
      .width('90%')
      .backgroundColor(0xFAEEE0)
      .height(300)
    }
    .height('100%')
    .width('100%')

  }
}
分享
微博
QQ
微信
回复
2024-12-20 19:55:36
相关问题
HarmonyOS 可移动GridItemGrid组件
704浏览 • 1回复 待解决
HarmonyOS Grid-GridItem组件高度的咨询
307浏览 • 1回复 待解决
HarmonyOS Grid占用的问题
563浏览 • 1回复 待解决
HarmonyOS GridItem自适应高度问题
701浏览 • 1回复 待解决
如何固定应用窗口大小并居中展示
2520浏览 • 1回复 待解决
HarmonyOS GridItem之间有一条竖线
192浏览 • 1回复 待解决
HarmonyOS 签名固定问题
438浏览 • 1回复 待解决
如何获取系统屏幕固定
4164浏览 • 0回复 待解决
HarmonyOS 如何设置固定浅色模式
276浏览 • 1回复 待解决