Search code examples
node.jslambdaalexa-skills-kit

Using the Alexa Skills node SDK to display a full screen image on Echo Show

I'm using the Alexa Node SDK to build my application which is hosted on AWS Lambda. When using an Echo Show (or any display-enabled device), I'd like the screen to update with a full-screen image when Alexa responds with audio.

I'm able to do this with the "Standard Card" -- but the image is very small and appears to the right of the spoken text.

Is there any way to remove the text and display the image full screen?

Sample code:

return handlerInput.responseBuilder
    .speak('my text')
    .withStandardCard('my title', 'my text', 'https://myimage-sm.jpg', 'https://myimage-lg.jpg')
    .reprompt('my title', 'my text')
    .addElicitSlotDirective('slotname')
    .getResponse();

To be clear, I've also tried adding a template with addRenderTemplateDirective, but this throws an error, as Alexa allows only one directive per slot.

No other directives are allowed to be specified with a Dialog directive. The following Dialog Directives were returned: [Display.RenderTemplate]
Solution

  • You can try my project here which uses APL behind the curtains to render the card wit a full background. BTW, the limitation is not one directive per slot, the limitation is that you can't use any dialog related directive with other directives, for example render template directives or APL directives. So if you're going to do dialog management forget about sending display rendering directives for the time being.