打开APP
未登录
开通VIP,畅享免费电子书等14项超值服
开通VIP
首页
好书
留言交流
下载APP
联系客服
win7小工具开发
fshell
>《编程技术》
2014.06.13
关注
WindowsVista的Gadget开发其实并不难,只要你有一定的HTML、CSS、Javascript基础就能成功地开发出一个漂亮的桌面小工具。在Vista和Win7下,每一个桌面Gadget其实就是一个小的浏览器窗口,我们可以通过制作一个HTML页面,来完成各种桌面功能。简单的说,我们可以使用HTML+CSS来制作界面,用JS完成程序功能。
Vista和Win7的边栏小工具位于C:\Program files\Windows Sidebar\gadgets里面,每一个小工具的命名方式都是YourName.Gadget,建立一个这种格式的文件夹,就为你自己的小工具添加了存放目录。
为了使系统能够识别小工具,每个小工具文件夹下面都有一个gadget.xml文件,用于储存小工具的基本设置,包括名称、版本等等。以下就是一个典型的gadget.xml文件示例:
view plain
print
?
<?
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"
text
=
"www.msphome.cn"
/>
<!--更多信息,链接和显示内容-->
<
logo
src
=
"logo.png"
/>
<!--小工具的LOGO-->
</
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><!--是否自适应分辨率-->
<
base
type
=
"HTML"
apiVersion
=
"1.0.0"
src
=
"Test.html"
/>
<!--小工具主体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对象,这个对象包括的事件、方法、属性请参考
http://msdn.microsoft.com/zh-cn/library/ms723683(en-us,VS.85).aspx
(英文)
另外,在Gadget里面还有一些对象也是可用的,这些可能对我们非常有用。详情请查看博客园上面的文章
http://www.cnblogs.com/wonderow/archive/2007/04/05/701710.html
(内容为英文)
在实际操作中还发现了一个有趣的事情,就是Gadget里面的JS脚本拥有比较高的权限,可以使用一些在浏览器里面被禁用的COM组件,比如adodb、FSO等等,并且里面的XMLHTTP组件读取也是可以跨域的,呵呵。这样我们可以很方便地使我们的程序变得强大起来。
至于小工具的尺寸,我们可以通过CSS定义body的width和height来完成,但在Vista下width最大为130px,在Windows7下貌似可以更大。我们可以通过body标签CSS中的background属性定义背景图片,但这样似乎边框的过度效果就没有了,解决方案是在body下面一行使用
view plain
print
?
<
g:background
style
=
"position:absolute;z-index:-1;width:130px;height:173px"
src
=
"img/Back.png"
/>
来定义一个完美的背景。
想要给小工具添加一个设置页面?可以,只要在公共执行的JS里面加入一句
view plain
print
?
System.Gadget.settingsUI
=
"Settings.html"
;
就可以了。
当我们完成开发以后,就需要将小工具打包发布。标准的小工具安装包是以Gadget为扩展名的ZIP或者CAB压缩包。因此,我们只需要把开发文件夹里面的所有文件打包压缩即可。我们可以使用WinRAR制作ZIP压缩包,然后将扩展名修改为Gadget即可,这样,小工具的打包就完成了。
好了,介绍到这里,本篇文章就要结束了,有什么问题欢迎大家能够和我交流,共同提高。
原创文章,转载请注明出处,谢谢合作!
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请
点击举报
。
打开APP,阅读全文并永久保存
查看更多类似文章
猜你喜欢
类似文章
【热】
打开小程序,算一算2024你的财运
html5 移动端单页面布局
【前端学习分享】HTML+CSS京东商城静态页面
HTML布局排版手机上浏览的网页
基于HTML/CSS/JS微信公众号展示页面模板
JQGRID 基本用法及示例、换肤等
有了这些,Html前端开发so easy!
更多类似文章 >>
生活服务
热点新闻
留言交流
回顶部
联系我们
分享
收藏
点击这里,查看已保存的文章
导长图
关注
一键复制
下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!
联系客服
微信登录中...
请勿关闭此页面
先别划走!
送你5元优惠券,购买VIP限时立减!
5
元
优惠券
优惠券还有
10:00
过期
马上使用
×