Container

Cardscript

Containers group items together.

Example

{
  "type": "AdaptiveCard",
  "body": [
    {
      "type": "Container",
      "color": "accent",
      "spacing": "large",
      "items": [
        {
          "type": "TextBlock",
          "text": "Accent!"
        }
      ]
    }
  ],
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.0"
}

Required properties

type

Must be "Container".

• Type: string
• Values:
  • Container

---

items

• Type: array

Optional properties

color

Controls the color of the Container.

• Type: string
• Values:
  • default
  • dark
  • light
  • accent
  • good
  • warning
  • attention

---

selectAction

An Action that will be invoked when the Container is tapped or selected. Action.ShowCard is not supported.

• Type: object

---

style

Style hint for Container.

• Type: string
• Values:
  • default
  • emphasis

---

verticalContentAlignment

Defines how the content should be aligned vertically within the container.

• Type: string
• Default: "top"

---

id

A unique identifier associated with the element.

• Type: string

---

spacing

Controls the amount of spacing between this element and the preceding element.

• Type: string
• Values:
  • none
  • small
  • default
  • medium
  • large
  • extraLarge
  • padding

---

separator

When true, draw a separating line at the top of the element.

• Type: boolean

---

JSON Schema

{
  "additionalProperties": true,
  "type": "Container",
  "description": "Containers group items together.",
  "allOf": [
    {
      "$ref": "#/definitions/CardElement"
    }
  ],
  "properties": {
    "type": {
      "type": "string",
      "description": "Must be `\"Container\"`.",
      "enum": [
        "Container"
      ]
    },
    "color": {
      "type": "string",
      "description": "Controls the color of the Container.",
      "enum": [
        "default",
        "dark",
        "light",
        "accent",
        "good",
        "warning",
        "attention"
      ]
    },
    "items": {
      "description": "The card elements to render inside the `Container`.",
      "$ref": "#/definitions/CardElements"
    },
    "selectAction": {
      "description": "An Action that will be invoked when the `Container` is tapped or selected. `Action.ShowCard` is not supported.",
      "type": "object",
      "oneOf": [
        {
          "$ref": "#/definitions/Action.Submit"
        },
        {
          "$ref": "#/definitions/Action.OpenUrl"
        }
      ]
    },
    "style": {
      "type": "string",
      "description": "Style hint for `Container`.",
      "enum": [
        "default",
        "emphasis"
      ]
    },
    "verticalContentAlignment": {
      "type": "string",
      "description": "Defines how the content should be aligned vertically within the container.",
      "default": "top",
      "enum:": [
        "top",
        "center",
        "bottom"
      ],
      "version": "1.1"
    }
  },
  "required": [
    "type",
    "items"
  ],
  "typeSafe": "container",
  "example": "FIXME!",
  "propertySummary": [
    {
      "name": "type",
      "type": "string",
      "required": "Required",
      "text": "Must be `\"Container\"`."
    },
    {
      "name": "color",
      "type": "string",
      "required": "Optional",
      "text": "Controls the color of the Container."
    },
    {
      "name": "items",
      "required": "Required",
      "text": "The card elements to render inside the `Container`."
    },
    {
      "name": "selectAction",
      "type": "object",
      "required": "Optional",
      "text": "An Action that will be invoked when the `Container` is tapped or selected. `Action.ShowCard` is not supported."
    },
    {
      "name": "style",
      "type": "string",
      "required": "Optional",
      "text": "Style hint for `Container`."
    },
    {
      "name": "verticalContentAlignment",
      "type": "string",
      "required": "Optional",
      "text": "Defines how the content should be aligned vertically within the container."
    }
  ]
}