AutoPage Alexa 技能 APL

Question

我正在尝试使用 Alexa 创作器创建幻灯片放映（2-3 张图片）tool.I 已经成功地使用 APL Pager 来做到这一点，它一次显示一系列组件时间。问题是，为了从图像 A 切换到图像 B..C，我必须触摸屏幕并滑动 left/right。我想让它自动发生，并让 alexa 在一定时间内切换图像，这似乎可以使用 APL autopage 来实现，但由于某种原因，这不起作用

我做了什么

使用 APL 寻呼机设置 APL
将自动页面添加到 APL 文档
- 组件 ID
- 持续时间
- 延迟

尝试模拟并直接在回声显示 5 中它仍然仅在触摸显示屏时触发。

也尝试过：

直接在 alexa 的处理程序中添加标准命令（自动寻呼机）但响应相同。

有些疑惑

当我调用 .addDirective[2] 时，将命令放在 APLdocument.json[1] 文件中还是直接放在处理程序中有什么关系吗？持续时间是动态的我应该把它直接放在后端代码中（index.js）对吗？

[1]

{
 "type": "APL",
 "version": "1.4",
 "settings": {},
 "theme": "light",
 "import": [],
 "resources": [],
 "styles": {},
 "onMount": [],
 "graphics": {},
 "commands": [
  {
   "type": "AutoPage",
   "componentId": "fisrtpager",
   "duration": 1000,
   "delay": 500
  }
],

[2]

handlerInput.responseBuilder.addDirective({
   type: 'Alexa.Presentation.APL.RenderDocument',
   token:'arrugas',
   document: physiolift,
   commands: [{
    "type": "AutoPage",
    "componentId": "fisrtpager",
    "duration": 1000,
    "delay": 500
   }]
  });
}

预期输出

让 Alexa（echo show 5）像轮播一样显示一系列图像（无需触摸屏幕）

我的代码

APL 文件

{
   "type":"APL",
   "version":"1.4",
   "settings":{
      
   },
   "theme":"light",
   "import":[
      
   ],
   "resources":[
      
   ],
   "styles":{
      
   },
   "onMount":[
      
   ],
   "graphics":{
      
   },
   "commands":[
      {
         "type":"AutoPage",
         "componentId":"fisrtpager",
         "duration":1000,
         "delay":500
      }
   ],
   "layouts":{
      
   },
   "mainTemplate":{
      "parameters":[
         "payload"
      ],
      "items":[
         {
            "type":"Pager",
            "id":"fisrtpager",
            "width":"100%",
            "height":"100%",
            "items":[
               {
                  "type":"Image",
                  "width":"100%",
                  "height":"100%",
                  "scale":"best-fill",  
 "source":"https://dyl80ryjxr1ke.cloudfront.net/external_assets/hero_examples/hair_beach_v1785392215/original.jpeg",
                  "align":"center"
               },
               {
                  "type":"Image",
                  "width":"100%",
                  "height":"100%",
                  "source":"https://interactive-examples.mdn.mozilla.net/media/cc0-images/grapefruit-slice-332-332.jpg",
                  "scale":"best-fill"
               },
               {
                  "type":"Text",
                  "text":"Just text content shown on page #3",
                  "textAlign":"center"
               }
            ],
            "navigation":"wrap"
         }
      ]
   }
}

index.js

// somewhere inside the intent im invoking
if (Alexa.getSupportedInterfaces(handlerInput.requestEnvelope)['Alexa.Presentation.APL']) {
   // Create Render Directive.
   handlerInput.responseBuilder.addDirective({
    type: 'Alexa.Presentation.APL.RenderDocument',
    token:'arrugas',
    document: require('./documents/ImageTest.json')
 });
}

speakOutput += ' just saying somthing'
return handlerInput.responseBuilder
.speak(speakOutput)
.reprompt('just saying something else')
.getResponse();

Answer 1

只需在“onMount”事件处理程序中添加命令。这是修改后的代码，它完全符合您的需要：

{
"type": "APL",
"version": "1.4",
"settings": {},
"theme": "light",
"import": [],
"resources": [],
"styles": {},
"onMount": [],
"graphics": {},
"layouts": {},
"mainTemplate": {
    "parameters": [
        "payload"
    ],
    "items": [
        {
            "type": "Pager",
            "id": "fisrtpager",
            "width": "100%",
            "height": "100%",
            "items": [
                {
                    "type": "Image",
                    "width": "100%",
                    "height": "100%",
                    "scale": "best-fill",
                    "source": "https://dyl80ryjxr1ke.cloudfront.net/external_assets/hero_examples/hair_beach_v1785392215/original.jpeg",
                    "align": "center"
                },
                {
                    "type": "Image",
                    "width": "100%",
                    "height": "100%",
                    "source": "https://interactive-examples.mdn.mozilla.net/media/cc0-images/grapefruit-slice-332-332.jpg",
                    "scale": "best-fill"
                },
                {
                    "type": "Text",
                    "text": "Just text content shown on page #3",
                    "textAlign": "center"
                }
            ],
            "navigation": "none",
            "onMount": [{
                "type": "AutoPage",
                "componentId": "fisrtpager",
                "duration": 1000,
                "delay": 500
            }]
        }
    ]
}

}

Answer 2

要从后端代码动态更新此功能，您可以执行以下操作：

// check if device supports APL
if (Alexa.getSupportedInterfaces(handlerInput.requestEnvelope)['Alexa.Presentation.APL']) {
   // Create Render Directive.
   handlerInput.responseBuilder.addDirective({
     type: 'Alexa.Presentation.APL.RenderDocument',
     token: "dialogManagementPagerDoc",
     document: require('./PATH-TO/YOUR-APL-FILE.json')
   })
   .addDirective({
   type: "Alexa.Presentation.APL.ExecuteCommands",
   token: "dialogManagementPagerDoc",
   commands: [
    {
      type: "AutoPage",
      componentId: "YOUR_PAGER_ID",
      delay: 1000,
      duration: 5000
     }
   ]
  });
}

AutoPage Alexa 技能 APL

AutoPage Alexa skill APL

alexa

alexa-skills-kit

alexa-presentation-language

我做了什么

有些疑惑

预期输出

我的代码