Gallery

Gallery UIパターンを使用すると、コンテンツのグループを表示できます。このUIパターンでは、最初と最後の概念を持つ画像をユーザーが順番に参照できます。

Gallery UIパターンの使用方法

通常、Gallery UIパターンは動的な情報を表示します。多くの場合、このパターンを使用する前に、画面に表示する情報を含むデータを取得または更新する必要があります。これを行うには、アクションを使用します。このユースケースでは、ローカルリソースを使用します。

1. Service StudioのツールボックスでGalleryを検索します。

   Galleryウィジェットが表示されます。

   

2. ツールボックスから、Galleryウィジェットをアプリケーション画面のメインコンテンツ領域にドラッグします。

   

3. 必要なコンテンツをGalleryウィジェットに追加します。

   デフォルトでは、Galleryウィジェットはリストを想定しています。

   

   データベースのアイテムを含むGallery UIパターンを使用するには、List RecordをGalleryウィジェットにドラッグしてカスタムコンテンツを作成します。

   この例では、リストを削除し、ImageウィジェットをGalleryウィジェットにドラッグし、OutSystems UIの画像から画像を選択して追加しています。必要に応じて追加することができます。

   

4. ［Properties］タブで、様々なデバイスタイプごとに1行あたりに表示するアイテムの数を設定できます（以下の例を参照）。

   

これらの手順を実行してモジュールをパブリッシュした後、アプリでパターンをテストできます。

以下の例は、1行あたりに表示されるアイテムの数の指定に応じてアイテムがどのように表示されるかを示しています。

1行あたり4アイテム

1行あたり3アイテム

1行あたり2アイテム

1行あたり1アイテム