Differences
This shows you the differences between two versions of the page.
vaadin_7_faq [2015/03/27 17:04] |
vaadin_7_faq [2021/04/05 11:23] (current) |
||
---|---|---|---|
Line 1: | Line 1: | ||
+ | ====== Vaadin 7 FAQ ====== | ||
+ | ===== How to remove UI component from tab order? ===== | ||
+ | Setting a negative tab index removes the component from the tab order and cannot be reached via tab. | ||
+ | |||
+ | setTabIndex(-1); | ||
+ | |||
+ | ===== How to scroll to the top of the page? ===== | ||
+ | UI.getCurrent().setScrollTop(0); | ||
+ | | ||
+ | ===== How to get the ServletContext? | ||
+ | In Vaadin 7 some things are stored by using ThreadLocal. | ||
+ | |||
+ | ServletContext servletContext = VaadinServlet.getCurrent().getServletContext(); | ||
+ | |||
+ | |||
+ | ===== How to bind nested properties? ===== | ||
+ | Generally the '' | ||
+ | |||
+ | fieldgroup.bind(field, | ||
+ | | ||
+ | Like | ||
+ | |||
+ | fieldgroup.bind(streetField, | ||
+ | |||
+ | |||
+ | ===== How to format numeric field? ===== | ||
+ | From Vaadin 7 on numbers in fields are converted using default converters like '' | ||
+ | |||
+ | <sxh java> | ||
+ | TextField idField.setConverter(new StringToIntegerConverter() { | ||
+ | private static final long serialVersionUID = -1725520453911073564L; | ||
+ | |||
+ | @Override | ||
+ | protected NumberFormat getFormat(Locale locale) { | ||
+ | return new DecimalFormat("#" | ||
+ | } | ||
+ | }); | ||
+ | </ | ||
+ | |||
+ | |||
+ | ===== How to format numeric values in a table? ===== | ||
+ | One way of handling numbers is to create a generated column and format the value by yourself (making a String from the Integer/ | ||
+ | |||
+ | <sxh java> | ||
+ | Table table = new Table() { | ||
+ | private static final long serialVersionUID = 4615263191008145570L; | ||
+ | | ||
+ | private NumberFormat formatter = new DecimalFormat("#" | ||
+ | | ||
+ | @Override | ||
+ | protected String formatPropertyValue(Object rowId, Object colId, Property<?> | ||
+ | if (property == null || property.getValue() == null) { | ||
+ | return super.formatPropertyValue(rowId, | ||
+ | } | ||
+ | else if (property.getType() == Integer.class) { | ||
+ | return formatter.format((Integer) property.getValue()); | ||
+ | } | ||
+ | else { | ||
+ | return super.formatPropertyValue(rowId, | ||
+ | } | ||
+ | } | ||
+ | }; | ||
+ | </ | ||
+ | |||
+ | |||
+ | ===== How to specify an error message when a conversion exception occurs on a text field? ===== | ||
+ | The message from any exception of the validator is ignored. Only the conversion error message set on the text field component will be used. It has a default value which should be adjusted to the application, | ||
+ | |||
+ | ===== CustomField ===== | ||
+ | Much has changed from Vaadin 6 to Vaadin 7. One of those changes is the CustomField class which is now totally integrated into the Vaadin Core Framework. | ||
+ | |||
+ | A custom field is most of the time a composition of UI elements which acts as a field. The type of value for that field is stated as the generic value of the CustomField interface like | ||
+ | |||
+ | public class EmailField extends CustomField< | ||
+ | |||
+ | The method '' | ||
+ | |||
+ | @Override | ||
+ | public Class<? extends String> getType() { | ||
+ | return String.class; | ||
+ | } | ||
+ | |||
+ | Vaadin uses a variable internally to hold the value of the CustomField. But this variable needs to change reflecting the value change of the TextField (in our case). So a ValueChangeListener is needed. | ||
+ | |||
+ | field.addValueChangeListener(new Property.ValueChangeListener() { | ||
+ | |||
+ | @Override | ||
+ | public void valueChange(com.vaadin.data.Property.ValueChangeEvent event) { | ||
+ | setValue(field.getValue()); | ||
+ | } | ||
+ | |||
+ | }); | ||
+ | |||
+ | Now if a value is already bound to the model used with the FieldGroup then a NullPointerException will probably occur because the field is instantiated in the '' | ||
+ | |||
+ | public EmailField() { | ||
+ | field = new TextField(); | ||
+ | } | ||
+ | |||
+ | ===== How to set row height in table? ===== | ||
+ | The row height of a table row can by styled with CSS. Add a custom style name to the table to only affect that table. | ||
+ | |||
+ | table.addStyleName(" | ||
+ | |||
+ | Now add some CSS to your application either via the theme or dynamically via the '' | ||
+ | |||
+ | <sxh css> | ||
+ | .my_styled_table .v-table-table th, .my_styled_table .v-table-table td { | ||
+ | height: 30px; | ||
+ | min-height: 30px; | ||
+ | } | ||
+ | </ | ||
+ | |||
+ | |||
+ | {{tag> |