Home > Messages from the Ether > HTML integration in CE applications

HTML integration in CE applications

In two previous entries, I had discussed tips on developing on Windows CE and trapping events from the Web Browser control. I had been researching integration of an HTML UI in a CE application for a hypothetical company I work for. Here are some details on what I've found.

The Ideal Design

The primary requirement is to have dialog resources external to the application and to have their layout and underlying logic externally editable. The original design was to use XSL to implement application screens. The screens would need to include database integration and to validate user actions. The following technologies would be used to get the features we want:

• HTML - provides page layout,
• XML/XSL - merges database data into the HTML layout,
• The HTML/XML DOM, JavaScript - provides all levels of data validation,
• COM connection points - provides HTML event notifications

HTML 4.01, implemented in the XSL files, would be used for all of the control layout on the screens. HTML provides the basic Windows controls (e.g. edit boxes, list boxes, buttons, etc.) that would be useful in a CE application. Tree and list controls (multi-columned lists) would require more advanced DHTML coding, but they are less useful within the CE form factor.

XSL would be used to populate the screen with database data in the form of XML documents. In the MVC pattern, the XSL/HTML represents the view and the XML document represents the model. The XSL can also integrate secondary XML files to populate lists for choosing among valid selections.

JavaScript would be used for the validation logic behind each control. Via the DOM, JavaScript would access the control values and validate the data that was entered.

HTML, XSL, and JavaScript used in this manner is a part of everyday Web development. To integrate them into a Windows application, we need to use the Web Browser control interfaces so that the application can respond to events fired on the page (primarily button clicks) and navigate back to non-HTML screens. A previous entry describes how to use those interfaces.

CE Limitations

Although this design would work on the desktop, several key aspects of the technologies are not supported on CE. The Web Browser control is only available within Internet Explorer, and IE is available on CE only if you build an OS image using Platform Builder. While IE is not generally included on Pocket PCs, Pocket Internet Explorer (PIE) is. However, PIE has several major limitations beyond just the lack of Web Browser interfaces. Although it supports JavaScript (more precisely, JScript), it does not have any substantial support of the DOM. You can write script behind HTML events, but the script cannot access the HTML itself. And XSL, although supported, is considerably limited.

The only viable option for displaying HTML content on CE is to use the HTML Control. It consists of a very small API to create and manage an HTML window. This control has an additional set of limitations to deal with; it apparently only provides a subset of what PIE provides. The most notable deficiency is that external script files cannot be used--they must exist in <SCRIPT> blocks. Finally, the only HTML events that can be trapped from the HTML Control are link and button clicks.

Here is a summary of the issues:

• No Web Browser control interfaces,
• No DOM,
• Limited XSL support,
• No external script files (HTML Control),
• Limited event notification (HTML Control)

My ultimate solution was to write code to replace the missing features as best as possible. With that additional code, I supported a subset of all of the features listed above and, although not perfect, achieved much more than if the HTML Control were not available.