question

StefanV avatar image
StefanV asked ·

Alexa APL ListTemplate & FireTV Remote

Hello,

i have an Alexa Skill, which uses APL. The Document ist mainly based on the templates from apl. (List Template 1).

The List can be already controlled via FireTV Remote. (Scroll up/down, and select an item).

The bad thing: The user can't currently see which item of the list is selected.

Are there any recommendations how can i achiev an highlighting of the item (maybe display an border on the selected item).


This is the Codesnippet in the APL Document for the Sequence

{
       "type": "Sequence",
       "grow": 1,
       "height": "70vh",
       "scrollDirection": "vertical",
       "paddingLeft": "@marginLeft",
       "paddingRight": "@marginRight",
       "paddingBottom": "100",
       "data": "${listData}",
       "numbered": true,
       "items": [
          {
              "type": "VerticalListItem",
              "image": "${data.image.sources[0].url}",
              "primaryText": "${data.textContent.primaryText}",
              "secondaryText": "${data.textContent.secondaryText}
          }
       ],
       "onScroll": [
         {
            "type": "SendEvent",
            "arguments": [
               "OnScrollCalled",
               "${event}"
            ]
         }
        ]
},

Question 1: It there an Variable similar to ${ordinal} , with the information which element is selected? Or do i have to build it by my own via reacting on the firetv buttons?

Question 2: i played around with "onScroll", with the hope, that this could be a solution.
But on Scroll is never triggered.

When i use my skill, i can scroll up/down, but the SendEvent is not triggered.

Hope someone could give me an hint.

Kind Regards
Stefan

alexa skills kitfire tvapl
10 |2000 characters needed characters left characters exceeded

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

1 Answer

Gaetano@Amazon avatar image
Gaetano@Amazon answered ·

Hi,

thanks for posting on our forums.

Which revision of the FireTV are you using? To handle the highlighting you should apply a style to your component, that will change its color in relation to its current state: more information here.

You can send the index of the selected item to your backend by implementing Touchwrappers. Please find an ad-hoc implementation applied to the ListTemplate example here.

The VerticalListItem is a custom component from the alexa-layouts package so it doesn't natively support the OnScroll event.

Should this doesn't help, please share the full APL layout so I can provide a better solution.

Kind regards,
Gaetano

10 |2000 characters needed characters left characters exceeded

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.