卡片技能开发（轻服务）

通过天猫精灵技能平台，可以开发技能的卡片渲染。

上传到天猫精灵技能平台

前端开发完成后，上传到技能对应的屏显页面代码包里。

开发技能的渲染指令

在技能响应的指令中，指定渲染指令，并设置pageType为AliGenie.Card。

{
    "version":"2.0",
    "response":{
        "outputSpeech":{
          "type":"PlainText",
            "text":"杭州未来四天内天气变化较大，周四会有雨。晚上气温较低请注意防寒保暖。"
        },
        "directive":[
          {
            "type":"TPL.RenderDocument",
            "document":{
              "pageType":"AliGenie.Card",
              "data":{
                "layout":{
                  "backgroundColor":"linear-gradient(180deg, #5BD7CD 0%, #3DBAD3 100%)"
                },
                "content":[{
                  "dataSource":{} //waft包中需要用到的数据内容
                }]
              }
            }
          }
        ],
        "shouldEndSession":true,
        "expectSpeech":false
    }
}

详细可以参考：TPL模板渲染指令 https://www.yuque.com/waft/docs/vax3gi#RlAOV

修改卡片对应的样式展示

在返回的指令中，layout字段可以指定对应的卡片外围容器的展现样式。

具体的字段有：

"layout":{
  "version":"1.0",
  "backgroundImage":"",
  "window":{
    "position":"right_center",
    "viewport":"1024",
    "width":"463rpx",
    "height":"520rpx",
    "padding":"0rpx 0rpx 0rpx 0rpx",
    "margin":"0rpx 0rpx 40rpx 0rpx",
    "anim":{
      "enter":"slide_in_right",
      "exit":"slide_out_right"
    },
    "borderRadius":"15rpx"
  },
  "listStyle":{
    "type":"",
    "orientation":""
  }
}