Bixby Developer Center

References

image

optionalmultiple allowedvalue optional

Standalone image within a component. Images are specified by url, and can be given alternate URLs to use with the UI's light-theme or dark-theme when separate images are needed to stand out against light or dark backgrounds.

Interactive Demo

Child Keys

aspect-ratio
optional
Determines the standalone image's aspect ratio
background-color
optional
Determines the background color of an image
float-allowed
optional
Boolean
lightbox-enabled
optional
Boolean that determines if an image goes to lightbox mode when a user taps it
object-fit
optional
Determines how an image fits within a Bixby Views component
object-position
optional
Determines the positioning alignment of an image within a Bixby Views component
url
optional
URL of the image

Examples

image ("#{value(myUrl)}")
result-view {
match {
Hotel (this) {
from-output: ShowHotelImage
}
}

message ("Here is an image:")

render {
layout {
section {
content {
image {
url ("[#{value(this.images[0].url)}]")
aspect-ratio (16:9)
object-fit (Contain)
}
}
}
}
}
}

View master on GitHub

You can run the sample capsule in the Simulator to see how this component displays on different devices, if supported.