HTML5 widgets for vaadin core

HTML5 widgets for vaadin

View larger

Close

View larger

Close

View larger

Close

This project allows you to use the new HTML5 inputs in vaadin: it extends the com.vaadin.ui.TextField and changes the input type. For Number and Range it also supports setting vital attributes. This allows you to use the native inputs on the iPhone, on Android, on Chrome, etc. and to provide an optimal experience to your users. You can find a ready-to-use sample and detailed instructions on https://github.com/akquinet/vaadin-html5-widgets

Feel free to share your insights, thoughts and feedback! - you can do this e.g. by using the Comments function of our Blog (bottom part of the page):

English: http://blog.akquinet.de/2014/09/02/using-html5-inputs-in-vaadin/ German: http://blog-de.akquinet.de/2014/09/02/nutzen-der-html5-inputs-in-vaadin/

Sample code

ColorField colorField = new ColorField();
colorField.setCaption("Color");
layout.addComponent(colorField);

RangeField rangeField = new RangeField();
rangeField.setMin(2);
rangeField.setMax(10);
rangeField.setCaption("Range between 2 and 10");
layout.addComponent(rangeField);

Links

• Author Homepage
• Source Code
• Discussion

Compatibility