メインコンテンツまでスキップ

GridView (그리드뷰) Widget Control

GridViewウィジェットをスクリプトから制御するときに使用するWidget Control（Property · Method · Event）の一覧です。ウィジェットの紹介と使い方はGridViewを参照してください。

備考

以下の例のgridviewIDは、キャンバスでGridViewウィジェットに指定した名前（ID）です。スクリプトではウィジェットID.メンバーの形式でアクセスします。

Widget Control一覧​

Widget Control種類シグネチャ説明
countPropertycount（読み取り/書き込み、整数）繰り返し項目の数を読み取り、または設定
currentPropertycurrent（読み取り/書き込み、整数）バインディングスコープとして使われる現在の項目インデックス
selectPropertyselect（読み取り/書き込み、整数）選択された項目のインデックス
addMethodadd() → 整数新しい項目を末尾に追加し、そのインデックスを返す
insertMethodinsert(index)指定したインデックスに新しい項目を挿入
removeMethodremove(index)指定したインデックスの項目を削除
clearMethodclear()すべての項目を削除
setStateMethodsetState(index, callback)特定の項目スコープでコールバックを実行し、その項目のみを更新
scrollToIndexMethodscrollToIndex(index, duration)指定した項目が表示されるようにスクロール（即時またはアニメーション）
getFirstVisibleIndexMethodgetFirstVisibleIndex() → 整数最初に表示されている項目のインデックスを返す
onSelectedEventonSelected = (index) => { ... }ユーザーが項目をタップしたときに実行

Property​

count​

繰り返し項目の数を読み取り、または設定します。値を設定すると、バインディングされたデータリストがその数だけ増減し、グリッドを再描画します。

  • 種類: Property（読み取り/書き込み）
  • 型 / Returns: number（整数）

Example

gridviewID.count = 10;
const n = gridviewID.count;

current​

現在バインディングスコープとして使われる項目インデックスを読み取り、または設定します。設定すると、以降のプロパティ書き込みはその項目の行を対象にします。設定された値がない場合、読み取り時に-1を返します。

  • 種類: Property（読み取り/書き込み）
  • 型 / Returns: number（整数）

Example

gridviewID.current = 2;
const i = gridviewID.current;

select​

選択された項目のインデックスを読み取り、または設定します。選択された項目がない場合、読み取り時に-1を返します。

  • 種類: Property（読み取り/書き込み）
  • 型 / Returns: number（整数）

Example

gridviewID.select = 0;
const sel = gridviewID.select;

Method​

add​

新しい空の項目を末尾に追加し、グリッドを再描画します。

  • Parameters: なし
  • Returns: number（整数） - 新しく追加された項目のインデックス

Example

const i = gridviewID.add();

insert​

指定したインデックスに新しい空の項目を挿入し、グリッドを再描画します。

  • Parameters: index（number、整数） - 新しい項目を挿入する位置
  • Returns: なし

Example

gridviewID.insert(0);

remove​

指定したインデックスの項目を削除し、グリッドを再描画します。インデックスが範囲外の場合は何も行いません。

  • Parameters: index（number、整数） - 削除する項目のインデックス
  • Returns: なし

Example

gridviewID.remove(0);

clear​

すべての項目を削除し、グリッドを再描画します。

  • Parameters: なし
  • Returns: なし

Example

gridviewID.clear();

setState​

バインディングスコープを指定した項目に合わせた状態でコールバックを実行し、その項目のみを再描画します。1つの項目のバインディングされたプロパティのみを更新するときに使用します。

  • Parameters: index（number、整数） - 更新する項目のインデックス · callback（function） - その項目スコープで実行するコールバック
  • Returns: なし

Example

gridviewID.setState(0, () => {
  // インデックス0の項目のバインディングされたプロパティを更新
});

scrollToIndex​

指定した項目が画面に表示されるようにスクロールします。インデックスはcrossAxisCountを基準に行・列の位置へ変換されます。durationがない場合や0以下の場合は即時に移動し、それ以外はそのミリ秒数だけアニメーションします。グリッドがまだレイアウトされていない場合は何も行いません。

  • Parameters: index（number、整数） - スクロールする項目のインデックス · duration（number | null、整数） - アニメーション時間（ミリ秒）。nullまたは0の場合は即時に移動
  • Returns: なし

Example

gridviewID.scrollToIndex(20, 300);

getFirstVisibleIndex​

最初に表示されている行・列の項目インデックスを返します。グリッドがまだレイアウトされていない場合は0を返します。

  • Parameters: なし
  • Returns: number（整数） - 最初に表示されている項目のインデックス

Example

const index = gridviewID.getFirstVisibleIndex();

Event​

onSelected​

ユーザーがグリッドの項目をタップしたときに実行されます。タップした項目のインデックスがコールバックの引数として渡されます。

  • 種類: Event
  • ハンドラー: index（整数）引数を受け取るコールバック関数
  • Returns: なし

Example

gridviewID.onSelected = (index) => {
  // indexの項目が選択された
};

共通Widget Control（すべてのウィジェット）​

注記

すべてのウィジェットはsetProperty / getProperty / setStylePropertyのような名前ベースの共通Widget Control（Method）を使用できます。共通リファレンスドキュメント（作成予定）を参照してください。