ページネーション

ページネーションはページ送りを表示し、現在ページの変更を行うためのコンポーネントです。基本リストやカスタムリストなどリスト系のコンポーネントと組み合わせて利用できます。
リスト系コンポーネントと組み合わせた場合、ページネーションのアクションを使用することで疑似的にページネーションが実装できます。
v3.4.0で追加されました。

プロパティ

No	項目	入力値	デフォルト値	アクションプロパティ	タイプ	アクションデフォルト値	説明
1	ID	文字列	自動設定	id	string	自動設定	[id]プロパティはアクションで設定はできません。
2	幅	数値	350	width	number	350	コンポーネントの幅
3	高さ	数値	40	height	number	40	コンポーネントの高さ
4	X	数値		x	number		X座標位置
5	Y	数値		y	number		Y座標位置
7	スタイル	選択 1.テキスト 2.アウトライン	テキスト	variant	string	text	ページネーションのスタイル
8	形状	選択 1.円形 2.角丸	円形	shape	string	circular	ページネーションの形状
9	色	文字列 カラーピッカー		color	string		コンポーネントの色
10	サイズ	選択 1.中 2.大 3.なし	中	size	string	medium	ページネーションを構成する各ボタンのサイズ。 [なし]の場合に[フォントサイズ]は任意設定が可能です。
11	フォントサイズ	数値	14	fontSize	number	14	ページネーションを構成する各ボタンのフォントサイズ [サイズ]が「なし」の場合に有効となります。
12	総ページ数	数値	10	count	number	10	ページ総数（1以上）
13	最初と最後に常に表示するページ数	数値	1	boundaryCount	number	1	先頭・末尾に常に表示するページ数
14	現在ページの前後に常に表示するページ数	数値	1	siblingCount	number	1	現在ページの前後に表示する隣接ページ数
15	最初のページへ移動ボタンを表示	真偽	OFF	showFirstButton	boolean	false	最初のページへ移動ボタンを表示する
16	最後のページへ移動ボタンを表示	真偽	OFF	showLastButton	boolean	false	最後のページへ移動ボタンを表示する
17	次のページへ移動ボタンを非表示	真偽	OFF	hideNextButton	boolean	false	次のページへ移動ボタンを非表示にする
18	前のページへ移動ボタンを非表示	真偽	OFF	hidePrevButton	boolean	false	前のページへ移動ボタンを非表示にする
19	非アクティブ	真偽	OFF	disabled	boolean	false	コンポーネントの無効/有効状態
20	表示	真偽	ON	visibility	boolean	true	コンポーネントの表示/非表示
21	現在ページ	数値	1	page	number	1	現在のページ番号（1始まり）
22	チェンジイベント	選択 1.なし 2.アクション	なし				ページ変更時のイベント設定

ノート

• [page]は1始まりです。[count]には1以上を指定してください。
• チェンジイベントを「アクション」に設定すると、ページ変更時にアクションを実行できます。アクション内では$ui.<コンポーネントID>.pageで現在ページ、$ui.<コンポーネントID>.countで総ページ数を参照できます。
• リスト系コンポーネントを使用している場合、ページネーションのアクションでSQL関数のoffsetとlimitを設定しデータを取得することで疑似的にページネーションが実装できます。

イベント

イベント名	説明
onchange	ページ番号が変更された時に発生します。