MoreBeerMorePower

Power Platform中心だけど、ノーコード/ローコード系を書いてます。

Post Adaptive Cards directly from Canvas app

With the addition of Untyped object, many actions can now be executed in Power Apps. If an action parameter requires a dynamic object, Power Apps requires that parameter to be passed as an Untyped object.

In this article, I will show you how to post an adaptive card directly from Power Apps, which is now possible with Untyped object.

How dynamic the request parameter?

Being dynamic means that the shape of the object to be entered changes depending on other parameters specified by maker.

In the action PostCardToConversation, we specify the recipient and messageBody (= the payload of the adaptive card), but the data structure we specify for the recipient will change depending on where the card is posted.

If the card is posted in Teams channel, recipient will be the record with groupId and channelId, but case of a group chat, you simply specify the chat ID. This means Post card request is dynamic, and it would be Untyped object in Power Apps.

Build Untyped Object using ParseJSON

Untyped Object can be built by using ParseJSON() function in Power Apps and it requires JSON String (For details of function, see Docs )

To convert usual data types in Power Apps into JSON String, we use JSON() function,

So, the combination of ParseJSON(JSON(<Record/Table type data>)) can be used to convert from a standard data types in Power Apps to a Untyped Object.

Entire expression to post adaptive card

Now we are ready to execute PostCardToConversation action directly from Power Apps. Below is expression to post card to Teams channel. I set this expression to Button OnSelect.

MicrosoftTeams.PostCardToConversation(
    "Flow bot",
    "Channel",
    ParseJSON(
        JSON(
            {
                recipient: {
                    groupId: "d1a21e84-54bd-4bd5-1111-ab01ca6b2b75",
                    channelId: "19:bb156a2b42234564bb86e68920ad95519@thread.skype"
                },
                messageBody: Label3.Text//Adaptive Card Payload
            },
            JSONFormat.Compact
        )
    )
)

also Laabel3.Text is

"{
    ""type"": ""AdaptiveCard"",
    ""$schema"": ""http://adaptivecards.io/schemas/adaptive-card.json"",
    ""version"": ""1.3"",
    ""body"": [
        {
            ""type"": ""TextBlock"",
            ""text"": ""Subject"",
            ""wrap"": true,
            ""size"": ""Large"",
            ""weight"": ""Bolder""
        },
        {
            ""type"": ""TextBlock"",
            ""text"": ""Test message"",
            ""wrap"": true
        },
        {
            ""type"": ""TextBlock"",
            ""text"": ""Body"",
            ""wrap"": true,
            ""size"": ""Large"",
            ""weight"": ""Bolder""
        },
        {
            ""type"": ""TextBlock"",
            ""text"": ""Hello,\n\nThis is test card posted from Power Apps :)"",
            ""wrap"": true
        }
    ],
    ""msteams"": {
        ""width"": ""Full""
    }
}"

Note that Adaptive card payload (JSON) shoud be Text type, thus every double quotation are escaped.

That's all.

The sample app is available 👇

https://github.com/mofumofu-dance/PowerApps365/raw/master/Samples/Send%20Adaptive%20Card%20from%20App.msapp

Thank you for reading :)