Directory

← Back

Carousel Addon

Addon that renders a carousel component

Author

Contributors

Rating

This is a carousel addon, based on the @xpertsea/paper-slider webcomponent

Sample code

	Slide s1 = new Slide(createSlideContent("Slide 1","green"));
	Slide s2 = new Slide(createSlideContent("Slide 2","blue"));
	Slide s3 = new Slide(createSlideContent("Slide 3","red"));
	Slide s4 = new Slide(createSlideContent("Slide 4","yellow"));

	Carousel c = new Carousel(s1,s2,s3,s4);
	c.setWidth("100%");
	c.setHeight("180px");
	c.addChangeListener(e->Notification.show("changed!",1000,Position.BOTTOM_END));
	c = new Carousel(s1,s2,s3,s4)
			.withAutoProgress()
			.withSlideDuration(4)
			.withStartPosition(1);
	c.addChangeListener(e->Notification.show("changed!",1000,Position.BOTTOM_END));
	Button next = new Button(">>");
	next.addClickListener(e->cf.moveNext());
	Button prev = new Button("<<");
	prev.addClickListener(e->cf.movePrev());
	Button last = new Button(">|");
	last.addClickListener(e->cf.movePos(3));
	Button first = new Button("|<");
	first.addClickListener(e->cf.movePos(0));

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

Bugfixes

  • Fix position not set in SlideChangeEvent constructor (#15)
  • Fix fromClient not used in SlideChangeEvent constructor (#17)
Released
2021-08-02
Maturity
EXPERIMENTAL
License
Apache License 2.0

Compatibility

Framework
Vaadin 14+
Vaadin 13 in 1.0.0
Vaadin 12 in 1.0.0
Vaadin 11 in 1.0.0
Vaadin 10 in 1.0.0
Browser
Firefox
Safari
Google Chrome
iOS Browser
Android Browser
Internet Explorer
Microsoft Edge

Carousel Addon - Vaadin Add-on Directory

Addon that renders a carousel component Carousel Addon - Vaadin Add-on Directory
This is a carousel addon, based on the [@xpertsea/paper-slider webcomponent](https://www.npmjs.com/package/@xpertsea/paper-slider)
Online