本文和大家重点学习一下WebWidget开发概述，WebWidget开发是轻量级的Web应用程序，为使用者提供一键式的服务。它通常被设计为具有特定的功能，如提供天气、股票、拍卖等的信息。
WebWidget开发概述
移动互联网的兴起
移动通讯的商业环境正在面临快速变化。一个重要表现是，人们的工作、生活越来越多地倚赖于Internet，例如大量涌现的Web2.0网站、网络社区。同时，人们对Internet的需求也越来越多样化。如何把移动通讯与Internet结合起来，无论对于移动终端制造商还是Internet服务提供商，都是一个新的有趣的挑战。
现在在移动设备上访问Internet，不如在PC上访问方便，并且支持的Web能力也有限。针对这个问题，目前有两种主要的解决方案，即服从于Web和服从于PC的解决方案。S60的浏览技术属于后者，致力于在移动设备上提供类似于PC的浏览体验。而通过PC访问Internet，则不如通过移动设备那样，有方便、快捷的网络接入。此外，统计数字显示了网站访问存在的"二八"现象，即人们频繁访问的只有少数网站。针对以上问题，S60SDK3rdEditionFeaturePack2中推出了相应的解决方案----WebWidget（以下简称Widget）。
随着Widget开发的推广，在不久的将来，人们将可以随时随地访问Internet，就象今天人们打电话一样容易。
什么是WEBWidget开发
WebWidget开发是轻量级的Web应用程序，为使用者提供一键式的服务。它通常被设计为具有特定的功能，如提供天气、股票、拍卖等的信息。它与网页一样，使用标准的Web技术开发，如XHTML，CSS，javascript等。从这方面看，Widget是脱离浏览器UI运行的网页。
与其它S60应用相比，Widget可以通过相同的方式下载、安装到手机上。这使它非常易于分享。
Widget的运行基于WebRun-time（以下简称WRT）。WRT是S60SDK3rdEditionFeaturePack2中，新增加的浏览器组件。它是一个Web应用开发环境。
访问以下链接可以获得更多关于Widget的信息，[url]http://www.forum.nokia.com/main/resources/technologies/browsing/widgets.html。[/url]
体验Widget
Widget的使用方式与S60本地应用一样。作为Widget的运行平台，WRT设计目标之一就是使Widget与S60平台进行无缝集成，给用户一致的使用体验。例如，每个Widget都可以在应用程序菜单中显示图标；可被设置为待机状态下的快捷键和左右软键；能出现在活动应用列表中；具有与现有的S60应用一样的管理方式，如安装，卸载。
如下链接展示了Widget的安装和使用的一段视频，[url]http://www.forum.nokia.com/info/sw.nokia.com/id/4e20baf8-4c58-4d36-be9f-798a168a844d/Web_widget_webinar_zh_Ch.swf.html。[/url]
安装Widget
如上所述，Widget的管理方式与S60本地应用一样。如果了解S60本地应用的安装，就可以顺利地安装Widget。现在支持Widget的手机有***版软件的NokiaN95以及N958G，以及即将上市的所有S603rdEditionFP2手机。
通过链接http://discussion.forum.nokia.com/forum/showthread.php?t=115609#4，可以下载一些Widget例子。
Widget以安装包的形式发布。一个安装包就是一个扩展名为.wgz的ZIP文件，包含Widget的所有源文件以及Widget项目的根目录。
把Widget部署到手机上是安装的***步。Widget可以通过三种方式部署到手机上：
◆通过蓝牙或红外发送到目标设备的信息收件箱中。
◆通过MMC卡或USB端口传送到目标设备的内存中。
◆通过S60Web浏览器下载。
相应地，根据Widget开发部署方式的不同，安装过程也有所不同：
◆通过信息应用程序打开信息收件箱中的Widget安装包，根据提示安装。
◆使用手机上的文件管理器从MMC卡或从本地C盘上打开Widget安装包，根据提示安装Widget（假定Widget安装包已经复制到MMC卡或通过USB数据线传到手机C盘）。
◆如果在服务器端配置Widget安装包的MIME类型为x-nokia-widget，通过S60浏览器中下载到手机的Widget安装包将被浏览器识别并自动安装。
安装好后的Widget出现在"应用程序"菜单中。
在S603rdEditionFP2的Emulator中安装Widget的步骤与上述步骤类似。常用方法是，首先把Widget安装包复制到文件夹Symbian\9.3\S60_3rd_FP2_Beta\epoc32\winscw\c\Data\Others中（以S60SDK3rdEditionFP2为例），然后使用Emulator中的文件管理器打开并安装。
上一节"体验Widget"中的链接包含了一段演示Widget安装过程的视频。
Widget开发过程
开发Widget使用标准的Web开发技术，如XHTML，CSS，javascript等。这使得Widget开发比较容易上手，开发周期也较短，一般仅需要数日至数周。
Widget包含两个必要文件：HTML文件和info.plist文件。以及其它可选文件：css文件，javascript文件，资源文件（如图标，背景等）。HTML文件定义了widget的结构和内容。Css文件定义了widget的版面格式，如字体、颜色等，起修饰作用。Javascript给widget增加了动态效果，使其具有某些智能。
Widget项目表现为文件系统中的一个目录。该目录包含Widget的所有文件。开发过程中要注意，Widget的必要文件和图标文件(icon.png)必须位于widget项目的根目录下。
Widget的开发过程如下：
1.用字编辑器或WebIDE编写widget代码。
2.调试widget。可结合使用Firefox与Firebug，常用的调试功能有设置断点、单步执行等，还可以观察HTML文件的DOM结构。
3.把widget文件连同目录打成ZIP包，改扩展名为.wgz，安装到测试环境。
测试Widget开发可使用三种环境：
1.S603rdEditionFP2中的emulator。
2.支持WRT的某些手机。当本文写作时，可用的手机包括具有***版软件的诺基亚N95，N958G等。即将发布的所有S603rdEditionFP2手机也将支持Widget.
3.通过RDA（RemoteDeviceAccess）测试。RDA是一种通过Internet远程访问诺基亚S60设备的服务，有关RDA的信息位于http://apu.ndhub.net。
4.测试Widget，改正Bug。可重复执行步骤1至4。
关于Widget开发的信息还可以访问链接：http://www.forum.nokia.com/...Getting_Started_with_Nokia_Web_Widget_Development.html。该文档通过一个例子详细讲解了如何开发widget。关于WRTAPI参考可访问链接：http://www.forum.nokia.com/info/sw.nokia.com/id/cf225acf-7efe-4dae-b89f-967578c00f1d/Web_Run_Time_API_Reference.html。
Widget开发***实践
用Firefox和模拟器进行开发和调试
Widget开发基本可以用Firefox浏览器完成，就像开发普通网页类似。在浏览器中调试完成后，如果没有支持的手机，可以先在S60SDK的模拟器中进行测试。
对于有网络连接的应用，需要对网络连接进行类似以下的处理，否则无法在浏览器中调试：
- try{
- if(window.netscape){
- netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
- }
- varhttpRequest=newXMLHttpRequest();
- httpRequest.open("GET",someurl,true);
- httpRequest.send(null);
- }
- catch(e){
- alert(e);
- }
S603.2或者5模拟器下载地址：http://www.forum.nokia.com/info/sw.nokia.com/id/ec866fab-4b76-49f6-b5a5-af0631419e9c/S60_All_in_One_SDKs.html
需要注意的是，5版模拟器目前不支持中文，所以只能大致用来测试UI的适配。主要还是要用3版模拟器。
模拟器上的测试方式是：将wgz文件存在sdk安装路径下的\epoc32\winscw\c\Data\Others下，然后从模拟器的文件管理中进行安装。
文件命名和编码
关于Widget中的文件、目录名称，以及文本文件和数据接口的编码格式，请遵循以下原则，以获得对不同手机的***兼容性：
◆所有文件和目录名称不要使用中文
◆所有包含中文的文本文件(html,javascript,info.plist等)，务必要使用utf-8编码进行保存
◆第三方的API接口返回的xml文件也要尽量使用utf-8编码
CMWAP接入点问题
CMWAP接入点问题是中国特有的问题，一定要了解。
连网时如果选择CMWAP接入点，需要注意CMWAP的请求确认页面问题。如果请求方式是GET，则会碰到请求确认页面，导致内容无法获得。解决办法是对连接的IP或域名进行一次无效请求。还有一种方式是使用POST方式，这种方式的请求不会被CMWAP网关拦住。两种方式的示例如下：
- /◆无效请求◆/
- functionjumpCMWAP()
- {
- if(window.netscape)
- {
- netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
- }
- varxmlHttpRequest=newXMLHttpRequest();
- xmlHttpRequest.onreadystatechange=function()
- {
- if(xmlHttpRequest.readyState==4)
- {
- if(xmlHttpRequest.status==200)
- {
- /◆无效请求结束，这里可以开始调用正式GET请求◆/
- }
- }
- }
- xmlHttpRequest.open("get","http://正式域名地址或IP地址/",true);
- xmlHttpRequest.send(null);
- }
- /◆GET请求◆/
- xmlHttpRequest.open("get","接口地址",true);
- xmlHttpRequest.send(null);
- /◆POST请求◆/
- xmlHttpRequest.open("post","接口地址",true);
- xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
- xmlHttpRequest.send("请求参数拼接字符串，参数间&符号隔开");
导航模式设置
Widget开发中有指针(cursor)和导航键(tab)两种导航模式，建议统一使用指针模式，否则如果只支持导航键模式，在触摸屏手机上将无法使用。
打开外部网站链接
必须使用widget.operUrl()来打开其它网站链接，而不是使用类似于<ahref=”http://www.google.com”>google</a>的方式。后一种打开方式将导致无法从打开页面中返回widget。
界面设计和兼容性
如果设计合理，widget可以自动适应不同屏幕尺寸，包括触摸屏和屏幕旋转。如果有的情况界面不容易处理，也可以为不同机型开发不同的widget。但是任何widget中屏幕旋转一定要支持，这个无法通过安装不同版本的widget来解决。
基本的原则就是，不要使用固定大小的图片做为背景和边框等，这点和普通网页设计基本上是一致的。另外在字体选择上也要合适，否则在高分辨率的手机上自会很小。对于普通240×320的屏幕，字体用13~16号，对于XpressMusic5800的360X640屏幕，需要用24号左右的字体大小。屏幕尺寸可以通过screen.width和screen.height来获得。
另外，由于屏幕旋转时没有事件触发，所以有的情况（例如无法用同一张图片对横屏进行自适应）旋转后要进行特殊处理的，可以用定时器来监测是否有屏幕尺寸的变化，从而模拟旋转事件。这样会有一定的效率问题，因为一直有个定时器程序在不间断地运行。
XpressMusic5800适配问题
XpressMusic5800是基于S60第五版本的触摸屏手机。除了要在界面设计时注意上节所说的问题之外，还有一些其它问题要注意。
◆文本内容在5800上不会自动换行，需要用如下样式进行处理：word-break:break-all;
◆如果界面上有输入框，输入内容后，菜单会自动变成”完成”和”取消”，这时，如果页面上还有另外的按钮，而用户没有点击”完成”或”取消”而直接点击那个按钮，如果这个按钮的事件处理中，进行了setRightSoftKey()操作，就会立刻导致widget非正常退出。解决的方案有几种，一种是不要在有输入框的页面放置其它按钮和链接，而是将需要的功能放在左键选项菜单中，这样用户只有点击”完成／取消”之后，才有机会再点击其它功能；还有就是不要改变右键菜单，这样的效果就是完成当前操作后，菜单还是停留在”完成／取消”。
Widget开发的发展
Widget的运行需要WRT支持。现阶段的widget只是信息型的widget，从网络获取信息并呈现给用户。此外，WRT在很多方面支持widget与S60的无缝集成，主要体现在widget的管理和使用方式上，与S60应相比，能够给用户一致的使用体验。
下一阶段，widget将进一步整合智能手机平台。例如，widget将能够访问位置，PIM，媒体等手机设备信息，以及其它平台提供的服务。并改进用户界面，进一步提升用户的使用体验。
WRT是一个不断发展的平台，widget也将拥有更强大的能力和丰富的功能。如果解决了平台安全性问题，widget将能够通过S60API来访问S60平台提供的服务。那时，开发部署widget也许会需要一个类似于Symbian签名的验证过程。
更多信息
诺基亚论坛中文讨论区有关于Web技术和WebWidget的专题,可以访问以下链接来交流经验,答疑解惑，http://discussion.forum.nokia.com/forum/forumdisplay.php?f=76。其中Widget专题收集了Widget文档、开发工具、Q&A等，可通过以下链接访问：http://discussion.forum.nokia.com/forum/showthread.php?t=115609。
新发布的Widgete-learning资料，内容比较全面，包括概述和一个开发实例，http://www.forum.nokia.com/info/sw.nokia.com/...=s60platformArticle7CTA。
关于S60浏览技术的信息，可以访问http://www.forum.nokia.com/browser。
