Directory

← Back

Carousel

A circular carousel component for Vaadin 7. Written in Xtend.

Author

Rating

Popularity

100+

Carousel is a type of component container for Vaadin 7 that allows you to slide between its children with a nice scroll animation. The animation is powered by a CSS3 transition but there's also a fallback mechanism for browsers not supporting it.

The Carousel itself is circular or infinite in nature which means the child container will by default loop from the beginning when you reach the end and vice versa. Touch or mouse dragging can be used to give the carousel a push and let the animation handle the rest.

Both the server and the client side counterparts are written in Xtend, a high-level programming language by Eclipse. Xtend compiles to Java source code so Carousel will function seamlessly in any Vaadin application.

Sample code

final HorizontalCarousel carousel = new HorizontalCarousel();

// Only react to arrow keys when focused
carousel.setArrowKeysMode(ArrowKeysMode.FOCUS);
// Fetch children lazily
carousel.setLoadMode(CarouselLoadMode.LAZY);
// Transition animations between the children run 500 milliseconds
carousel.setTransitionDuration(500);

// Add the child Components
carousel.addComponent(new Button("First child"));
carousel.addComponent(new Label("Second child"));
carousel.addComponent(new TextField("Third child"));

// Add the Carousel to a parent layout
layout.addComponent(carousel);

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

  • Scheduled scrollToPanelIndex
  • Wheel sensitivity property removed
  • Handled some browser differences related issues
  • Carouselbuttons' outline hidden by default
  • Non-selected widgets remain visible only while animating/dragging
Released
2016-11-24
Maturity
EXPERIMENTAL
License
Apache License 2.0

Compatibility

Framework
Vaadin 7.0+
Browser
Internet Explorer
Firefox
Opera
Safari
Google Chrome
Internet Explorer
iOS Browser
Android Browser

Carousel - Vaadin Add-on Directory

A circular carousel component for Vaadin 7. Written in Xtend. Carousel - Vaadin Add-on Directory
Carousel is a type of component container for Vaadin 7 that allows you to slide between its children with a nice scroll animation. The animation is powered by a CSS3 transition but there's also a fallback mechanism for browsers not supporting it. The Carousel itself is circular or infinite in nature which means the child container will by default loop from the beginning when you reach the end and vice versa. Touch or mouse dragging can be used to give the carousel a push and let the animation handle the rest. Both the server and the client side counterparts are written in Xtend, a high-level programming language by Eclipse. Xtend compiles to Java source code so Carousel will function seamlessly in any Vaadin application.
Discussion Forum
Xtend language
Online Demo
Source Code

Carousel version 0.5.0
null

Carousel version 0.5.1
Dependencies updated, some bugfixes

Carousel version 0.5.2
An important bugfix included. Some code cleanup and optimization.

Carousel version 0.6.0
- Scheduled scrollToPanelIndex - Wheel sensitivity property removed - Handled some browser differences related issues - Carouselbuttons' outline hidden by default - Non-selected widgets remain visible only while animating/dragging

Online