Samples and Templates
These samples are just a teaser of the type of cards you can create. Go ahead and tweak them to make any scenario possible!
Adaptive Card Templating enables the separation of data from the layout in an Adaptive Card. It helps design a card once, and then populate it with real data at runtime. More about templating
Restaurant sample
Data JSON
{
"@context": "http://schema.org/",
"@type": "LocalBusiness",
"name": "Malt \u0026 Vine",
"url": "https://www.yelp.com/biz/malt-and-vine-redmond",
"address": {
"addressLocality": "Redmond",
"addressRegion": "WA",
"streetAddress": "16851 Redmond Way",
"postalCode": "98052",
"addressCountry": "US"
},
"image": "https://s3-media1.fl.yelpcdn.com/bphoto/HD_NsxwaCTwKRxvOZs2Shw/ls.jpg",
"telephone": "+14258816461",
"aggregateRating": {
"reviewCount": 176,
"@type": "AggregateRating",
"ratingValue": 4.5
},
"review": [{
"reviewRating": {
"ratingValue": 4
},
"datePublished": "2014-11-28",
"description": "Great concept and a wide selection of beers both on tap and bottled! Smaller wine selection than I wanted, but the variety of beers certainly made up for that. Although I didn't order anything, my boyfriend got a beer and he loved it. Their prices are fair too. \n\nThe concept is really awesome. It's a bar/store that you can bring outside food into. The place was pretty packed tonight. I wish we had stayed for more than one drink. I would have loved to sample everything!",
"author": "Blaire S."
}],
"priceRange": "$$"
}
Template JSON
{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"speak": "Tom's Pie is a Pizza restaurant which is rated 9.3 by customers.",
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": 2,
"items": [
{
"type": "TextBlock",
"text": "${address.addressLocality}, ${address.addressRegion}"
},
{
"type": "TextBlock",
"text": "${name}",
"weight": "Bolder",
"size": "ExtraLarge",
"spacing": "None"
},
{
"type": "TextBlock",
"$when": "${aggregateRating.ratingValue <= 1}",
"text": "${aggregateRating.ratingValue} ★☆☆☆☆ (${aggregateRating.reviewCount}) · ${priceRange}",
"isSubtle": true,
"spacing": "None"
},
{
"type": "TextBlock",
"$when": "${aggregateRating.ratingValue <= 2}",
"text": "${aggregateRating.ratingValue} ★★☆☆☆ (${aggregateRating.reviewCount}) · ${priceRange}",
"isSubtle": true,
"spacing": "None"
},
{
"type": "TextBlock",
"$when": "${aggregateRating.ratingValue <= 3}",
"text": "${aggregateRating.ratingValue} ★★★☆☆ (${aggregateRating.reviewCount}) · ${priceRange}",
"isSubtle": true,
"spacing": "None"
},
{
"type": "TextBlock",
"$when": "${aggregateRating.ratingValue <= 4}",
"text": "${aggregateRating.ratingValue} ★★★★☆ (${aggregateRating.reviewCount}) · ${priceRange}",
"isSubtle": true,
"spacing": "None"
},
{
"type": "TextBlock",
"$when": "${aggregateRating.ratingValue <= 5}",
"text": "${aggregateRating.ratingValue} ★★★★★ (${aggregateRating.reviewCount}) · ${priceRange}",
"isSubtle": true,
"spacing": "None"
},
{
"type": "TextBlock",
"text": "**${review[0].author}** said \"${review[0].description}\"",
"size": "Small",
"wrap": true,
"maxLines": 3
}
]
},
{
"type": "Column",
"width": 1,
"items": [
{
"type": "Image",
"url": "${image}",
"size": "auto"
}
]
}
]
}
],
"actions": [
{
"type": "Action.OpenUrl",
"title": "More Info",
"url": "${url}"
}
]
}
Adaptive Card
