You can build almost any experience you can imagine using the new Carousels in Doodle 0.9.3. That's because their API is unrestricted and not opinionated about what a Carousel should look like. There are several built-in examples of various Presenters; but so much more is possible.
Here's how you might show a list of Images using the LinearPresenter, which shows all images in a line with the selected item positioned/sized based on the given constraints.
val carousel = Carousel(
SimpleListModel(listOf(image1, image2, image3)),
itemVisualizer { item, previous, _ ->
when (previous) {
is DynamicImage -> previous.also { it.update(item) }
else -> DynamicImage(item)
}
}
).apply {
wrapAtEnds = true
acceptsThemes = false
behavior = object: CarouselBehavior<Image> {
override val presenter = LinearPresenter<Image>(spacing = 10.0) {
val aspectRatio = it.width.readOnly / it.height.readOnly
it.width eq parent.width
it.center eq parent.center
it.height eq it.width / aspectRatio
}
override val transitioner = dampedTransitioner<Image>(timer, animationScheduler) { _,_,_, update ->
animate(0f to 1f, using = tweenFloat(easeInOutCubic, duration = 1 * seconds)) {
update(it)
}
}
}
}
Doodle is a pure Kotlin UI framework for the Web (and Desktop), that lets you create rich applications without relying on Javascript, HTML or CSS. Check out the documentation and tutorials to learn more.
Top comments (0)