目录：http://blog.csdn.net/wide288/article/details/40298693
怎么开始开发基础的 widget
怎么使用 HTML 和 CSS 取得 widget 的形状
怎么使用 javascript 到你的 widget
从 html 开始
这里的项目是个天气地图。每个项目开始的点不一样，不过要先列出此 widget 的特性。
特性列表：
它应该有地图雷达，显示一块区域。
它应该有当前的临时地图。
它应该有昨天的临时地图。
它应该有明天的临时地图。
地图是可以调整大小的。
添加背景
<img src=”Default.png”>
创建 widget 结构的 CSS
body {
margin: 0;
}
#mapImage {
position: absolute;
top: 55px;
left: 16px;
}
.backgroundImage {
position: absolute;
top: 0px;
left: 0px;
}
引用方式
<style type=”text/css”>
@import “weathermaps.css”;
</style>
添加菜单
它怎么工作
用 JS 写 onclick 事件响应。改变图片引用内容。
建立 widget
创建 Info.plist
<?xml version=”1.0” encoding=”UTF-8”?>
<!DOCTYPE plist PUBLIC “-//Apple Computer//DTD PLIST 1.0//EN”
“http://www.apple.com/DTDs/PropertyList-1.0.dtd”>
<plist version=”1.0”>
<dict>
<key>AllowNetworkAccess</key>
<true/>
<key>CFBundleDisplayName</key>
<string>WeatherMaps</string>
<key>CFBundleIdentifier</key>
<string>com.apple.widget.weathermaps</string>
<key>CFBundleName</key>
<string>WeatherMaps</string>
<key>CFBundleShortVersionString</key>
<string>.04</string>
<key>CFBundleVersion</key>
<string>.04</string>
<key>CloseBoxInsetX</key>
<integer>12</integer>
<key>CloseBoxInsetY</key>
<integer>12</integer>
<key>MainHTML</key>
<string>weathermaps.html</string>
</dict>
</plist>
创建项目的图标
Icon.png
改文件夹名称
双击安装。
确认它是工作的，安装后测试一下。