Transport Controls

Transport Controlsレイアウトを使うと、再生、一時停止、再開などビデオのコントロール表示を操作できます。

APL応答にレイアウトを追加する方法についての一般的な情報は、レイアウトを参照してください。

Transport Controlsレイアウトを使ってユーザーエクスペリエンスを向上させる方法について詳しくは、デザインガイドのリンクを参照してください。

alexa-layoutsパッケージを読み込む

AlexaTransportControlsを使用するには、alexa-layoutsパッケージを読み込みます。

alexa-layoutsパッケージの最新バージョンは1.1.0です。AlexaTransportControlsはバージョン1.0.0で導入されました。

このページの上部にあるその他のバージョンオプションをクリックすると、別のバージョンのAlexaTransportControlsドキュメントが表示されます。各パラメーターが追加されたalexa-layoutsのバージョンを、パラメーターの表に示します。

Transport Controlsの仕様

次に、Transport Controlsの仕様を示します。

        "AlexaTransportControls": {
            "parameters": [
                {
                    "name": "secondaryControls",
                    "type": "string",
                    "default":"skip",
                    "description": "使用する第2コントロールの種類です。デフォルトはskip（早送り、早戻し）です。有効なオプションはskipとnoneです"
                },
                {
                    "name": "primaryControlSize",
                    "type": "dimension",
                    "default":"@transportPrimaryButtonSize",
                    "description": "第1ボタンの幅と高さです"
                },
                {
                    "name": "secondaryControlSize",
                    "type": "dimension",
                    "default":"@transportSecondaryButtonSize",
                    "description": "第2ボタンの幅と高さです"
                },
                {
                    "name": "mediaComponentId",
                    "type": "string",
                    "description": "メディアを再生しているコンポーネントのIDです"
                },
                {
                    "name": "autoplay",
                    "type": "boolean",
                    "default": false,
                    "description": "再生／停止アイコンの開始状態を決定します。これは、メディア再生コンポーネントの自動再生状態と一致する必要があります。デフォルトはfalseです。"
                },
                {
                    "name": "playPauseToggleButtonId",
                    "type": "string",
                    "default": "alexaPlayPauseToggleButton",
                    "description": "再生／停止切り替えボタンに設定する任意のIDです。これは、それぞれ固有のTransport Controlsを持つ複数のビデオを画面上に表示するときに便利です。
                }
            ]

Transport Controlsレイアウトによる操作

Transport Controlsレイアウトには、複数のコントロールが含まれます。secondaryControls、primaryControlSize、secondaryControlSize、mediaComponentId、autoplay、playPauseToggleButtonIdです。

secondaryControls

名前	型	説明	デフォルト
`secondaryControls`	列挙	使用する第2コントロールの種類です。`skip`または`none`になります。	`skip`

primaryControlSize

名前	型	説明	デフォルト
`primaryControlSize`	ディメンション	第1ボタンの幅と高さです。	`"@transportPrimaryButtonSize"`

secondaryControlSize

名前	型	説明	デフォルト
`secondaryControlSize`	ディメンション	第2ボタンの幅と高さです。	`"@transportSecondaryButtonSize"`

mediaComponentId

名前	型	説明	デフォルト
`mediaComponentId`	文字列	メディアを再生しているコンポーネントのIDです。

autoplay

名前	型	説明	デフォルト
`autoplay`	ブール値	再生／停止アイコンの開始状態を決定します。この値は、メディア再生コンポーネントの自動再生状態と一致する必要があります。	`false`

playPauseToggleButtonId

名前	型	説明	デフォルト
`playPauseToggleButtonId`	文字列	再生／停止切り替えボタンに設定する任意のIDです。これは、それぞれ固有のTransport Controlsを持つ複数のビデオを画面上に表示するときに便利です。	`alexaPlayPauseToggleButton`

Transport Controlsレイアウトの例

このAPLドキュメントは、mp4形式のビデオを参照します。