Skip to main content

 

UIを設計する

 

OutSystems

Galleryパターン

Galleryパターンは、デバイスタイプや方向ごとに構成できる特定の列にコンテンツ(カードなど)を表示します。

このパターンを使用すると、様々なデバイスで、1行あたりのアイテム数が異なる要素のリストを並べて表示できます。

以下は、Service Studioでのプレビューです。

1. リストまたは静的コンテンツをドラッグします。

2. 入力パラメータでアイテム数を設定します。

1. リストの最初の要素としてAnimateブロックを使用します。

2. コンテンツをbブロック内に配置します。

3. 希望するタイプのアニメーションでAnimateブロックを定義し、リストから現在の行番号で遅延を設定します。

注記: Gallery内でListを使用する場合、仮想化を無効にする 必要があります。

入力パラメータ

入力名 説明 デフォルト値
ColumnsInPhonePortrait スマホが縦向きの場合の列数。 1
ColumnsInPhoneLandscape スマホが横向きの場合の列数。 2
ColumnsInTabletPortrait タブレットが縦向きの場合の列数。 3
ColumnsInTabletLandscape タブレットが横向きの場合の列数。 4
UseGutter 設定すると、最初の列を除くすべての列に余白を追加します。 True

レイアウトおよびクラス

サンプル

以下は、Galleryパターンを使用したサンプルです。

  • Was this article helpful?