New Vaadin Sampler released!

We’re very pleased to announce the release of a new major overhaul of the Vaadin Sampler. The major improvements include: 1) Valo theme tweaking for each component 2) An improved navigation tree and 3) Sampler now supports mobile and tablet navigation.

A lot of sweat and love has gone into Sampler but we’d love to hear your thoughts at this point. What do you think?

Check it out at


A great work!!!

It really is a great work!

For some reason I was not able to breake the @Future annotation on the date field in the Declarative Validation demo. The other two fields worked as expected though.

The collapsibe menu toolbox is awesome. How did you do it? Where can I find the source?

its an awesome, dynamic

Thank you for all your hard work in updating & improving the sampler. One of Vaadin’s greatest strengths is the quality of documentation and maintenance of examples / interactive learning materials … this is important work and greatly appreciated.

Thanks you Team vaadin, great job

There’s a little bug with the new sampler on the Progress bar’s slide, click on the right arrow to move forward shows a demo context menu.

Another one: on the javascript widget slide the navigation stops working.

Awesome work. Congrats!

Very nice! Is there source code published?

Thank you very much for your findings! We’re working on the next release of Sampler and will have it up later this week with your feedback implemented as well.

Sorry, the code for sampler is not public at the moment – will look into it however.

Very nice sampler. Gerat Job.
We love the collapsibe menu toolbox and would appriciate, to see the code some day :wink:

Well, I guess I’ll be the grumpy one: it’s a very beautiful piece of coding and you should be quite proud of it. However, once we acknowledge the skill required to create that sampler, we’re still left with our initial questions: what is Vaadin, what does it look like, what can it look like, what does the code look like to do what I’m looking at? And I’m sorry to say that all these questions were answered better by the Vaadin 6 sampler. Yes, it looks prosaic, even frumpy, but it’s easier to navigate to the information you want, the code samples are large enough that you can get them working on your own machine, and there are more examples per widget. Oh, and you can see the various widgets displayed in different themes. Does the new sampler even mention themes? I have to say that when I need to learn about a widget I haven’t used before I still go to the Vaadin 6 sampler first, then the new sampler to see if anything has changed, then The Book to get the details.

Regarding themes, I guess you didn’t noticed gear icon in upper right when you select sample widget. There is source also, and property editor makes demo more interactive. On the other hand you are right for this “greater picture” part, but perhaps that wasn’t idea anyway. Take look at the
Valo themes demo
, in my opinion it completes this one and it has source.

Yes, I missed that, though I also searched for “theme” and didn’t see anything related. I did see the source, but often the example code is a 4 or 5 line code fragment, not really the best for showing how to use the widget. Thanks for the link to the Valo themes demo. I wonder why it isn’t listed on along with the Runo and Chameleon demos ? Are those last two the v6 demos, or have they been updated for v7+ ?


The main demo page was updated recently, and now has the Valo demo. The older theme demos (which were still running some ancient Vaadin version) were dropped since Valo is the thing we want to promote from now on and encoureage everyone to start using eventually.

About the source code examples in Sampler, I took a note of that and perhaps you could in the future click the truncation marks (…) to expand and see the whole source.

Yes, it’s very pretty. I did try clicking on the ellipsis in the code for CustomLayout and Javascript API Integration, no joy. It’s just an ellipsis . Also, while an ellipsis might fit in with the minimalist Valo look, does it really give the user enough of a hint that it’s a link ?

It was just an enhancement idea that maybe it might be an option that you could expand the truncated sections of the source. It’s not implemented yet, just to clarify.

And yes, if we end up doing that, in that case it should be indicated somehow better that you can expand those lines (an explicit help text might work).

Thanks for the feedback!

Sure. Thanks for a great product!