本开源项目提供了一个Symbian平台下的自定义控件CHtmlControl，它是一个轻量级的HTML/CSS解析和渲染的控件，可以轻松支持复杂的界面效果，也可以用来显示Web内容。

This open source project provide a CCoeControl derived class which allows Symbian C++ developers to build custom UI or to render simple web page by using HTML and CSS. By using it, you can build complex UI easily even without any knowledge of Symbian drawing APIs. Now you can focus on UI design, without being limited by technology. Any type of UI we are able to build!

查看示例截图/See screenshots of example application.

Check change logs here.

Supported SDKs

• S60 2nd Edition
• S60 3rd Edition
• S60 5th Edition
• UIQ3

Features

• Derived from CCoeControl, so it is easy to use in any type of Symbian application.
• Support commonly used HTML tags and CSS grammar.
• Provide methods to access all elements in the HTML document, and also change their content or style in runtime. (Just like what DHTML can do).
• Support a wide range of image types, including animated gif.
• Support system skin.
• Support create standard UI layout, e.g. List, Grid, fully customized.
• Support both key event and pointer event.
• Support scrolling, with system scrollbar or custom scrollbar.
• Support form elements.
• Support transitions, with easing.

Installation

Download binaries from download page. And then follow the instructions in readme.txt.

You can also check out the source code, and compile the libraries yourself. It's simple and easy.

Tutorials

• Getting started.
• How to use resource string.
• How to use font size.
• How to use images.
• How to use colors.
• Usage of some CSS properties.
• Supported CSS Filters.
• How to use scrollbars.
• How to use scrollable/clipped text in list.
• 使用htmlcontrol实现各种基本控件.
• 使用htmlcontrol构建自定义的列表控件.
• 如何使用htmlcontrol实现界面过渡效果.
• htmlcontrol支持的手指滑动操作.

Examples

HelloWorld

A simple application demonstrated the basic usage of CHtmlControl. For S60 3rd Edition and S60 5th Edition.

Screenshots

Download S60

FileManager

This example demonstrated how to create list and grid, how to use transitions, how to use system skin. For S60 3rd Edition, S60 5th Edition and UIQ3.

Screenshots

Download S60

Download UIQ

Form

This example demonstrated how to use form elements, such as INPUT, SELECT, TEXTAREA. For S60 3rd Edition and S60 5th Edition.

Screenshots

Download S60

CheckList

This example demonstrated how to create a check list.For S60 3rd Edition and S60 5th Edition.

Screenshots

Download S60

NestedList

This example demonstrated how to create a nested list.For S60 3rd Edition and S60 5th Edition.

Screenshots

Download S60

HtmlDialog

This is a dialog class use HtmlControl to render its content.

Download

MediaPlugin

This example demonstrated how to create plugin for htmlcontrol. For S60 3rd Edition.

Screenshots

Download S60