APL Sequence(1.4)
Sequenceとは、データセットを使用して、複数のコンポーネントをインフレートし、長いスクロールリストに繰り返し表示するものです。Sequenceを使用してAlexaスキルのユーザーエクスペリエンスを高める方法については、Alexaデザインガイド – Sequenceを参照してください。
Sequence
はコンテナに似ていますが、アイテムの長いリストに対しては、Sequence
の方がパフォーマンスが良好です。Sequence
は、より柔軟性の低いレイアウトモデルです。
Sequenceを使うと、画面上で序数および照応に応じた項目が選択できます。項目選択のためのAPLサポートを参照してください。
プロパティ
Sequenceコンポーネントには、次のプロパティがあります。
- すべてのアクション可能なコンポーネントのプロパティ
- すべての多子コンポーネントのプロパティ
- すべての基本コンポーネントのプロパティ
- 次の表に示す
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”ディメンションの直後の確保されたスペースに配置されます。