适用于常见问题的自适应卡内的自适应卡

Posted

技术标签:

【中文标题】适用于常见问题的自适应卡内的自适应卡【英文标题】:Adaptive Card inside Adaptive Card for FAQ's 【发布时间】:2019-08-19 21:03:14 【问题描述】:

我正在考虑创建一张用于常见问题解答的自适应卡片。所以有一张带有标题常见问题的 Action.Showcard 的卡片。用户点击常见问题解答后,卡片应展开以显示 5 个问题。问题本身就是一张自适应卡片,因此当用户点击问题时,卡片会打开以显示答案。

我无法设法将卡片放在卡片中。这是我使用 Adaptive Card designer 构建的 JSON


    "type": "AdaptiveCard",
    "body": [
        
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "Hi I am a ChatBot."
        ,
        
            "type": "TextBlock",
            "text": "Look at FAQs below.",
            "wrap": true
        
    ],
    "actions": [
        
            "type": "Action.ShowCard",
            "title": "FAQs",
            "card": 
                "type": "AdaptiveCard",
                "style": "emphasis",
                "body": [
                    
                        "type": "TextBlock",
                        "text": "How quickly can we close?"
                    
                ],
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
            
        ,
        
            "type": "Action.ShowCard",
            "title": "Comment",
            "card": 
                "type": "AdaptiveCard",
                "style": "emphasis",
                "body": [
                    
                        "type": "Input.Text",
                        "id": "comment",
                        "placeholder": "Enter your comment",
                        "isMultiline": true
                    
                ],
                "actions": [
                    
                        "type": "Action.Submit",
                        "title": "OK"
                    
                ],
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
            
        
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.0"

当我将 Action.ShowCard 放在 Action.ShowCard 标记中时,它会给我一个错误并将 Action.ShowCard 更改为 AdpativeCard。有人可以告诉我这种设计的结构吗?这会很有帮助,因为我需要扩展这些常见问题解答。

【问题讨论】:

你能解释一下当你说你将一个 Action.ShowCard 放在一个 Action.ShowCard 标记内吗? 【参考方案1】:

也许我不理解您的问题,但我能够在设计器中创建您想要的结构而没有问题:


    "type": "AdaptiveCard",
    "body": [
        
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "Hi I am a ChatBot."
        ,
        
            "type": "TextBlock",
            "text": "Look at FAQs below.",
            "wrap": true
        
    ],
    "actions": [
        
            "type": "Action.ShowCard",
            "title": "FAQs",
            "card": 
                "type": "AdaptiveCard",
                "style": "emphasis",
                "actions": [
                    
                        "type": "Action.ShowCard",
                        "title": "How quickly can we close?",
                        "card": 
                            "type": "AdaptiveCard",
                            "style": "emphasis",
                            "body": [
                                
                                    "type": "TextBlock",
                                    "text": "Never"
                                
                            ],
                            "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
                        
                    ,
                    
                        "type": "Action.ShowCard",
                        "title": "Second question",
                        "card": 
                            "type": "AdaptiveCard",
                            "style": "emphasis",
                            "body": [
                                
                                    "type": "TextBlock",
                                    "text": "Second answer"
                                
                            ],
                            "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
                        
                    
                ],
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
            
        ,
        
            "type": "Action.ShowCard",
            "title": "Comment",
            "card": 
                "type": "AdaptiveCard",
                "style": "emphasis",
                "body": [
                    
                        "type": "Input.Text",
                        "id": "comment",
                        "placeholder": "Enter your comment",
                        "isMultiline": true
                    
                ],
                "actions": [
                    
                        "type": "Action.Submit",
                        "title": "OK"
                    
                ],
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
            
        
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.0"

【讨论】:

谢谢你完美的工作。我知道我错在哪里了。您必须为每个问题添加一个操作标签。我没有那样做。 我可以将问题堆叠而不是放在同一行吗? 操作的布局将由频道客户端控制,除非您使用网络聊天,否则您将无法影响它。幸运的是,我见过的大多数通道都会堆叠动作,所以当你在设计器之外使用卡片时,你应该会看到你想要的行为。如果您希望能够更改操作布局,请随时在 repo 中提交功能请求:github.com/Microsoft/AdaptiveCards/issues

以上是关于适用于常见问题的自适应卡内的自适应卡的主要内容,如果未能解决你的问题,请参考以下文章

没有模式框或弹出窗口的自适应支付?

没有模式框或弹出窗口的自适应支付?

适当的自适应卡片输入.ChoiceSet 模板结构

基于视图大小的自适应 UIPresentationController

echarts的自适应问题(窗口自适应,侧边栏自适应,el-tab中的自适应)

BotFramework-WebChat - 自适应卡片