首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

HTML5 App实战(五):指南针

2013-10-08 
HTML5 App实战(5):指南针指南针是一个很有意思的应用程序,这里用“画app吧”开发一个简单的指南针应用程序吧

HTML5 App实战(5):指南针

指南针是一个很有意思的应用程序,这里用“画app吧”开发一个简单的指南针应用程序吧:

1.用支持HTML5的浏览器(Chrome/Firefox/Safari/IE9+)打开http://www.drawapp8.com/appedit.php。

HTML5 App实战(五):指南针

选择”新建“创建一个新的app,缺省情况下的设备是iphone5(或者其它设备)。

2.现在我们把设备切换成FirefoxOS的手机。双击设备打开设备的属性对话框,在设备列表中选择firefoxOS的手机。

HTML5 App实战(五):指南针

3.选择“确定”之后,我们就可以看到iphone5变成了FirefoxOS手机了。我们不需要上面的toolbar,把它删除掉。

HTML5 App实战(五):指南针

4.向窗口上放置一个指南针控件,然后设置窗口的背景颜色:

HTML5 App实战(五):指南针

5.界面很简单,现在开始编写代码:

在窗口的onOpen事件里,注册传感器事件:

var = thisvar = "ui-gauge-pointer-compass"trueif windowwindow"deviceorientation"functionvar = 360 - falseelse 60);}

7.差不多了,我们点击设备上的"预览"按钮,看看实际的运行效果。

8.我们通过菜单"文件“/”在设备上预览“生成一个URL,在实际的设备上看看效果如何。

9.最后当然是生成安装包了,菜单“云编译”/"编译FirefoxOS安装包"。

这里有我们做好的,

你也可以直接编辑

也可以在线运行

1楼yumengtao前天 16:25
画APP吧这个成熟不?
Re: absurd13小时前
回复yumengtaon用了"画app吧"写了十几个app,"画app吧"目前用作快速原型开发,工具类的app和网格类游戏(拼图,连连看,扫雷,推箱子,俄罗斯方块和各类棋类)的开发方面算是比较成熟了。

热点排行