本文介紹如何用htmlcontrol實現一些基本的控件。
Label
_LIT(KHtml, "I'm a label.");
_LIT(KHtml, "<font size='30' color='#ff0000'><b>I'm a label.</b></font>");
_LIT(KHtml, "<div style='border:1 outset #333333;background-color:#cccccc'><font size='30' color='#ff0000'><b>I'm a label.</b></font></div>");
Edit
htmlcontrol封裝了CEikEdwin，創建一個輸入框變得很簡單，例如
_LIT(KHtml, "<input type='text'>");
_LIT(KHtml, "<input type='text' style='width:60%; border:1 solid #000000; background-color:#00ffff'>");
_LIT(KHtml, "<textarea></textarea>");
_LIT(KHtml, "<textarea drawlines='true'></textarea>");
_LIT(KHtml, "<body style='background-image:images/2009-02-24_173611.jpg'><textarea draw-lines='true' style='background-color:none;color:#ff0000'></textarea></body>");
Image
_LIT(KHtml, "<img src='images/N97_main.jpg'>");
_LIT(KHtml, "<img src='images/N97_main.jpg' width='100' height='100'>");
_LIT(KHtml, "<img src='images/2.gif'>");
_LIT(KHtml, "<img src='images/2.gif' width='200' height='200'>");
Button
可以使用<input type='button'>實現一個傳統的button，不過這裏不討論這種簡單的方式。我們看一種複雜的button。
_LIT(KHtml, "<body style='padding:auto auto'><div focusing='true' style='width:100;height:30;border:1 inset #333333;background-color:#eeeeee;padding:auto auto'>Button</div></body>");
focusing='true'說明這個DIV是可以獲得鍵盤焦點的（在觸摸屏上則可以點擊）。但作爲Button，它還需在獲得焦點時提示用戶，也就是
_LIT(KHtml, "<body style='padding:auto auto'><div focusing='true' style='width:100;height:30;border:1 inset #333333;background-color:#eeeeee;padding:auto auto' focus-style='border:2 solid #0000ff; padding:-3'>Button</div></body>");
下面是一個帶圖片的兩個Button的例子（更簡潔的寫法可以使用樣式表）
_LIT(KHtml, "<body style='padding:auto auto'>" "<div focusing='true' style='width:100;height:30;border:1 inset #333333;background-color:#eeeeee;padding:auto auto' focus-style='border:2 solid #0000ff; padding:-3'><img src='images/apply.png' width='20' height='20'>Button1</div><br><br>" "<div focusing='true' style='width:100;height:30;border:1 inset #333333;background-color:#eeeeee;padding:auto auto' focus-style='border:2 solid #0000ff; padding:-3'><img src='images/cancel.png' width='20' height='20'>Button2</div>" "</body>");
