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

7,444 views

Published on

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

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
7,444
On SlideShare
0
From Embeds
0
Number of Embeds
225
Actions
Shares
0
Downloads
38
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

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?

×