question

Chen Chen avatar image
Chen Chen asked

Reduce the button size of AlexaButton using APL

We are trying to develop an app using Echo Show (smart speaker with screen) using APL. The users should be prompted for button clicking. I am wondering are there any ways to reduce the button size (put 5 buttons in an Echo Show display)?

These are some code snippet I wrote for rendering buttons on the screen:

 "item":[{
    "when": "${@viewportProfile != @hubRoundSmall}",
    "type": "Sequence",
    "width": "100%",
    "scrollDirection": "horizontal",
    "alignSelf": "center",
    "data": "${buttons}",
    "items":[{
        "type": "AlexaButton",
        "buttonText": "${data.buttonText}",
        "id": "${data.id}",
        "buttonSize": "30dp",
        "buttonStyle": "${data.buttonStyle}",
        "touchForward": "${touchForwardSetting}",
    }]
}]


In the "Items", I have tried to add keys of "size", "buttonSize", "maxWidth", and "width". Sadly, none of them work.. It would be really appreciated if someone knows the correct keys I should put. Thanks!

alexa skills kitalexaapl
10 |5000

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

Jason@Amazon avatar image
Jason@Amazon answered

It isn't possible to customize the responsive templates outside of the parameters that are listed on the documentation - if you want more customization, you'll have to create your own custom button yourself.

1 comment
10 |5000

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

Chen Chen avatar image Chen Chen commented ·
Thanks a lot! Could you please point us on how to create custom button (preferable if there are source code)? we just need to make 5 buttons fitting into one screen by reducing the width.
0 Likes 0 ·
Alexander Martin avatar image
Alexander Martin answered

Hi @Chen Chen,

check out this alternative button implementation:

https://apl.ninja/xeladotbe/fully-customizable-button-i9o0

here is an alternative how to put 5 AlexaButtons next to each other

https://apl.ninja/document/xeladotbe/ILHyg4Bw3VEUwtlxB5jNOBkRELRKcWzo

Hope this helps

Rexgards,

Ale

10 |5000

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