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
Weather large sample
Data JSON
{
"data": [
{
"moonrise_ts": 1572993161,
"wind_cdir": "SSE",
"rh": 90,
"pres": 1012.95,
"high_temp": 8.6,
"sunset_ts": 1573001147,
"ozone": 252.181,
"moon_phase": 0.768526,
"wind_gust_spd": 4.4,
"snow_depth": 0,
"clouds": 70,
"ts": 1572940860,
"sunrise_ts": 1572966051,
"app_min_temp": 3.7,
"wind_spd": 1.33298,
"pop": 25,
"wind_cdir_full": "south-southeast",
"slp": 1021.94,
"valid_date": "2019-11-05",
"app_max_temp": 10.2,
"vis": 22.5692,
"dewpt": 6.8,
"snow": 0,
"uv": 1.74992,
"weather": {
"icon": "c03d",
"code": 803,
"description": "Broken clouds"
},
"wind_dir": 162,
"max_dhi": null,
"clouds_hi": 0,
"precip": 0.3125,
"low_temp": 7.7,
"max_temp": 10.4,
"moonset_ts": 1572946958,
"datetime": "2019-11-05",
"temp": 8.5,
"min_temp": 5.7,
"clouds_mid": 0,
"clouds_low": 70
},
{
"moonrise_ts": 1573081007,
"wind_cdir": "NNE",
"rh": 88,
"pres": 1015.48,
"high_temp": 12.3,
"sunset_ts": 1573087463,
"ozone": 263.048,
"moon_phase": 0.845631,
"wind_gust_spd": 5,
"snow_depth": 0,
"clouds": 60,
"ts": 1573027260,
"sunrise_ts": 1573052542,
"app_min_temp": 3.3,
"wind_spd": 1.50821,
"pop": 35,
"wind_cdir_full": "north-northeast",
"slp": 1024.5,
"valid_date": "2019-11-06",
"app_max_temp": 12.3,
"vis": 23.125,
"dewpt": 6.6,
"snow": 0,
"uv": 2.93193,
"weather": {
"icon": "c03d",
"code": 803,
"description": "Broken clouds"
},
"wind_dir": 18,
"max_dhi": null,
"clouds_hi": 17,
"precip": 0.5,
"low_temp": 5,
"max_temp": 12.3,
"moonset_ts": 1573037127,
"datetime": "2019-11-06",
"temp": 8.5,
"min_temp": 6.6,
"clouds_mid": 9,
"clouds_low": 46
},
{
"moonrise_ts": 1573168702,
"wind_cdir": "SE",
"rh": 71,
"pres": 1006.39,
"high_temp": 13.1,
"sunset_ts": 1573173781,
"ozone": 257.617,
"moon_phase": 0.909923,
"wind_gust_spd": 1.80495,
"snow_depth": 0,
"clouds": 94,
"ts": 1573113660,
"sunrise_ts": 1573139032,
"app_min_temp": 0.5,
"wind_spd": 0.77653,
"pop": 0,
"wind_cdir_full": "southeast",
"slp": 1022.86,
"valid_date": "2019-11-07",
"app_max_temp": 13.1,
"vis": 24.135,
"dewpt": 2.6,
"snow": 0,
"uv": 1.10983,
"weather": {
"icon": "c04d",
"code": 804,
"description": "Overcast clouds"
},
"wind_dir": 136,
"max_dhi": null,
"clouds_hi": 94,
"precip": 0,
"low_temp": 4.4,
"max_temp": 13.4,
"moonset_ts": 1573127315,
"datetime": "2019-11-07",
"temp": 7.7,
"min_temp": 4.2,
"clouds_mid": 0,
"clouds_low": 0
},
{
"moonrise_ts": 1573256318,
"wind_cdir": "SSE",
"rh": 71,
"pres": 1006.02,
"high_temp": 15.8,
"sunset_ts": 1573260100,
"ozone": 258.722,
"moon_phase": 0.958606,
"wind_gust_spd": 2.11071,
"snow_depth": 0,
"clouds": 93,
"ts": 1573200060,
"sunrise_ts": 1573225523,
"app_min_temp": 2.7,
"wind_spd": 0.802894,
"pop": 0,
"wind_cdir_full": "south-southeast",
"slp": 1022.2,
"valid_date": "2019-11-08",
"app_max_temp": 15.8,
"vis": 24.1349,
"dewpt": 4.5,
"snow": 0,
"uv": 0.989995,
"weather": {
"icon": "c04d",
"code": 804,
"description": "Overcast clouds"
},
"wind_dir": 167,
"max_dhi": null,
"clouds_hi": 93,
"precip": 0,
"low_temp": 6.1,
"max_temp": 15.9,
"moonset_ts": 1573217557,
"datetime": "2019-11-08",
"temp": 9.6,
"min_temp": 6,
"clouds_mid": 6,
"clouds_low": 0
},
{
"moonrise_ts": 1573343920,
"wind_cdir": "SW",
"rh": 78,
"pres": 1008.56,
"high_temp": 14,
"sunset_ts": 1573346422,
"ozone": 257.936,
"moon_phase": 0.988998,
"wind_gust_spd": 3.61965,
"snow_depth": 0,
"clouds": 88,
"ts": 1573286460,
"sunrise_ts": 1573312013,
"app_min_temp": 2.5,
"wind_spd": 1.00688,
"pop": 0,
"wind_cdir_full": "southwest",
"slp": 1024.28,
"valid_date": "2019-11-09",
"app_max_temp": 14,
"vis": 24.135,
"dewpt": 5.2,
"snow": 0,
"uv": 1.06772,
"weather": {
"icon": "c04d",
"code": 804,
"description": "Overcast clouds"
},
"wind_dir": 228,
"max_dhi": null,
"clouds_hi": 88,
"precip": 0,
"low_temp": 5,
"max_temp": 14.1,
"moonset_ts": 1573307883,
"datetime": "2019-11-09",
"temp": 9,
"min_temp": 5.9,
"clouds_mid": 13,
"clouds_low": 0
},
{
"moonrise_ts": 1573431573,
"wind_cdir": "SSW",
"rh": 88,
"pres": 1009,
"high_temp": 14.5,
"sunset_ts": 1573432745,
"ozone": 254.76,
"moon_phase": 0.998794,
"wind_gust_spd": 2.3142,
"snow_depth": 0,
"clouds": 56,
"ts": 1573372860,
"sunrise_ts": 1573398503,
"app_min_temp": 1.4,
"wind_spd": 1.01273,
"pop": 0,
"wind_cdir_full": "south-southwest",
"slp": 1024.9,
"valid_date": "2019-11-10",
"app_max_temp": 14,
"vis": 24.135,
"dewpt": 5.7,
"snow": 0,
"uv": 3.01026,
"weather": {
"icon": "c03d",
"code": 803,
"description": "Broken clouds"
},
"wind_dir": 197,
"max_dhi": null,
"clouds_hi": 56,
"precip": 0,
"low_temp": 5.1,
"max_temp": 14,
"moonset_ts": 1573398303,
"datetime": "2019-11-10",
"temp": 7.7,
"min_temp": 5,
"clouds_mid": 21,
"clouds_low": 0
},
{
"moonrise_ts": 1573519349,
"wind_cdir": "SE",
"rh": 79,
"pres": 1008.69,
"high_temp": 14.5,
"sunset_ts": 1573519071,
"ozone": 252.062,
"moon_phase": 0.986379,
"wind_gust_spd": 2.80175,
"snow_depth": 0,
"clouds": 33,
"ts": 1573459260,
"sunrise_ts": 1573484992,
"app_min_temp": 1.5,
"wind_spd": 1.17444,
"pop": 0,
"wind_cdir_full": "southeast",
"slp": 1025.21,
"valid_date": "2019-11-11",
"app_max_temp": 14.5,
"vis": 24.135,
"dewpt": 4.7,
"snow": 0,
"uv": 2.38631,
"weather": {
"icon": "c02d",
"code": 802,
"description": "Scattered clouds"
},
"wind_dir": 136,
"max_dhi": null,
"clouds_hi": 33,
"precip": 0,
"low_temp": 5.4,
"max_temp": 14.5,
"moonset_ts": 1573488786,
"datetime": "2019-11-11",
"temp": 8.4,
"min_temp": 5.1,
"clouds_mid": 0,
"clouds_low": 0
}
],
"city_name": "King",
"lon": "-122.1232",
"timezone": "America/Los_Angeles",
"lat": "47.6718",
"country_code": "US",
"state_code": "WA"
}
Template JSON
{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"speak": "Weather forecast for Monday is high of 62 and low of 42 degrees with a 20% chance of rainWinds will be 5 mph from the northeast",
"backgroundImage": "http://messagecardplayground.azurewebsites.net/assets/Mostly%20Cloudy-Background-Dark.jpg",
"body": [
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": 35,
"items": [
{
"type": "Image",
"url": "https://messagecardplayground.azurewebsites.net/assets/Mostly%20Cloudy-Square.png",
"size": "Stretch"
}
]
},
{
"type": "Column",
"width": 65,
"items": [
{
"type": "TextBlock",
"text": "${data[0].datetime}",
"weight": "Bolder",
"size": "Large",
"color": "Light"
},
{
"type": "TextBlock",
"text": "${data[0].app_min_temp * 1000 / 5 * 9 / 1000 + 32} / ${data[0].app_max_temp * 1000 / 5 * 9 / 1000 + 32}",
"size": "Medium",
"spacing": "None"
},
{
"type": "TextBlock",
"isSubtle": true,
"text": "${data[0].precip * 100} % chance of rain",
"spacing": "None"
},
{
"type": "TextBlock",
"isSubtle": true,
"text": "Winds ${data[0].wind_gust_spd} mph ${data[0].wind_cdir}",
"spacing": "None"
}
]
}
]
},
{
"type": "ColumnSet",
"columns": [
{
"type": "Column",
"width": 20,
"items": [
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "Fri"
},
{
"type": "Image",
"size": "auto",
"url": "https://messagecardplayground.azurewebsites.net/assets/Mostly%20Cloudy-Square.png"
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "${data[0].app_max_temp * 1000 / 5 * 9 / 1000 + 32} "
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"isSubtle": true,
"text": "${data[0].app_min_temp * 1000 / 5 * 9 / 1000 + 32} ",
"spacing": "None"
}
],
"selectAction": {
"type": "Action.OpenUrl",
"title": "View Friday",
"url": "https://www.microsoft.com"
}
},
{
"type": "Column",
"width": 20,
"items": [
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "Sat"
},
{
"type": "Image",
"size": "auto",
"url": "https://messagecardplayground.azurewebsites.net/assets/Drizzle-Square.png"
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "${data[1].app_max_temp * 1000 / 5 * 9 / 1000 + 32} "
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"isSubtle": true,
"text": "${data[1].app_min_temp * 1000 / 5 * 9 / 1000 + 32} ",
"spacing": "None"
}
],
"selectAction": {
"type": "Action.OpenUrl",
"title": "View Saturday",
"url": "https://www.microsoft.com"
}
},
{
"type": "Column",
"width": 20,
"items": [
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "Sun"
},
{
"type": "Image",
"size": "auto",
"url": "https://messagecardplayground.azurewebsites.net/assets/Mostly%20Cloudy-Square.png"
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "${data[2].app_max_temp * 1000 / 5 * 9 / 1000 + 32} "
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"isSubtle": true,
"text": "${data[2].app_min_temp * 1000 / 5 * 9 / 1000 + 32} ",
"spacing": "None"
}
],
"selectAction": {
"type": "Action.OpenUrl",
"title": "View Sunday",
"url": "https://www.microsoft.com"
}
},
{
"type": "Column",
"width": 20,
"items": [
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "Mon"
},
{
"type": "Image",
"size": "auto",
"url": "https://messagecardplayground.azurewebsites.net/assets/Mostly%20Cloudy-Square.png"
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"text": "${data[3].app_max_temp * 1000 / 5 * 9 / 1000 + 32} "
},
{
"type": "TextBlock",
"horizontalAlignment": "Center",
"isSubtle": true,
"text": "${data[3].app_min_temp * 1000 / 5 * 9 / 1000 + 32} ",
"spacing": "None"
}
],
"selectAction": {
"type": "Action.OpenUrl",
"title": "View Monday",
"url": "https://www.microsoft.com"
}
}
]
}
]
}
Adaptive Card
