Metawidget UI Generation done right http://metawidget.org What we - - PowerPoint PPT Presentation

▶
metawidget
SMART_READER_LITE
LIVE PREVIEW

Metawidget UI Generation done right http://metawidget.org What we - - PowerPoint PPT Presentation

Oct 01, 2023 182 likes •533 views

Metawidget UI Generation done right http://metawidget.org What we will cover A common requirement Current practices A better way Common Requirement An everyday problem Most enterprise applications require many different data

slide-1
SLIDE 1

Metawidget

“UI Generation done right”

http://metawidget.org

slide-2
SLIDE 2

What we will cover

  • A common requirement
  • Current practices
  • A better way
slide-3
SLIDE 3

Common Requirement

Most enterprise applications require many different data entry forms, either for collecting

  • r displaying data

An everyday problem

slide-4
SLIDE 4

Current practices

Which one are you using?

  • Visual Form Designers
  • UI Languages
  • Code Generators
slide-5
SLIDE 5

Current practices

Visual Form Designers

  • Matisse
  • JBoss Visual Page Editor
  • etc
slide-6
SLIDE 6

Current practices

UI Languages

<h:form> <h:inputText value=”#{foo.name}”/> <rich:inputSpinner value=”#{foo.age}”/> </h:form>

  • HTML/CSS
  • Java Server Faces
  • etc
slide-7
SLIDE 7

Current practices

Is this you? ✘ Time consuming ✘ Duplicating definitions, error prone: ✘ Too laborious to do properly:

<h:inputText value=”#{foo.name}” maxlength=”30”/> public String getName(); public int getAge(); <h:inputText value=”#{foo.name}”/> <rich:inputSpinner value=”#{foo.age}”/>

slide-8
SLIDE 8

Current practices

Code Generators

  • Naked Objects
  • seam-gen
  • etc
slide-9
SLIDE 9

Current practices

Is this you? ✘ Static code generation

  • doesn't help much beyond early stages of development

✘ Generic UI

  • basic CRUD
  • isn't enough metadata to do as good a job as a human designer

✘ Dictate the architecture

  • if you build your app our way, we'll generate a UI for you
slide-10
SLIDE 10

A better way

Metawidget Designed to address each of these shortcomings

slide-11
SLIDE 11

A better way

✔ Uses your existing architecture

  • your existing annotations, XML files, business rules
  • your existing UI toolkit, third-party libraries, custom components
  • easy to mix technologies, or plug-in your own

✔ Doesn't try and 'own' the entire UI

  • only tries to generate the 'inside' of forms
  • doesn't hide your existing UI toolkit
  • just another widget in your toolbox

✔ No static code generation

  • inspects business objects at runtime
slide-12
SLIDE 12

A better way

✔ Automatically applies constraints

  • existing validation libraries, easy to add your own

✔ No duplicated definitions

  • reads names, types, constraints already defined in your architecture

✔ No time at all

  • once configured, changes to screens are free
slide-13
SLIDE 13

A better way

Doesn't 'own' the UI

slide-14
SLIDE 14

A better way

Doesn't 'own' the UI

slide-15
SLIDE 15

A better way

Doesn't 'own' the UI

slide-16
SLIDE 16

Conclusion

  • Everyday requirement
  • Unsatisfactory current practices
  • A better way
slide-17
SLIDE 17

Thank You!

Questions?

slide-18
SLIDE 18

Appendix A

slide-19
SLIDE 19

WidgetProcessor WidgetProcessor

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget ask to inspect return inspection ask for widget return widget Layout Layout ask to process return processed widget ask to layout laid out

slide-20
SLIDE 20

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget ask to inspect return inspection ask for widget return widget

slide-21
SLIDE 21

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget JavaBean JavaBean ask to inspect return inspection ask for widget return widget

slide-22
SLIDE 22

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget JPA JPA ask to inspect return inspection ask for widget return widget

slide-23
SLIDE 23

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget Composite Inspector Composite Inspector ask to inspect return inspection ask for widget return widget

slide-24
SLIDE 24

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget Composite Inspector Composite Inspector JPA JPA JavaBean JavaBean ask to inspect return inspection ask for widget return widget

slide-25
SLIDE 25

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget Composite Inspector Composite Inspector JPA JPA Bean Validation Bean Validation JavaBean JavaBean ask to inspect return inspection ask for widget return widget

= no duplicate definitions from other layers = supports multiple/mixing back-end architectures

slide-26
SLIDE 26

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget Composite Inspector Composite Inspector JSF JSF JPA JPA Bean Validation Bean Validation JavaBean JavaBean ask to inspect return inspection ask for widget return widget

= automatically applies proper constraints

slide-27
SLIDE 27

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget Composite Inspector Composite Inspector Composite WidgetBuilder Composite WidgetBuilder JPA JPA Bean Validation Bean Validation JavaBean JavaBean ask to inspect return inspection ask for widget return widget

slide-28
SLIDE 28

... ...

A better way

Uses your existing architecture

Inspector Inspector WidgetBuilder WidgetBuilder Metawidget Metawidget ICEfaces ICEfaces RichFaces RichFaces JSF JSF Composite Inspector Composite Inspector Composite WidgetBuilder Composite WidgetBuilder JPA JPA Bean Validation Bean Validation JavaBean JavaBean ask to inspect return inspection ask for widget return widget

= new widgets can be swapped in en masse = supports multiple/mixing widget libraries

slide-29
SLIDE 29

A better way

Uses your existing architecture

WidgetProcessor WidgetProcessor Layout Layout Metawidget Metawidget ask to process return processed widget ask to layout laid out ...

slide-30
SLIDE 30

A better way

Uses your existing architecture

WidgetProcessor WidgetProcessor Layout Layout Metawidget Metawidget Data Binding Data Binding Validators Validators Converters Converters ask to process return processed widget ask to layout laid out ...

slide-31
SLIDE 31

A better way

Uses your existing architecture

WidgetProcessor WidgetProcessor Layout Layout Metawidget Metawidget Table Layout Table Layout Data Binding Data Binding Validators Validators Converters Converters ask to process return processed widget ask to layout laid out ...

slide-32
SLIDE 32

A better way

Uses your existing architecture

WidgetProcessor WidgetProcessor Layout Layout Metawidget Metawidget Table Layout Table Layout Heading Decorator Heading Decorator Data Binding Data Binding Validators Validators Converters Converters ask to process return processed widget ask to layout laid out ...

slide-33
SLIDE 33

A better way

Uses your existing architecture

WidgetProcessor WidgetProcessor Layout Layout Metawidget Metawidget Heading Decorator Heading Decorator RichFaces Tab Decorator RichFaces Tab Decorator Data Binding Data Binding Validators Validators Converters Converters ask to process return processed widget ask to layout laid out

= automatic consistency across forms

Table Layout Table Layout ...

slide-34
SLIDE 34

Appendix B

slide-35
SLIDE 35

A better way

Acid Test: Retrofitting an existing app