APL Sequence（1.4）



APL Sequence

Sequenceとは、データセットを使用して、複数のコンポーネントをインフレートし、長いスクロールリストに繰り返し表示するものです。Sequenceを使用してAlexaスキルのユーザーエクスペリエンスを高める方法については、Alexaデザインガイド – Sequenceを参照してください。

Sequenceはコンテナに似ていますが、アイテムの長いリストに対しては、Sequenceの方がパフォーマンスが良好です。Sequenceは、より柔軟性の低いレイアウトモデルです。

Sequenceを使うと、画面上で序数および照応に応じた項目が選択できます。項目選択のためのAPLサポートを参照してください。

プロパティ

Sequenceコンポーネントには、次のプロパティがあります。

プロパティ 型／値 デフォルト スタイル設定 動的 説明
numbered ブール値 false ✕ ✕ trueの場合、データバインディングコンテキストの子に序数を割り当てます。
onScroll コマンドの配列 [] ✕ ✕ スクロール中に実行するコマンドです。
scrollDirection horizontal、vertical vertical ✕ ✕ このSequenceのスクロール方向です。

Sequenceの子は、連続した列として配置されます（左から右または上から下）。スクロール方向の子コンポーネントのディメンションはauto設定であり、デフォルトでは子のコンテンツを囲むように設定されます。

表示エラーを最小限に抑えるために、垂直Sequenceの高さと水平Sequenceの幅は、指定されていない場合は100dpに初期化されます。heightやwidthにはautoを使用しないでください。Sequenceサイズには絶対または相対ディメンションを使用します。

高さの値を指定した垂直方向のSequence内でItemテンプレートを使用する場合、高さはパーセント値で設定せず、絶対値のディメンションで設定してください。幅の値を指定した水平方向のSequence内でItemテンプレートを使用する場合、幅はパーセント値で設定せず、絶対値のディメンションで設定してください。

Sequenceがイベントのソースまたはターゲットである場合、以下の値がevent.sourceまたはevent.targetに報告されます。

{
  // Sequence固有の値
  "type": "Sequence",
  "position": Number,  // スクロールしたコンポーネントの位置（パーセント表記）

  // 一般的なコンポーネントの値
  "bind": Map,         // コンポーネントのデータバインディングコンテキストへのアクセス
  "checked": Boolean,  // チェックの状態
  "disabled": Boolean, // 無効化の状態
  "focused": Boolean,  // フィーカス状態
  "height": Number,    // コンポーネントのdp単位の高さ（パディングを含む）
  "id": ID,            // コンポーネントのID
  "opacity": Number,   // コンポーネントの不透明度[0～1]
  "pressed": Boolean,  // 押された状態
  "uid": UID,          // ランタイムで生成されたコンポーネントの固有ID
  "width": Number      // コンポーネントのdp単位の幅（パディングを含む）
}

報告されるposition値は、onScrollプロパティのvalueプロパティと同じ方法で計算されます。

numbered

trueに設定した場合、Sequence内の各項目にデータバインディングの順序数が設定されます。この順序数は「1」から始まり、子のnumberingプロパティが「skip」または「reset」に設定されている場合を除き、1ずつ増加します。firstItemとlastItemに順序数は付けられないことに注意してください。

numberedプロパティでは、画面に数字が自動的に表示されません。データバインディングコンテキストでordinal値を使用して、Textコンポーネントに数値を表示できます。

onScroll

スクロール中に実行するコマンドです。ランタイムでは、スクロール中にフレームを描画するたびにこれらのコマンドの実行が1回試行されますが、正常に実行されない場合もあります。デバイスの処理速度が遅い場合、onScrollコマンドは断続的にしか実行されない可能性があります。

コマンドで出力されるevent.source.positionは、現在のスクロール位置をSequenceの幅または高さで割ったパーセント値になります。たとえば、Sequenceの幅が200ピクセルであり、コンテンツを左方向に520ピクセル分移動した場合、出力される値は2.60になります。

生成されるイベントの形式は次のようになります。

"event": {
  "source": {
    "type": "Sequence",
    "handler": "Scroll",
    ...                     // コンポーネントのソースプロパティ
  }
}

event.sourceの詳細についてはイベントソースを参照してください。

onScrollイベントハンドラーは高速モードで実行されます。

scrollDirection

verticalまたはhorizontalを指定します。デフォルトはverticalです。

多子プロパティ

Sequenceは、多子プロパティです。Sequenceは、すべての多子プロパティを継承します。

アクション可能なプロパティ

Sequenceは、アクション可能なコンポーネントです。Sequenceは、すべてのアクション可能なプロパティを継承します。

Sequenceの子

Sequenceの子は、連続した列として配置されます（左から右または上から下）。スクロール方向の子のディメンションは自動設定であり、デフォルトでは子のコンテンツを囲むように設定されます。

Sequenceの子では、次のプロパティを追加で使用できます。

プロパティ 型／値 デフォルト スタイル設定 動的 説明
numbering normal、skip、reset normal ✕ ✕ 次の子の順序数の付け方を指定します。
spacing 絶対ディメンション 0 ✕ ✕ レイアウト内でこのコンポーネントと前のコンポーネントの間に追加するスペースです。
scaling 負ではない数値 1.0 ◯ ◯ 子のために確保されたスペースに適用する尺度係数。

numbering

親でnumberedが設定されている場合に、順序数の値を制御します。このプロパティは、Sequenceの現在の子ではなく、次の子について順序数の値の指定方法を制御するものです。

  • normal： 次の子の順序数は、現在の順序数に1を足したものになります。
  • skip： 次の子の順序数は、現在の順序数と同じになります。
  • reset： 次の子の順序数は1になります。

spacing

Sequence内でこのコンポーネントと前のコンポーネントの間に追加するスペースの大きさです。Sequenceの最初の項目では無視されます。この値は絶対ディメンションで表現する必要があります。

scaling

コンポーネント用に確保されたスペースに適用する尺度係数。尺度係数は負ではない値にする必要があります。

シーケンスの子のために確保されている実際のスペースは次のとおりです。

space = spacing + scaling * CHILD_DIMENSION

CHILD_DIMENSIONは、水平スクロールシーケンスのコンポーネントの計算された幅と、垂直スクロールシーケンスのコンポーネントの計算された高さです。子は、“spacing”ディメンションの直後の確保されたスペースに配置されます。

Amazon Alexa
Amazon Appstore
Amazon Web Services
Amazon Dash Replenishment