一步步创建 边栏 Gadget(一)
??? 沒找到稱心的邊欄Gadget吧，不必出頭喪氣咯。下面我們將介紹如何創(chuàng)建自定義的邊欄Gadget（以下將成為Gadget），效果如下圖所示：
????????????????????????
?
什么是Gadget
??? 邊欄Gadget是一種強(qiáng)大的小工具，所以您可能認(rèn)為創(chuàng)建一個(gè)Gadget多么的不容易。事實(shí)上如果您了解關(guān)于HTML、CSS、JavaScript，創(chuàng)建Gadget變得是那么的簡單。最簡單的Gadget僅僅有一個(gè)HTML文件以及XML描述文件。當(dāng)然多數(shù)的Gadget包含圖片文件（jpeg Png ect）、腳本文件(js ,vbs ect)、樣式文件(CSS)。所有這些都被放置在一個(gè)以.gadget為擴(kuò)展名的ZIP壓縮文件中。
?
步驟一：創(chuàng)建主HTML文件
命名為video.html
?
?1?<html?xmlns="http://www.w3.org/1999/xhtml">?2?<head>
?3?<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8">
?4?<title>My?Video</title>
?5?<script?type="text/javascript"?src="js/video.js"></script>
?6?<style?type="text/css">
?7?body{margin:?0px;padding:0px;?background-image:url(images/bg.jpg);?background-repeat:repeat-x;?width:200;?height:155;?background-color:#000;}
?8?</style>
?9?</head>
10?<body?id="gb">
11?????????????<embed?src="http://www.tudou.com/l/e3MBzOUVNaQ"?type="application/x-shockwave-flash"?allowscriptaccess="always"?allowfullscreen="true"?wmode="opaque"?id="elpy"?name="elpy"?width="200"?height="150">
12?</embed>
13?</body>
14?</html>
15?
?
步驟二：創(chuàng)建XML描述文件
XML描述文件是一個(gè)描述Gadget的文件，也可以說是一個(gè)Manifest。它將一個(gè)Gadget中的內(nèi)容鏈接在一起，但是我并不認(rèn)為其是一個(gè)Manifest。因其僅僅提供了該Gadget的描述信息（作者，版本，描述，名稱，圖標(biāo)鏈接等）以及主HTML文件的鏈接。命名為：gadget.xml
?
?1?<?xml?version="1.0"?encoding="utf-8"??>?2?<gadget>
?3?????<name>My?Video</name>
?4?????<namespace>netwenchao.gadget</namespace>
?5?????<version>1.0</version>
?6?????<author?name="Denny.dong">
?7?????????<info?url="http://netwenchao.cnblogs.com%22/>
?8?????????<logo?src="images/logo.png"?/>??????
?9?????</author>
10?????<copyright>Denny.dong???2009</copyright>
11?????<description>You?can?view?video?from?any?video?site?when?you?have?the?URL?of?the?video.Just?like?tudou?or?youku?ect.</description>
12?????<icons>
13?????<icon?height="320"?width="240"?src="images/gadgetIcon.png"?/>
14???</icons>
15?????<hosts>
16?????????<host?name="sidebar">
17?????????????<base?type="HTML"?apiVersion="1.0.0"?src="video.html"?/>
18?????????????<permissions>full</permissions>
19?????????????<platform?minPlatformVersion="0.1"?/>
20?????????</host>
21?????</hosts>
22?</gadget>
?
- name: gadget的 名稱
- version: gadget 的版本.
- author: 作者信息
- info url: 網(wǎng)址
- info text: 網(wǎng)址名稱
- logo src: logo圖片地址
- copyright: 版權(quán)聲明
- description: gadget的描述
- icon src: 該Gadget的圖標(biāo)文件
- base src: 該Gadget的主HTML文件
步驟三：創(chuàng)建Gadget
??? 選擇以上兩個(gè)文件，壓縮成ZIP格式。修改擴(kuò)展名從.ZIP為.gadget。雙擊該文件，即可出現(xiàn)安裝提示窗體。如下圖：
必備知識：
?
HTML相關(guān)知識
Web腳本，如javascript，vbscript等
?
相關(guān)資源：
http://msdn.microsoft.com/en-us/library/dd370867(VS.85).aspx
下一篇將介紹如何顯示并添加配置信息，以及添加Dock等...
轉(zhuǎn)載于:https://www.cnblogs.com/netwenchao/archive/2009/07/30/1535445.html
總結(jié)
以上是生活随笔為你收集整理的一步步创建 边栏 Gadget(一)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： php面试专题---MYSQL查询语句优
- 下一篇： 弹出框页面中使用jquery.valid