Features

This section describe the TK-UI features :
  • DOM : describe the UI with any XML grammars.
  • UI : render the XML grammar with SWT or Swing.
  • CSS : manage CSS styles.
  • Databinding : use JFace Databinding.
  • DOM Interceptor : use to add easy logic into phase of DOM Document build. For instance to manage Javascript, Backing bean...

DOM

XML description

TK-UI can manage any XML grammars to describe UI and you can mix it together . TK-UI provides XHTML and XUL XML grammar implementation, but it's possible to implement your own XML grammar with IDOMElementFactory implementation.

Here mix of XUL and XHTML grammar you can do it : 

<xhtml:table>
    <xhtml:tr>
    	<xhtml:td>
    		<xul:textbox value="bla bla bla" />
    	</xhtml:td>
    	<xhtml:td>
    		<xhtml:input type="text" value="bla bla bla" />
    	</xhtml:td>
    </xhtml:tr>
</xhtml:table>

Once you have implement your own XML grammar you can mix it with existing XML grammar (XUL and XHTML).

w3c DOM Java implementation

TK-UI extends the Xerces DocumentImpl to have w3c DOM Document which is enable to synchronise DOM with UI , on other words, synchronise DOM elements, attributes( ex : attribute value of textbox element) with UI (ex : text property of SWT Text). This sy,chronisation is done with JFace Databinding .

To create and load TK-UI DOMDocument, you can use XML content stream, reader like this : 

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" >
    <box>
    	<textbox value="bla bla bla" />
    </box>
</window>
or use DOM API like this : 
Textbox textbox = (Textbox)document.createElement("textbox");
textbox.setAttribute("value", "bla bla bla");
...
box.appendChild(textbox);
It's possible to add/remove w3c element at runtime (ex : add Textbox at runtime to td element).

You can use standard w3c methods of DOM Document to retrieve some element like getElementById , getElementsByTagName or use XPath for advanced search.

DOM event

To add listener to the DOM element, you can use w3c addEventListener method. To add DOM click event to a HYML input butto, you can write : 

Element insertNodeButton = document.getElementById("insertNodeButton");
((EventTarget) insertNodeButton).addEventListener(DOMEventConstants.click,
    new EventListener() {
        public void handleEvent(Event event) {
        	// DO Something...
        }
    }
}, false);
The UI event is bounded with the DOM event. For instance if SWT widget gor focus, a FocusIn SWT is dispatch and DOMFocusIn is dispatch too.

Layout

Layout is managed with MigLayout. width and height of widgets are managed with MigLayout. Today HTML table are implemented (colspan is implement too) and XUL box layout.

Layout can be bounded (by using DBEL ). So you can write this : 

<xul:slider value="10" id="sliderID" />
<xul:textbox value="..." id="A" width="{Binding ElementName=sliderID, Path=value}" />
The width of the textbox is bounded to the slider value and the textbox is resized when slider change.

UI

TK-UI support any Java renderer. It implement Swing, SWT and SWT Form. The DOM Document works with IUIElement which wrap native widget (SWT widget....).

CSS

CSS styles are supported.

Databinding

JFace Databinding

JFace Databinding is API for manage binding. TK-UI use JFace Databinding implementation with SWT, Bean, Swing, DOM and Rhino. The DOL event are bounded with UI (Swing, SWT) event.

DBEL

DBEL means DataBinding Expression Language . It's based on JFace Databinding and it's API where you can describe Databinding with String. The default implementation is XAML. This XAML sample 

<xul:textbox value="..." id="textboxId1" />	  		
<xul:textbox width="{Binding ElementName=textboxId1, Path=value}" />
bind value of the second textbox with the first.

It's possible to implement your own DBEL expression to write binding into the XML with your own expression.

DOM Interceptor