Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Paris Vaadin & GWT Meetup
Bio @nicolas_frankel Software Architect http://blog.frankel.ch & http://morevaadin.com Learning Vaadin Main interests:...
Vaadin 7 revolutions SASS Connectors Client-side extensions …
Vaadin 7 evolutions Window API Javascript API FieldGroup Converter …
FieldGroup Remember the old Form?   It coupled display & field handling   It is deprecated Use FieldGroup   And set t...
Data binding levels1. Property   Single value     Birthdate2. Item   Connected properties     First name, last name, b...
ExamplePerson person = new Person(1L);person.setFirstName("John");person.setLastName("Doe");person.setBirthdate(new Date(0...
Naive implementationTextField id = new TextField (item.getItemProperty("id"));TextField firstName = new TextField(item.get...
Result
FieldGroup implementationFieldGroup group = new FieldGroup(item);Field<?> id = group.buildAndBind("id");Field<?> firstName...
Result
Custom FieldGroupFieldFactory@Overridepublic <T extends Field> T createField(Class<?> dataType, Class<T>fieldType) {      ...
Reworkgroup.setFieldFactory(new CustomFieldGroupFieldFactory());Layout layout = new FormLayout(id, firstName, lastName, bi...
Result
Final reworkField<?> id = group.buildAndBind(null, "id");Field<?> firstName = group.buildAndBind("Given name", "firstName"...
Result
Converters Separate model values from their String representations Provides ways to convert   From String to model   A...
Converter hierarchy
Requirements No side-effects, including GUI changes Method implementation need to be symmetric
ImplementationTextField tf = new TextField();tf.setConverter(new StringToIntegerConverter());int i = (Integer) tf.getConve...
@learnvaadin
Thanks… & questions?
Vaadin 7 FieldGroup & Converter
Upcoming SlideShare
Loading in …5
×

Vaadin 7 FieldGroup & Converter

8,002 views

Published on

Vaadin 7 FieldGroup & Converter presentation for the Vaadin & GWT Developer Meetup Paris 2013

  • Be the first to comment

Vaadin 7 FieldGroup & Converter

  1. 1. Paris Vaadin & GWT Meetup
  2. 2. Bio @nicolas_frankel Software Architect http://blog.frankel.ch & http://morevaadin.com Learning Vaadin Main interests:  GUI  Software quality  Build automation  New things!
  3. 3. Vaadin 7 revolutions SASS Connectors Client-side extensions …
  4. 4. Vaadin 7 evolutions Window API Javascript API FieldGroup Converter …
  5. 5. FieldGroup Remember the old Form?  It coupled display & field handling  It is deprecated Use FieldGroup  And set the layout you want!
  6. 6. Data binding levels1. Property  Single value  Birthdate2. Item  Connected properties  First name, last name, birthdate3. Container  Collection of items
  7. 7. ExamplePerson person = new Person(1L);person.setFirstName("John");person.setLastName("Doe");person.setBirthdate(new Date(0));BeanItem<Person> item = new BeanItem<Person>(person);
  8. 8. Naive implementationTextField id = new TextField (item.getItemProperty("id"));TextField firstName = new TextField(item.getItemProperty("firstName"));TextField lastName = new TextField(item.getItemProperty("lastName"));DateField birthdate = new DateField(item.getItemProperty("birthdate"));Layout layout = new FormLayout(id, firstName, lastName, birthdate);
  9. 9. Result
  10. 10. FieldGroup implementationFieldGroup group = new FieldGroup(item);Field<?> id = group.buildAndBind("id");Field<?> firstName = group.buildAndBind("firstName");Field<?> lastName = group.buildAndBind("lastName");Field<?> birthdate = group.buildAndBind("birthdate");Layout layout = new VerticalLayout(id, firstName, lastName, birthdate);
  11. 11. Result
  12. 12. Custom FieldGroupFieldFactory@Overridepublic <T extends Field> T createField(Class<?> dataType, Class<T>fieldType) { if (dataType.isAssignableFrom(Date.class)) { return (T) new DateField(); } return delegate.createField(dataType, fieldType);}
  13. 13. Reworkgroup.setFieldFactory(new CustomFieldGroupFieldFactory());Layout layout = new FormLayout(id, firstName, lastName, birthdate);
  14. 14. Result
  15. 15. Final reworkField<?> id = group.buildAndBind(null, "id");Field<?> firstName = group.buildAndBind("Given name", "firstName");Field<?> lastName = group.buildAndBind("Family name", "lastName");
  16. 16. Result
  17. 17. Converters Separate model values from their String representations Provides ways to convert  From String to model  And back
  18. 18. Converter hierarchy
  19. 19. Requirements No side-effects, including GUI changes Method implementation need to be symmetric
  20. 20. ImplementationTextField tf = new TextField();tf.setConverter(new StringToIntegerConverter());int i = (Integer) tf.getConvertedValue();
  21. 21. @learnvaadin
  22. 22. Thanks… & questions?

×