Image Gallery

Use the "Gallery" size to display grouped collections of images. This setting generally results in a consistent height for displayed images (even if their aspect ratios differ) so that the group lines up evenly. Very wide images will be shown with a shorter height in order to constrain their overall size.

Specify the thumbnail behavior to allow users to view the images in a slideshow.

Example Expression

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

a!imageField(
  label: "Gallery",
  images: a!forEach(
    items: {
      "https://source.unsplash.com/random/800x600",
      "https://source.unsplash.com/random/900x600",
      "https://source.unsplash.com/random/1024x768",
      "https://source.unsplash.com/random/1000x800",
      "https://source.unsplash.com/random/920x650",
      "https://source.unsplash.com/random/810x580",
      "https://source.unsplash.com/random/820x590",
      "https://source.unsplash.com/random/830x600",
      "https://source.unsplash.com/random/840x610",
      "https://source.unsplash.com/random/850x620",
      "https://source.unsplash.com/random/860x630",
      "https://source.unsplash.com/random/870x640",
      "https://source.unsplash.com/random/900x500",
      "https://source.unsplash.com/random/910x510",
      "https://source.unsplash.com/random/920x520",
      "https://source.unsplash.com/random/930x530",
      "https://source.unsplash.com/random/940x600",
      "https://source.unsplash.com/random/940x610",
      "https://source.unsplash.com/random/940x620",
      "https://source.unsplash.com/random/940x630"
    },
    expression: a!webImage(
      source: fv!item
    )
  ),
  size: "GALLERY",
  isThumbnail: true
)
Open in Github

On This Page

FEEDBACK