基于WinCE的Widget引擎System DOM的设计与实现

李欢欢

上海同济大学软件学院嵌入式系统实验室，上海 201804

1 Widget是什么

Widget 是小工具的意思。Widget的设计理念就是使在我们桌面，手机，网页等平台运行的任何工具都能更换皮肤，拥有个性化的外观。Widget应用广泛，目前在PC桌面上常见的有vista，Win7的侧边工具栏，在手机上比如苹果的iphone、Google的Android、Nokia的S60等主流手机系统都已经添加了很多Widget应用。

2 Widget引擎组成

需要安装Widget引擎才能够运行Widget工具。我们的Widget引擎是在WinCE上实现的一个基于JavaScript的应用程序平台，主要是参考Yahoo!Widget Engine设计的，它能够支持大部分的Yahoo Widgets。我们的Widget引擎主要由以下部分组成：XML解析器，JavaScript引擎，cairo图像库等。

3 System DOM（系统文档对象模型）

每个Widget都是作为单独的程序执行，Widget一般都是一个压缩包（其实就是.zip格式），运行时，引擎负责解析压缩包中的内容。压缩包里面有一个.kon文件，.kon文件是Yahoo!Widget的文件格式，它是采用XML格式来定义的。.kon文件中有很多XML标签，比如＜window>、＜image>、＜action>，这几种标签标识的内容分别是窗口、图片和动作，他们都是属于引擎中的CoreDOM，当然CoreDOM还有很多种，比如Text,Frame等。CoreDOM主要描述组成一个widget的对象和这些对象的属性。而另外有些标签如：＜screen> 、＜system>、＜filesystem>等这些是标识系统方面的东西，它们是属于System DOM。System DOM主要是指一些系统的属性和函数，它们用来帮助JavaScript脚本来访问系统的信息，或者底层硬件信息。

4 System DOM设计

4.1 JavaScript

我们采用的JavaScript引擎是SpiderMonkey，它是FireFox浏览器的JavaScript引擎。通过System DOM的设计，在C++程序中执行JavaScript 脚本，并让JavaScript脚本访问C++对象的数据和执行操作，这样也就能达到SystemDOM访问系统属性和底层硬件信息的要求。

为了能运行JavaScript脚本首先得建立JavaScript运行环境，主要是JavaScript Runtime、Context和全局对象。这里不详细介绍。建立好运行环境后，就需要添加System DOM。我们以cpu这个System DOM作为例子。

4.2 定义JS类

首先需要定义一个C++类，这个类主要实现C++对象的方法，比如我们的System DOM 中有一个cpu，我们在JavaScript代码中执行cpu. activity，就能得到cpu的利用率，这时，我们需要建立一个C++类Cpu，然后在类中实现一个getCpuUsage()方法，来获取cpu的利用率。有的情况比较简单，可以不用实现添加C++类也行，比如screen，system.memory等这些System DOM。

定义完C++使用的类后，需要再定义一个C++类给JavaScript类使用，这里我们取名为JSCpu。虽然这个类也是C++类，但是它内部需要添加SpiderMonkey定义的结构类型JSClass和回调函数等方法，我们为了好识别类名前面添加JS，我们相应的称这个类为JSCpu。

在JSClass结构体类型中，包含有JavaScript类的名字、标志位以及给脚本引擎用的回调函数的名字。这里的回调函数的作用包括设置属性数据、获取属性数据、类的析构等，可以根据自己的需要在JSCpu类中定义。回调函数在类中都是以静态成员函数存在，之所以JSClass结构体对象和回调函数都是静态的，是因为我们需要在没有对象的情况下调用这些函数。

4.3 定义回调函数

回调函数主要包括以下几种：JSSetProperty，JSGetProperty，JSConstructor，JSDestructor。

JSGetProperty和JSSetProperty就是get和set方法，用来访问和设置属性。在JSGetProperty中，首先通过函数获取在JSConstructor中附加在JSObject上的指针，通过这个指针获得JSObject内置的C++对象的指针。由于可能有多个属性，所以调用JSGetProperty时会传入一个jsval的参数，通过这个参数能够区分不同的属性。Jsval是JSAPI中定义的JavaScript类型，能够保存C++类型的值。然后对不同的属性，通过C++对象的指针调用不同的方法，就可以得到需要的值。最后设置JSGetProperty的还回参数，还回参数是一个jsval类型的指针。

JSSetProperty的实现跟JSGetProperty相似。得到JSObject指针后，针对不同的属性，将jsval指针类型的参数中的值设置到C++类型对象中去。有的System DOM不需要实现JSSetProperty，比如memory和cpu，因为它们只需要访问属性。

4.4 添加方法

有的System DOM，比如filesystem. createDirectory ()，这时我们需要通过添加方法来实现。首先需要创建一个JSFunctionSpec类型的数组作为JSClass类静态数组成员，然后在实现文件中，对数组进行初始化，最后一个元素必须为空。

方法的实现，主要看具体的需要。方法可以传入参数，调用JS_ConvertArguments，通过这个JSAPI能直接获取到此方法传入的参数。同时可以通过前面的方法获得JSObject中的指针，然后再进行操作。

4.5 初始化JSObject

完成JSClass结构体和回调函数后，还需要初始化JSObject，需要调用JSAPI，JS_InitClass来初始化JSObject。

5 结论

本文详细描述了System DOM的设计原理和实现方法，通过我们设计的System DOM，所以能方便Widget工具访问系统信息和底层硬件信息。