Bixby Developer Center

Guides
References

image-list-of

optionalvalue required

Creates a gallery view of images of type or subtype of BaseImage that were returned from the results. If a user selects an image, the image opens in Lightbox mode.

Image Parameters

For each image that is used in this component, if any of the following fields are filled in, they are passed and rendered over the image, though none are required:

ParameterTypeDescription
titleTextPrimary text displayed
subTitleTextSecondary text displayed
captionTextBody text displayed

For more information on images, see the viv.core library capsule documentation.

Example

result-view {
match: Hotel (hotel) {
from-output: ShowHotelImageListOf
}

message {
template ("Here is a hotel using image-list-of:")
}

render {
if (size(hotel) == 1) {
image-list-of (hotel.images) {
size (Medium)
title ("Hotel")
}
}
}
}

View on GitHub

Here is how an image-list-of appears on different devices:

MobileWatchTVFridge
image-list-of on Mobileimage-list-of on Watchimage-list-of on TVimage-list-of on Fridge
Note

The look and feel of this Views component might differ between devices, specifically with respect to spacing. Mobile, tablet, and fridge devices are similar in design, for example, but have varying resolution and spacing specifications.

Usage

The following action model returns a number of images:

// FindImages.model.bxb
action (FindImages) {
type (Search)
output (Image)
}

You would return the results using the following results-view file:

// FindImages.view.bxb
result-view {
match: Image (this)

message { template ("Here are some cool images...") }

render {
image-list-of (this) {
size (Small)
title { template ("test images...") }
}
}
}

Child Keys

size
optional
Determines how many columns of images are displayed on screen
title
optional
Title of image