List Formatting Update memo Feb. 2022 - Mar. 2022

f:id:tecchan365:20220302095728p:plain

This is a summary of memos regarding the update of List Formatting.

getThumbnailImage operator

f:id:tecchan365:20220302094434p:plain

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "div",
  "children": [
    {
      "elmType": "img",
      "attributes": {
        "src":"=getThumbnailImage([$Image],300,300)"
      }
    }
  ]
}

docs.microsoft.com

"elmType" : "filepreview"

f:id:tecchan365:20220302094101p:plain

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "filepreview",
  "attributes": {
    "src": "@thumbnail.large"
  },
  "filePreviewProps": {
    "fileTypeIconStyle": {
      "background-color": "blue"
    },
    "brandTypeIconStyle": {
      "width": "30px",
      "height": "30px",
      "border": "1px solid",
      "background-color": "pink"
    }
  }
}

docs.microsoft.com

Customize Command bar

f:id:tecchan365:20220302094350p:plain

{
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/row-formatting.schema.json",
  "commandBarProps": {
    "commands": [
      {
        "key": "new",
        "hide": true
      },
      {
        "key": "editInGridView",
        "text": "Quick edit",
        "iconName": "HeartFill",
        "primary": true
      },
      {
        "key": "share",
        "hide": true
      },
      {
        "key": "export",
        "hide": true
      }
    ]
  }
}

docs.microsoft.com