UI Kit Builder

กำลังโหลด...

{
  "sections": [
    {
      "header": "Section Header",
      "collapsible": true,
      "uncollapsibleWidgetsCount": 1,
      "widgets": [
        {
          "grid": {
            "title": "A fine collection of items",
            "columnCount": 5,
            "items": [
              {
                "image": {
                  "imageUri": "https://developers.google.com/workspace/chat/images/chat-app-hero-image.png",
                  "cropStyle": {
                    "type": "RECTANGLE_CUSTOM",
                    "aspectRatio": 4
                  }
                },
                "title": "1",
                "textAlignment": "CENTER",
                "layout": "TEXT_ABOVE"
              },
              {
                "image": {
                  "imageUri": "https://developers.google.com/workspace/chat/images/chat-app-hero-image.png",
                  "cropStyle": {
                    "type": "SQUARE"
                  }
                },
                "title": "2",
                "textAlignment": "CENTER",
                "layout": "TEXT_ABOVE"
              },
              {
                "image": {
                  "imageUri": "https://developers.google.com/workspace/chat/images/chat-app-hero-image.png",
                  "cropStyle": {
                    "type": "CIRCLE"
                  }
                },
                "title": "3",
                "textAlignment": "CENTER",
                "layout": "TEXT_ABOVE"
              },
              {
                "image": {
                  "imageUri": "https://developers.google.com/workspace/chat/images/chat-app-hero-image.png",
                  "cropStyle": {
                    "type": "RECTANGLE_4_3"
                  }
                },
                "title": "4",
                "textAlignment": "CENTER",
                "layout": "TEXT_ABOVE"
              },
              {
                "image": {
                  "imageUri": "https://developers.google.com/workspace/chat/images/chat-app-hero-image.png",
                  "cropStyle": {
                  }
                },
                "title": "5",
                "textAlignment": "CENTER",
                "layout": "TEXT_ABOVE"
              }
            ]
          }
        }
      ]
    }
  ]
}