Difference between revisions of "Eclipse/Incubator/TK-UI"

Revision as of 17:32, 9 September 2008

Introduction

TK-UI is a proposed open source component under the Eclipse Platform Incubator project. TK-UI's purpose is to:

• CSS/Styling : provides an extensible CSS engine capable of applying styles to any Object (SWT widget, Swing container, XML element....)
• JFace Databinding DOM : provides a JFace Databinding implementation to bind with a DOM Node (Attribute, Element, Document...).
• Declarative UI : (not sure if E4 is interested in this ?).

CSS Styling

Goals

• Provide a Customizable CSS Engine :
  • Apply styles to any object (SWT widgets, Swing Container, XML).
  • Extends the existing selectors behaviour (ex : Text#MyId {...}.
  • Manage your own selectors.
  • Extend the existing CSS Property behavior (ex: color:red).
  • Add your own CSS properties.
  • Resource caching (Color, Font, Image...).
  • Manage the resources paths (Image...).
  • Choose the SAC parser to use.

• Can apply styles at runtime :
  • Compute the default styles.
  • Apply default styles before applying new styles.
  • Pseudo classes :focus, :hover are supported.
  • Can easily be embedded in CSS editors to enable real-time previewing.
  • Provide tools to generate a CSS stylesheet from an existing UI tree (SWT Shell...).

CSS SWT sample

// 1. Create SWT CSS Engine
CSSEngine engine = new CSSSWTEngineImpl(display);
// 2. Parse style sheet
engine.parseStyleSheet(new StringReader(
"Label {color:red;} Text {background-color:green;}"));
 
// Label
Label label1 = new Label(panel1, SWT.NONE);
label1.setText("Label 0");
 
// Text
Text text1 = new Text(panel1, SWT.NONE);
text1.setText("bla bla bla...");
 
// 3. Apply Styles (Loop for shell children widgets)‏
engine.applyStyles(shell, true);

Related information

You can find another information about TK-UI CSS engine :

• CSS Engine API.
• SWT CSS Engine.
• TK-UI CSS engine presentation.

JFace Databinding DOM

Declarative UI

1. Describe UI with any XML based markup language. Today TK-UI implements XUL and XHTML.
2. Render XML markup with any GUI library. Today TK-UI supports both SWT and Swing.
4. Use of JFace Databinding to bind UI widgets with a DOM structure (elements, attributes).
5. Manage binding with DBEL (Databinding expression language) to bind UI widgets with POJOs, Scriptable objects 
   or another UI   widget. XAML binding expression is implemented, and it's possible to easily implement 
   your own binding expression.
6. Mix several XML markup languages (ex : use XHTML and XUL in the same document, and use XAML binding expression 
   with XUL controls).
7. Manage the UI tree with a DOM document in a similar fashion of Javascript/HTML :
  * use DOM document.addEventListener to add UI event listener.
  * use document.createElement('input') to add a Text widget.
8. Manage logic of the UI with a scripting language (Javascript...) or with a Java POJO (similar to JSF Backing beans).