Footer
Alexa Footerレスポンシブ対応コンポーネント（AlexaFooter）は、画面の下部にヒントを表示します。ヒントは、ほかの発話をユーザーに提案することを目的にしています。textToHintトランスフォーマーを使用すると、デバイスに設定されているウェイクワードを自動的に表示できます。
互換性
AlexaFooterは、alexa-viewport-profilesパッケージのすべての標準Viewportプロファイルで動作するように設計されています。次のプロファイルに対応しています。
- すべての円形デバイスプロファイル
- すべての横長デバイスプロファイル
- すべての縦長デバイスプロファイル
- すべてのモバイルプロファイル
- すべてのテレビプロファイル
サポートされていないViewportでAlexaFooterを使用すると、予期しない結果になることがあります。Viewportプロファイルの詳細については、Viewportプロファイルを参照してください。
alexa-layoutsパッケージを読み込む
AlexaFooterを使用するには、alexa-layoutsパッケージをインポートします。
alexa-layoutsパッケージの最新バージョンは1.7.0です。AlexaFooterはバージョン1.0.0で導入されました。
このページの上部にあるその他のバージョンオプションをクリックすると、別のバージョンのAlexaFooterドキュメントが表示されます。パラメーターの表には、それぞれのパラメーターが追加されたalexa-layoutsのバージョンが示されています。
AlexaFooterのパラメーター
type以外のパラメーターはすべてオプションです。
| 名前 | 型 | デフォルト | 説明 | ウィジェットのサポート | 追加されたバージョン |
|---|---|---|---|---|---|
|
|
文字列 |
フッターを説明する文字列です。ユーザーがこのコンポーネントを選択すると、ボイスオーバーでこの文字列が読み上げられます。 |
サポートされません |
1.7.0 | |
|
|
配列 |
— |
このコンポーネントにバインドするentityデータの配列です。 |
サポートされません |
1.2.0 |
|
|
文字列 |
— |
フッターに表示するヒントテキストです。正しいウェイクワードをヒントに追加するには、 |
サポートされません |
1.0.0 |
|
|
文字列 |
|
フッターに表示されるテキストの言語です。この言語によって、テキストに使用されるデフォルトのフォントが決まります。たとえば、 |
サポートされません |
1.4.0 |
|
|
文字列 |
|
コンテンツのレイアウト方向を指定します。このプロパティは、 |
サポートされません |
1.4.0 |
|
|
文字列 |
|
色のテーマをダークまたはライトに設定します。テーマを選択することでコンポーネントの色を制御します。 |
サポートされません |
1.1.0 |
|
|
文字列 |
— |
常に |
サポートされません |
1.0.0 |
AlexaFooterの例
{
"mainTemplate": {
"item": {
"type": "AlexaFooter",
"hintText": "Hint Text"
}
}
}
textToHintトランスフォーマーを使用する
ヒント文字列に自動的に正しいウェイクワードを追加するには、textToHintトランスフォーマーを使用します。これにより、「アレクサ」や「エコー」などのあらかじめ設定されたウェイクワードがデバイスに表示されます。デバイスに応じたウェイクワードを選択できるので、ヒントに「アレクサ」という語をハードコーディングしないでください。
このデータソースは、トランスフォーマーを構成します。
次のドキュメントにはAlexaFooterが含まれており、トランスフォーマーの出力を使用してhintTextを表示します。
textToHintの使用方法の詳細については、コンテンツを背景、境界線、ヘッダーと結合するのヒントにデバイスのウェイクワードを使用するを参照してください。
トランスフォーマーについて詳しくは、トランスフォーマーを参照してください。
関連トピック
- APL向けAlexa Design System
- レスポンシブ対応コンポーネントとテンプレート
- コンテンツを背景、境界線、ヘッダーと結合する
- トランスフォーマー
- Alexaデザインガイド： レスポンシブ対応コンポーネント
最終更新日: 2025 年 10 月 09 日