作者在 2011-06-23 23:17:32 发布以下内容
Windows Vista和Win7特有的边侧栏
一小工具的开发原则
小工具是一種簡單且小型的應用軟體，它提供使用者一個快速組織個人相關資訊與工作的方式，例如，天氣小工具可以隨時提供氣象資訊，或是一個便籤小工具讓你隨時都可以使用它記錄事情。所以一個成功的小工具的設計精神在於擁有外觀美麗的使用者介面與簡少平常達成一件事情所需的步驟，一個在桌面讓你予取予求的小工具。
二,编写的一个HelloWorld小工具
首先新建一个文件夹
里面必须有的文件
gadget.xml 小工具的系统设置信息，必要此文件在开发完成后要被Windows读取，做过ASP.NET的把此文件想成跟Web.Config一样重要。
icon.png图标文件，理论上未限制图标大小，但不宜过大200X200像素即可
drag.png拖拽时显示的图片，小工具被拖拽时会显示一个图片
logo.png可选在作者信息里显示LOGO
index.html必要小工具的主界面
其实小工具都是HTML+CSS的网页，里面的程序都是javascript，但是小工具的javascript比一般的网页js有很高权限，也就是说可以在小工具里调用FSO，ADODB等在网页上无法调用的ActiveX组件，从而能获得客户机的硬件信息(CPU速度表等跟硬件有关的小工具就是这么实现的)，因此更加的可以在小工具里通过FSO访问本地硬盘上的文件，甚至读写文件等操作。
配置文件结构如下
<?xml version="1.0" encoding="UTF-8" ?>
<gadget>
<!-- 指定小工具的名稱(必要) -->
<name>Hello, World!</name>
<!-- 指定小工具的版本(必要) -->
<version>1.0.0.0</version>
<!-- 指定作者的姓名 -->
<author name="Your Name">
<!-- 指定作者的資訊網址 -->
<info url="gallerylive.spaces.live.com" />
<!-- 指定作者的LOGO -->
<logo src="logo.png"/>
</author>
<!-- 著作者資訊 -->
<copyright>© 2007 Microsoft Corporation Taiwan</copyright>
<!-- 小工具的簡短的描述 -->
<description>我的第一個小工具</description>
<icons>
<!-- 指定小工具的圖示檔案 -->
<icon width="64" height="64" src="icon.png"/>
</icons>
<!-- 該標記內包含小工具的各種資訊(必要) -->
<hosts>
<host name="sidebar">
<!-- 指定小工具的HTML檔案位置(必要) -->
<base type="HTML" apiVersion="1.0.0" src="HelloWorld.html" />
<!-- 指定小工具權限-建議為FULL(必要) -->
<permissions>Full</permissions>
<!-- 指定該小工具執行的所需最小平台版本-建議目前為1.0(必要) -->
<platform minPlatformVersion="1.0" />
<!-- 指定小工具的拖曳圖像檔案 -->
<defaultImage src="drag.png"/>
</host>
</hosts>
</gadget>
<gadget>
<!-- 指定小工具的名稱(必要) -->
<name>Hello, World!</name>
<!-- 指定小工具的版本(必要) -->
<version>1.0.0.0</version>
<!-- 指定作者的姓名 -->
<author name="Your Name">
<!-- 指定作者的資訊網址 -->
<info url="gallerylive.spaces.live.com" />
<!-- 指定作者的LOGO -->
<logo src="logo.png"/>
</author>
<!-- 著作者資訊 -->
<copyright>© 2007 Microsoft Corporation Taiwan</copyright>
<!-- 小工具的簡短的描述 -->
<description>我的第一個小工具</description>
<icons>
<!-- 指定小工具的圖示檔案 -->
<icon width="64" height="64" src="icon.png"/>
</icons>
<!-- 該標記內包含小工具的各種資訊(必要) -->
<hosts>
<host name="sidebar">
<!-- 指定小工具的HTML檔案位置(必要) -->
<base type="HTML" apiVersion="1.0.0" src="HelloWorld.html" />
<!-- 指定小工具權限-建議為FULL(必要) -->
<permissions>Full</permissions>
<!-- 指定該小工具執行的所需最小平台版本-建議目前為1.0(必要) -->
<platform minPlatformVersion="1.0" />
<!-- 指定小工具的拖曳圖像檔案 -->
<defaultImage src="drag.png"/>
</host>
</hosts>
</gadget>
主界面HelloWorld.html
<html>
<head>
<title>Hello World</title>
<style>
body
{
width:130px;
height:89px;
/*必要的CSS设置小工具页面的body不允许无限大小，*/
/*理论上小工具的界面width可以设置的很大，*/
/*但是作为小工具来说最好不要主界面设置的过大*/
}
</style>
</head>
<body>
<span style="font-size:15px;color:red">
Hello World
</span>
</body>
</html>
接下来再准备一下图标图片，和拖拽的图片即可
打包和安装
将制作好的文件集中到一起
用WinRAR新建一个.zip的文件(注意只能是.zip的文件其他压缩格式Windows不认)
将制作好的内容一起放入新建的.zip文件中，(主界面配置文件和图标必须在压缩文件的根目录里)
然后将.zip文件的扩展名改为gadget与其他小工具一样安装即可
第一部分的教程先到这里，第二部分将讲解添加设置页面，如何在小工具上探出扩展界面等(注:js里的某些弹窗函数在小工具里是不管用的)。
