Skin
FXForm2 control can be customized by using skins. FXForm2 comes with three default skins:
- Default skin
- Inline skin
- FXML skin
You can also implement your own skin.
fxForm.setSkin(FXFormSkinFactory.DEFAULT_FACTORY.createSkin(fxForm))
fxForm.setSkin(FXFormSkinFactory.INLINE_FACTORY.createSkin(fxForm))
The FXML skin allows you to design your form in FXML.
fxForm.setSkin(new FXMLSkin(fxForm, fxml_url))
FXForm then retrieves nodes using their ids and bind them to your bean. You can either use CSS id ou fx:id to bind the nodes in the FXML to the form.
Note : This is the historical way to map nodes between the FXML and the form. However this approach might fail in some cases, see #170.
See Style your form with css to know how the mapping is done between a model field and a node id.
This is the recommended approach. Define the fx:id of the nodes that need to be bound to the form using the following syntax where fieldName is the name of the field as defined in the bean.
| Component | fx:id |
|---|---|
| labels | fx:id=fieldNameFormLabel |
| editors | fx:id=fieldNameFormEditor |
| tooltips | fx:id=fieldNameFormTooltip |
To implement your own skin, extend the class FXFormSkin.
Basically, you have to override three methods:
protected Node createRootNode()
This method returns the Node used for the skin representing the whole form.
protected ElementNodes createElementNodes(Element element)
This method is called for each element in the form. In this method you have to create the nodes for your element (label, editor, tooltip, constraint) and returned them in a ElementNodes object. It's also the right place to add these nodes to your skin.
You can create the element nodes by calling the matching getLabel, getEditor, getTooltip, getConstraint methods and put them at the place you want in your form. These methods will delegate the node construction to the node factories passed to FXForm.
protected void deleteElementNodes(ElementNodes elementNodes)
This method is called each time an element is removed from the form. Make sure you remove all nodes you added in the createElementNodes method from your skin.
Also have a look a the default implementations to see some skin examples: DefaultSkin and InlineSkin