Transport Controls (1.1.0 and earlier)
(This is not the most recent version of AlexaTransportControls
. Use the Other Versions option to see the documentation for the most recent version of AlexaTransportControls
)
The Alexa transport controls responsive component (AlexaTransportControls
) displays a set of video player controls. You can customize the appearance of the buttons and define the commands to run when the user select the buttons.
Import the alexa-layouts package
To use AlexaTransportControls
, import the alexa-layouts package.
The latest version of the alexa-layouts
package is 1.7.0. AlexaTransportControls
was introduced in version 1.0.0.
Use the Other Versions option at the top of this page to see documentation for different versions of AlexaTransportControls
. The table of parameters notes the version of alexa-layouts
in which each parameter was added.
AlexaTransportControls parameters
All parameters except type
are optional.
Name | Type | Default | Description | Version added/updated |
---|---|---|---|---|
|
Boolean |
|
Determines the starting state of the play/pause icon. This should match the autoplay state of the media playing component. |
1.0.0 |
|
String |
— |
The id of the media playing component. For example, the id for the |
1.0.0 |
|
String |
|
Optional id for the Play/Pause toggle button. Use this property to identify the transport controls component in other commands, such as the |
1.0.0 |
|
|
The height and width for the primary button. When used in a widget, use the default size. |
1.0.0 |
|
|
|
The height and width for the secondary buttons. |
1.0.0 |
|
|
String |
|
The type of secondary controls to use. Valid options are |
1.0.0 |
AlexaTransportControls example
This APL document references a video in mp4 format.
Related topics
- Alexa Design System Overview
- Responsive Components and Templates
Video
Component- Alexa Design Guide: Responsive Components
Last updated: Nov 28, 2023