Looply Academy
  • Getting Started
    • What is Looply?
    • Deployment Models
  • System Requirements
  • SAP Integration: ABAP Add-on & Access
  • Security & Identity - What IT Teams Need to Know
  • Authenticating Teams User Actions to Enterprise Systems
  • Signing Up & Onboarding Your Team
  • Looply Implementation Plan
  • Looply Integration Demos
  • Integrations
    • Microsoft Integration
    • SAP Integration
      • Installing the ABAP Looply Add-On
        • Gateway Service Setup - Single System
        • Gateway Service Setup - Hub scenario
      • Triggering or Resuming a Looply Workflow from SAP
      • Triggering SAP code from Looply
      • SAP Workflow Integration
      • Varo/Stelo Integration
      • SSL & IP address
      • SSO Authentication
  • App Management
    • Building Apps
    • Deploying apps to Teams App catalog
      • Looply Dashboard
      • Manual Installation
    • Installing Looply Apps
    • Uninstall/Update Looply Apps
    • Teams Admin center
  • Adaptive Cards
    • Building Adaptive Cards
      • Container Elements
      • Content Elements
      • Input Elements
      • Actions
    • Data Binding
    • Conditional Rendering
    • AI Assistant
    • Inline Functions
  • Workflows
    • Building Workflows
    • Triggering Workflows
    • Environment Variables & Profiles
    • Versioning Workflows
    • Using HTTP Requests
    • Using Functions
    • Using Conditionals
    • Using Branch Conditionals
    • Using Advanced Conditionals
    • Using Integrations
      • Adaptive Card Actions
      • SAP Requests
    • Using Redirects
    • Using Override Payload
    • Terminating Workflows
  • Data Vault
    • Variable Datastores
  • Monitoring & Logs
    • Monitoring Workflows
    • Error Notifications
  • API REFERENCE
    • Developer API Overview
    • Workflow API
    • Adaptive Card API
  • Team Management
    • Managing Organisations
    • Team Roles and Permissions
  • Resources
    • JavaScript Libraries
  • Tutorials
    • Creating MS Teams Apps
    • Designing Workflows
    • Building Adaptive Cards
    • Adaptive Cards with AI
    • Examining Workflow Executions
  • Support
    • Changelog
    • Contacting Support
Powered by GitBook
On this page
  • Container
  • ImageSet
  • FactSet
  • ColumnSet
  • Table
  1. Adaptive Cards
  2. Building Adaptive Cards

Container Elements

Adaptive Card elements used to configure and organise an Adaptive Cards layout.

Container

Description

This is the standard container that can hold any and all other elements. This container is very useful if you have a single column of elements that you may need to render. Great for background images/colours, and alignment of child elements - all controllable from the Element Properties Toolbar.

Technical Documentation

Read more about the Container

ImageSet

Description

Used for adding a collection of images. Each image takes its own column - acts as a carousel of images. You must use an HTTP URL for each of the images. You can add new images by selecting the ImageSet from the Adaptive Card Canvas and clicking on the image icon on the bottom right of the selected element.

Technical Documentation

Read more about the ImageSet

FactSet

Description

Used as a 2-column table of information. Mimics a key-value table. Each new key-value pairing is a new row in the FactSet. This only allows text in both key and value text blocks. Add new fact sets from the Element Properties Toolbar.

Technical Documentation

Read more about the FactSet

ColumnSet

Description

This container will allow you to add multiple columns. Gives the opportunity to add more elements or containers side by side. You can add a new column by clicking on the ColumnSet that has been added to the Adaptive Card Canvas and selecting the icon at the bottom right. You can add any element to a column of a ColumnSet.

Each column can also have a weight set against it by changing the Width parameter in the Element Properties Toolbar to Weighted from Stretched and assigning a weight to the Weight field, this will be a percentage value.

Columns share the same styling, and alignment features as the standard Container element.

Technical Documentation

Read more about the ColumnSet

Table

Description

Aligns elements in a table format.

You can add rows by selecting the Table on the Adaptive Card Canvas and then clicking the "Add a row" button. Remove a row by selecting the TableRow from the Card Structure Toolbar and then click either the "X" on the selected row or by pressing "Backspace."

Adding and removing columns for a row is easy as well, select the Table, navigate to the Element Properties Toolbar, scroll to the bottom, and add/remove columns.

Each column can have its own weight - this is a proportional size against the other columns. e.g. Column A could be size 2 and Column B has a size of 1, this means Column A is 2x bigger than Column B.

Each TableCell, TableRow, and the Table itself can be styled like the base Container Element.

Technical Documentation

Read more about the Table

PreviousBuilding Adaptive CardsNextContent Elements

Last updated 1 year ago