Conditional formatting for adaptive cards

(0) Share

Report

Posted on by NewUser22

Hi all!

Wanted to check on how do we do conditional formatting for color on adaptive cards for bot composer?

Seems like bot composer only supports version 1.3.

{
"type": "AdaptiveCard",
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"version": "1.3",
"body": [
 { 
 "$data": "${AttendanceMonthly}",
 "type": "TextBlock",
 "weight": "bolder",
 "color": "${if(Month = January, 'attention', 'good')}", 
 "text": "Hours worked: ${Month}"
 }]

Categories:

General topics

I have the same question (0)

All responses (8)

Answers (0)

Sort by

Expiscornovus 33,851 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!
Hi @NewUser22,

You could use an adaptive expression which uses the if and equals functions.

Below is an example which should work with 1.3 (I have tested it in the Demo website channel)

${if(equals(Month,January), 'Attention', 'Good')}

1. The code on the bot framework composer

2. The testing in the Demo website channel.

Was this reply helpful? Yes No
NewUser22 69 on at

Like (0)

Report
Copy link

Link copied!
That's great! Did it work for your second case though? I find that mine still stuck at "good" even if it is not january.

{ "type": "AdaptiveCard", "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.3", "body": [ { "$data": "${AttendanceMonthly}", "type": "TextBlock", "weight": "bolder", "color": "${if(equals(Month,Jan), 'good', 'attention')}",
"text": "Hours worked: ${Month}" }],

Also tried it on designer io but still not working for me.

Was this reply helpful? Yes No
Expiscornovus 33,851 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi @NewUser22,

Yes, it also worked for the valueIfFalse, see the gif below.

I am outputting March in the Month property and therefore it is showing the valueIfFalse. Which in this new setup is Attention (aka the red color), just like in your expression.

What are you outputting in Month? Can you share a screenshot of a test run in the Demo website channel?

Was this reply helpful? Yes No
NewUser22 69 on at

Like (0)

Report
Copy link

Link copied!

Here you go.

Was this reply helpful? Yes No
Expiscornovus 33,851 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi @NewUser22,

Thanks for sharing, but I see that is a screenshot from https://adaptivecards.io/designer/

Apologies that I was not clear, I am talking about testing it from the Demo website channel within your Power Virtual Agent 😀

Was this reply helpful? Yes No
NewUser22 69 on at

Like (0)

Report
Copy link

Link copied!

Oh i see! Thanks for clarifying. Does it work for teams in your case? We are using the PVA in teams.

Was this reply helpful? Yes No
Expiscornovus 33,851 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi @NewUser22,

It looks like the adaptive card designer website does not like our expressions 😁

But it seems to work fine in PVA in teams (in the browser, I have not tried the Teams Desktop client).

Was this reply helpful? Yes No
PulkitM 24 on at

Like (0)

Report
Copy link

Link copied!

Hi,

Just want to know from where Month variable is getting value.

Was this reply helpful? Yes No