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
VideoComponent- Alexa Design Guide: Responsive Components
Last updated: Nov 28, 2023