Alexa Headerレイアウト



Alexa Headerレイアウト

Alexa Headerレイアウトは、タイトル、サブタイトル、アトリビューション、戻るボタンを一貫して表示するために使用します。Alexa Headerレイアウトは、さまざまなデバイスの表示画面でサポートされています。

Alexa Headerレイアウトをドキュメントに読み込む

Alexa Headerレイアウトを使用するにはドキュメントのパッケージimport配列に「alexa-layouts」パッケージを追加します。バージョンは常にimportで指定する必要があります。現在は1.0.0です。APLドキュメントのプロパティを参照してください。

"import":[
    {
        "name": "alexa-layouts",
        "version" : "1.0.0"
    }
]

Alexa Headerパラメーター

パラメーターはすべてオプションです。

名前 デフォルト 説明
headerTitle 文字列 なし Headerで表示する第1テキストです。
headerSubtitle 文字列 なし Headerで表示する第2テキストです。
headerAttributionText 文字列 なし Headerで表示するアトリビューションのテキストです。headerAttributionTextの値は、headerAttributionImageが指定されておらず、かつ、headerAttributionPrimacytrueの場合、または、デバイスがタイトル/サブタイトルとアトリビューションの両方を表示する場合のみ表示されます。
headerAttributionImage 文字列 なし アトリビューションの画像ソースのURLです。headerAttributionPrimacyがtrueの場合、またはタイトル/サブタイトルとアトリビューションの両方を表示するデバイスにのみ表示されます。
headerAttributionPrimacy ブール値 true 画面サイズにより1つの要素しか表示できないデバイスでは、アトリビューションが優先されます。falseに設定すると、タイトルとサブタイトルが表示されます。デフォルトはtrueです。
headerBackButton ブール値 false 切り替えてHeaderに戻るボタンを表示します。デフォルトはfalseです。
headerNavigationAction 文字列 なし ボタンが押されたとき、またはクリックされたときにSendEventコマンドで渡す引数です。
headerBackgroundColor 文字列 transparent Headerの背景色として使用するオプションの色の値です。デフォルトはtransparentです。

Alexa Headerのサンプル

"mainTemplate": {
      "item": {
            "type": "AlexaHeader",
            "headerTitle": "Header Title",
            "headerSubtitle": "Header Subtitle",
            "headerAttributionImage": "http://Header Attribution Image",
            "headerBackgroundColor": "red",
            "headerBackButton": true,
            "headerNavigationAction": "戻る"
      }
}