This document discusses EMF Forms, a framework for developing form-based UIs based on a given data model. EMF Forms separates the UI representation from the domain model by using an intermediate view model. The view model defines how the domain model should be rendered and can be extended. EMF Forms then renders the UI by interpreting the view model using an adaptable renderer, allowing the same UI to be rendered using different technologies like Swing, SWT, JavaFX or web. It provides tools to help develop the view model in an IDE editor.

1. External Use
TM
Dynamic UI rendering with ECP
1.3
Eclipse DemoCamp Bucharest
J U L . 0 2 . 2 0 1 4
Dorin Ciuca

2. TM
External Use 1
ECP - EMF Client Platform
• “The goal is to provide reusable, adaptable and
extensible UI components to develop applications
based on a given EMF model.”
• “All components can be used stand-alone and be
embedded into your own application. ”
http://eclipse.org/ecp/index.html

3. TM
External Use 2
ECP - Components
• Explorer
• Editor • Repository
Explorer

4. TM
External Use 3
EMF Forms
• is a framework to efficiently develop form-based UIs based
on a given data model
• the UI is described in a simple view model
• view model is then interpreted by an adaptable and
exchangeable rendering component
• allows you to render the same UI using different UI
technologies: Swing, SWT, JavaFX or Web just by
replacing the renderer

5. TM
External Use 4
EMF Forms
Domain model View model
UI rendered
Renderer

6. TM
External Use 5
View model
• It is an ecore model

7. TM
External Use 6
View model
• It defines layout
• It adds layout elements that are not mapped to domain model
elements e.g. groups
• It augments domain model elements with hints about rendering
• It adds rules for renderer based on expressions involving other
domain elements e.g. enable/disable/show/hide some items
when condition

8. TM
External Use 7
View model
• It is registered with extension point

9. TM
External Use 8
View model
• It is extendable
You can create other
model containing new
elements and register
through extension point
the corresponding
render .

10. TM
External Use 9
View model
• Tools support: it has an editor in IDE

11. TM
External Use 10
EMF Forms
how to embed generated UI in your application
• probeComposite – is the parent composite in client’s UI code
• probe – is the domain model (data model) element to render

12. TM
External Use 11
EMF Forms – rendering details
creates
Renders based on a view
model element.
Renders based on a domain
model element.

13. TM
© 2014 Freescale Semiconductor, Inc. | External Use
www.Freescale.com

14. TM
External Use 13
EMF Forms – renders hierarchy

15. TM
External Use 14
EMF Forms – renders hierarchy