如何修改SharePoint列表Gallery视图JSON代码实现按钮垂直排列？

要实现Gallery视图中按钮的垂直排列，核心是修改视图级别的布局设置，而非单个按钮元素的flex属性，具体操作如下：

关键修改点 #

Gallery视图的横向/纵向排列由layoutSettings中的horizontal参数控制，默认值为true（横向），将其改为false即可实现垂直排列。

完整JSON示例 #

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/tile-formatting.schema.json",
  "height": 70,
  "width": 250,
  "layoutSettings": {
    "horizontal": false, // 控制卡片垂直排列的核心参数
    "margin": 12 // 可调整按钮之间的间距
  },
  "formatter": {
    "elmType": "div",
    "attributes": {
      "class": "ms-bgColor-themeLighterAlt ms-borderColor-themePrimary ms-border ms-borderSolid ms-borderRadius-md ms-fontColor-themePrimary ms-fontWeight-semibold ms-cursor-pointer",
      "href": "[$URL]?env=WebView",
      "target": "_self"
    },
    "style": {
      "display": "flex",
      "alignItems": "center",
      "justifyContent": "center",
      "height": "100%",
      "width": "100%",
      "font-size": "[$FontSize]px",
      "text-decoration": "none"
    },
    "children": [
      {
        "elmType": "span",
        "txtContent": "[$Title]"
      }
    ]
  },
  "sortBy": "[$Order]" // 绑定排序字段维持顺序
}

为什么之前的方法无效 #

你之前修改单个按钮的flexDirection或layout属性，仅能控制按钮内部元素的排列，无法改变Gallery视图中卡片（按钮）之间的整体排列方向，必须通过视图级别的layoutSettings.horizontal参数调整。

内容的提问来源于stack exchange，提问作者Monomeeth