Windows Vista/7桌面邊欄小工具開發入門

        Windows Vista 的Gadget開發其實並不難，只要你有一定的HTML、CSS、Javascript基礎就能成功地開發出一個漂亮的桌面小工具。在Vista和Win7下，每一個桌面Gadget其實就是一個小的瀏覽器窗口，我們可以通過製作一個HTML頁面，來完成各種桌面功能。簡單的說，我們可以使用HTML+CSS來製作界面，用JS完成程序功能。 
        Vista和Win7的邊欄小工具位於 C:\Program files\Windows Sidebar\gadgets\ 裏面，每一個小工具的命名方式都是YourName.Gadget，建立一個這種格式的文件夾，就爲你自己的小工具添加了存放目錄。 
        .xml文件，用於儲存小工具的基本設置，包括名稱、版本等等。以下就是一個典型的gadget.xml文件示例：

<?xml version="1.0" encoding="utf-8"?>   
<gadget>
  <!--小工具名稱-->
  <name>test</name>  
  <!--小工具命名空間-->
  <namespace><!--_locComment_text="{Locked}"-->Yourname.Test</namespace>  
  <!--小工具版本號-->
  <version><!--_locComment_text="{Locked}"-->1.0.0.0</version>  
  <!--作者名稱-->
  <author name=""> 
    <!--作者更多信息,鏈接和顯示內容--> 
    <info url="http://www.msphome.cn" target="_blank">http://www.msphome.cn
    </info>
    <!--小工具的LOGO-->
    <logo src="logo.png"/> 
  </author>
  <!--小工具版權-->
  <copyright><!--_locComment_text="{Locked}"-->? 2009</copyright>
  <!--小工具簡介-->  
  <description>簡介。</description>  
  <icons>
    <!--小工具圖標-->
    <icon height="48" width="48" src="icon.png"/>  
  </icons>   
  <hosts>   
    <host name="sidebar">
      <!--是否自適應分辨率-->   
      <autoscaleDPI><!--_locComment_text="{Locked}"-->true</autoscaleDPI>
      <!--小工具主體HTML文件-->
      <base type="HTML" apiVersion="1.0.0" src="Test.html"/>  
      <permissions><!--_locComment_text="{Locked}"-->Full</permissions>
      <!--小工具能正常運行的最低平臺-->
      <platform minPlatformVersion="1.0"/>
      <!--當小工具被拖動時,顯示的圖形-->
      <defaultImage src="drag.png"/>  
    </host>   
  </hosts>   
</gadget>

       經過以上設置以後，系統就能識別出我們自己的小工具了。接下來，就是編寫這個小工具了。 首先，我們先來了解下YourName.Gadget這個文件夾裏面的文件。除了上面的gadget.xml文件，我們還需要存放上面定義的logo.png，icon.png，drag.png，這些圖片文件。如果需要多語言支持，請建立語言文件夾，具體存放方法可以參考工具目錄下微軟自帶的小工具。 
       接下來，我們需要知道Gadget的編程接口。在MSDN的參考中，我們得知，在小工具的HTML文件中所包含的JS裏面，我們可以使用System.Gadget對象，這個對象包括的事件、方法、屬性請參考 
       另外，在Gadget裏面還有一些對象也是可用的，這些可能對我們非常有用。詳情請查看博客園上面的文章（內容爲英文） 
       在實際操作中還發現了一個有趣的事情，就是Gadget裏面的JS腳本擁有比較高的權限，可以使用一些在瀏覽器裏面被禁用的COM組件，比如adodb、FSO等等，並且裏面的XMLHTTP組件讀取也是可以跨域的，呵呵。這樣我們可以很方便地使我們的程序變得強大起來。 
       至於小工具的尺寸，我們可以通過CSS定義body的width和height來完成，但在Vista下width最大爲130px，在Windows 7下貌似可以更大。我們可以通過body標籤CSS中的background屬性定義背景圖片，但這樣似乎邊框的過度效果就沒有了，解決方案是在body下面一行使用

<g:background style="position:absolute;z-index:-1;width:130px;height:173px"
    src="img/Back.png" />

來定義一個完美的背景。 
        想要給小工具添加一個設置頁面？可以，只要在公共執行的JS裏面加入一句

System.Gadget.settingsUI = "Settings.html";

就可以了。
        當我們完成開發以後，就需要將小工具打包發佈。標準的小工具安裝包是以Gadget爲擴展名的ZIP或者CAB壓縮包。因此，我們只需要把開發文件夾裏面的所有文件打包壓縮即可。我們可以使用WinRAR製作ZIP壓縮包，然後將擴展名修改爲Gadget即可，這樣，小工具的打包就完成了。