モーションコンポーネント
Alexa Presentation Language（APL）のモーションコンポーネントは、モーションが組み込まれた、ウィジェット用のレスポンシブ対応コンポーネントです。モーションコンポーネントは、ウィジェットにモーションを追加する場合に推奨される方法です。ウィジェットは、ユーザーがインストールしたほかのウィジェットと共にウィジェットパネルに表示されるため、過剰なモーションはユーザーの気を散らし、ユーザーエクスペリエンスの低下につながります。
利用可能なモーションコンポーネント
以下の表は、alexa-layoutsパッケージに含まれているモーションコンポーネントをまとめたものです。各コンポーネントがalexa-viewport-profilesパッケージのどのビューポートプロファイルでサポートされているかも示しています。
| 名前 | 説明 | 標準のビューポート | ウィジェットのビューポート |
|---|---|---|---|
|
ウィジェット固有の「スワイプしてめくる」ページ移動アニメーションで、コンテンツを連続したページに表示します。APLコンポーネントとレスポンシブ対応コンポーネントまたはテンプレートを使用して、表示するページを定義します。 |
× |
中 | |
|
ウィジェット固有の「ズーム」ページ移動アニメーションで、コンテンツを連続したページに表示します。APLコンポーネントとレスポンシブ対応コンポーネントまたはテンプレートを使用して、表示するページを定義します。 |
× |
中 | |
|
ウィジェットの本文に、タップしたときにちょっとしたアニメーションを表示するタップターゲットを作成します。 |
× |
中 |
ビューポートプロファイルとモーションコンポーネント
ビューポートプロファイルはalexa-viewport-profilesパッケージで提供されます。
モーションコンポーネントは、ウィジェットのビューポートプロファイルをサポートします。ウィジェットのビューポートプロファイルには以下が含まれます。
- ウィジェット、中（@hubWidgetMedium）
ビューポートプロファイルの詳細については、ビューポートプロファイルを参照してください。
デザインガイダンス
レスポンシブ対応モーションコンポーネントの使用方法に関するデザインガイダンスについては、Alexaデザインガイド： ウィジェットのレスポンシブ対応モーションコンポーネントを参照してください。
関連トピック
最終更新日: 2025 年 12 月 17 日