Merge Cells In a column

Adding on what Mike has shared, if you want to make it look bit more fancy use this

a!localVariables(
  local!fruits: { "Apple", "Banana", "Cherry" },
  {
    a!columnsLayout(
      columns: {
        a!columnLayout(
          contents: {
            a!richTextDisplayField(
              labelPosition: "COLLAPSED",
              value: {
                a!richTextItem(
                  text: { "Fruits" },
                  size: "MEDIUM",
                  style: { "STRONG" }
                )
              }
            ),
            a!forEach(
              items: local!fruits,
              expression: a!cardLayout(
                contents: a!richTextDisplayField(
                  labelPosition: "COLLAPSED",
                  value: a!richTextItem(text: fv!item)
                ),
                height: "AUTO",
                style: "TRANSPARENT",
                shape: "SEMI_ROUNDED",
                marginAbove: "NONE",
                marginBelow: "EVEN_LESS",
                showShadow: true
              )
            )
          },
          width: "NARROW_PLUS"
        ),
        a!columnLayout(contents: {}),
        a!columnLayout(contents: {})
      }
    )
  }
)

Thanks for this, but need to show like a grid

Thanks for this, but need to show like a grid

a!localVariables(
  local!fruits: { "Apple", "Banana", "Cherry" },
  {
    a!cardLayout(
      contents: a!columnsLayout(
        columns: {
          a!columnLayout(
            contents: {
              a!richTextDisplayField(
                labelPosition: "COLLAPSED",
                value: {
                  a!richTextItem(
                    text: concat(char(10), { "Fruits" }),
                    size: "MEDIUM",
                    style: { "STRONG" }
                  )
                },
                align: "CENTER"
              )
            },
            width: "NARROW"
          ),
          a!columnLayout(
            contents: {
              a!forEach(
                items: local!fruits,
                expression: a!cardLayout(
                  contents: a!richTextDisplayField(
                    labelPosition: "COLLAPSED",
                    value: a!richTextItem(text: fv!item)
                  ),
                  height: "AUTO",
                  style: "TRANSPARENT",
                  shape: "SQUARED",
                  marginAbove: "NONE",
                  marginBelow: "NONE",
                  showShadow: false(),
                  showBorder: false(),
                  decorativeBarPosition: "BOTTOM",
                  decorativeBarColor: "#111111"
                )
              )
            },
            width: "NARROW"
          ),
          a!columnLayout(contents: {})
        },
        spacing: "NONE",
        showDividers: true()
      ),
      padding: "NONE"
    )
  }
)