应用HTML5 开发手机APP

7 提交 / 0个新回复
最新回复
应用HTML5 开发手机APP

  因为HTML5暂时无法短期内在PC普及,主要方向在使用高端浏览器的高端移动设备,所以可以用作开发Android系统的App。但只有Android2.2以上、iOS3.2以上均支持HTML5,两大平台有望全系列支持HTML5 ,HTML5可以用作离线应用的开发,离线应用就是把需要的资源先缓存到本地,下次再查看时无需联网。使用HTML5离线应用带来的好处:提供更快、更简便的服务,代码可高度重用,服务发布方便,HTML5主要应用:Web邮箱、Web RSS、Web地图等服务在无网络环境的使用,HTML5技术重点关注在动画、游戏方面,地理定位方面的应用正在崛起,HTML5还被用于改善用户体验。HTML5还是一种比较新的技术,我也在探索当中。
用html5开发android的app和开发安卓有什么不同呢?
      android和java都是手机系统,但是html5不支持在java系统内使用。所以你开发android的app和开发java的app是不同的。  
HTML5 开发APP需要一个开发框架和编译环境, PhoneGap是一个开源的开发框架,使用HTML5,CSS3和JavaScript来构建跨平台的的移动应用程序。
下面介绍PhoneGap环境的搭建,及第一个Web APP。
1、选择你使用的平台,PhoneGap支持6个平台的开发和编译:IOS,Android,WebOS(HP),BlackBerry,Symbian;
2、Eclipse 3.4+的 安装;
根据个人PC环境选择相应的版本,下载:Eclipse IDE for Java EE Developers x64
3、下载并安装Android SDK。最新版本:android-sdk_r20-windows;
4、下载并安装ADT Plugin,最新版本是:ADT-20.0.0.zip;
5、下载最新版本的PhoneGap并解压,我们将使用其中的Android目录;
6、编写第一个HTML5 App;
7、Hello, 欢迎来到我的网站!
在 “/assets/www”目录中新建文件“index.html”,并粘贴如下代码:
<!DOCTYPE HTML>
<html>
<head>
<title>我的网站</title>
<script type=”text/javascript” charset=”utf-8″ src=”phonegap.js”></script>
</head>
<body>
<h1>Hello ,欢迎来到我的网站!</h1>
</body>
</html>
    8、部署到模拟器右键单击项目节点选择Run As,然后点击Android Application。
Eclipse将要求你选择一个合适的AVD,如果没有设置的话,你需要创建一个AVD。
9、部署到设备
  通过设置手机USB debugging选项,并已将设备连接到电脑。(设置 > 应用程序 > 开发)。或者直接安装到手机查看效果。