Header
Headerレスポンシブ対応コンポーネント（AlexaHeader）は、タイトル、サブタイトル、戻るボタンなどの一般的なヘッダー情報を表示します。
alexa-layoutsパッケージを読み込む
AlexaHeaderを使用するには、alexa-layoutsパッケージを読み込みます。
alexa-layoutsパッケージの最新バージョンは1.1.0です。AlexaHeaderはバージョン1.0.0で導入されました。
このページの上部にあるその他のバージョンオプションをクリックすると、別のバージョンのAlexaHeaderドキュメントが表示されます。各パラメーターが追加されたalexa-layoutsのバージョンを、パラメーターの表に示します。
AlexaHeaderパラメーター
type以外のパラメーターはすべてオプションです。
| 名前 | 型 | デフォルト | 説明 | 追加されたバージョン |
|---|---|---|---|---|
|
|
文字列 |
なし |
アトリビューションの画像ソースのURLです。 |
1.0.0 |
|
|
ブール値 |
true |
画面サイズにより1つの要素しか表示できないデバイスでは、アトリビューションが優先されます。 |
1.0.0 |
|
|
文字列 |
なし |
Headerで表示するアトリビューションのテキストです。 |
1.0.0 |
|
|
文字列 |
なし |
スクリーンリーダーを使用するユーザーに、戻るボタンについて説明するアクセシビリティラベルです。 |
1.1.0 |
|
|
|
ユーザーが戻るボタンを選択したときに実行するコマンドです。デフォルトは、「GoBack」引数の付いた |
1.1.0 |
|
|
|
ブール値 |
|
戻るボタンの表示を切り替えます。デフォルトは |
1.0.0 |
|
|
文字列 |
|
Headerの背景色として使用するオプションの色の値です。デフォルトは |
1.0.0 |
|
|
ブール値 |
|
切り替えてヘッダーの下部に区切り線を表示し、下のコンテンツと区別します。デフォルトはfalseです。 |
1.1.0 |
|
|
文字列 |
なし |
Headerで表示する第2テキストです。 |
1.0.0 |
|
|
文字列 |
なし |
Headerで表示する第1テキストです。 |
1.0.0 |
|
|
文字列 |
|
指定したテーマ（lightまたはdark）に応じて色が切り替わります。デフォルトのテーマはdarkです。 |
1.1.0 |
|
|
文字列 |
なし |
常に |
1.0.0 |
headerAttributionTextパラメーターとheaderAttributionImageパラメーターの両方が指定されている場合、headerAttributionImageが使用されます。AlexaHeaderの例
{
"type": "AlexaHeader",
"headerBackButton": true,
"headerBackButtonAccessibilityLabel": "back",
"headerBackgroundColor": "red",
"headerTitle": "Header title",
"headerSubtitle": "Header subtitle",
"headerAttributionText": "Attribution",
"headerAttributionImage": "https://d2o906d8ln7ui1.cloudfront.net/images/cheeseskillicon.png",
"headerAttributionPrimacy": true,
"headerDivider": true
}
