Pocket PC Developer Network / Articles /

HTML based dialog for Pocket PC

Vassili Philippov (vasja@spbteam.com), July 10, 2001.

Introduction

Screenshot It seems to be a good idea to use an HTML based dialog in Pocket PC applications. Much work you have to do will be done by HTML engine. Pocket PC provides htmlview.dll that contains HtmlView control. But a lot of developers find it difficult to use. STHtmlDialog library provides an easy way to use a wrapper that encapsulates most of work with HtmlView control.

Using HTML in dialogs your can display a text using different fonts, colors and styles, use different HTML controls, display images, use links and many other features provided by HTML.

Keep also in mind that HTML provided by HtmlView control does not support some of the features you might expect as JavaScript, frames, etc.

What You Need

Background

To create HtmlView control without STHtmlDialog library you should:

  1. Add htmlview.lib library to your project. Call Project Settings dialog (Alt+F7), then go to the Link tab page and add htmlview.lib string to Object/library modules field.
  2. Include Htmlctrl.h files. Add #include <Htmlctrl.h> line to your StdAfx.h file.
  3. Load the HTML Viewer DLL by calling the LoadLibrary function. Specify Htmlview.dll in the lpLibFileName parameter.
  4. Register the HTML Viewer control class by calling the InitHTMLControl function.
  5. Create a window for the HTML Viewer control by calling the CreateWindow function. Specify DISPLAYNAME in the lpClassName parameter
  6. Rewrite WindowProc function and handle WM_NOTIFY messages. Here you should give images and handle links (NM_HOTSPOT and NM_INLINE_IMAGE codes).

Using STHtmlDialog library

To create an HTML dialog using STHtmlDialog library you should:

  1. Insert STHtmlDialog.h and STHtmlDialog.cpp files into your project (use Project\Add To Project\Files menu item).
  2. Add htmlview.lib library to your project. Call Project Settings dialog (Alt+F7), then go to the Link tab page and add htmlview.lib string to Object/library modules field.
  3. Change supper class of your dialog form CDialog to CSTHtmlDialog.
  4. In OnInitDialog method of your dialog you should add the calling of SetHtml function that sets HTML text.

Handle HTML

Links

When a user clicks a link in HTML, the OnLink virtual function of your dialog is called. To handle links you should override this function. strHref parameter contains href attribute of the link that was clicked.

Images

To use images in HTML code first register them. Call RegisterHtmlImage function during initialization for each image you are going to use in HTML. When you register an image you should point a string that can be used in HTML in src attribute of img tag.

Conclusion

It's easy to create an HTML based dialog using STHtmlDialog library. CSTHtmlDialog wraps functionality of HtmlView control including images and links.

Related resources: