原作名: Building Android Apps with HTML, CSS, and JavaScript
作者: [美]Jonathan Stark
译者: 申林 / 邹宇
出版年: 2011-5
页数: 165
定价: 39.00元
ISBN: 9787121132377
作者: [美]Jonathan Stark
译者: 申林 / 邹宇
出版年: 2011-5
页数: 165
定价: 39.00元
ISBN: 9787121132377
内容简介 · · · · · ·
Jonatban Stark所著的《使用HTML、CSS和JavaScript开发Android程
序》是《Building Android Apps with HTML, CSS, and JavaScript》的
中文翻译版,主要介绍了如何使用现有的Web技术构建Android应用程序。
《使用HTML、CSS和JavaScript开发Android程序》的前3章介绍了如何
使用基本的HTML、CSS和JavaScript技术构建简单的网络程序;第4章介绍
了使用jQTouch技术使得网络程序与原生程序的体验相同;第5、6两章则讲
述了利用HTML5的客户端存储技术使网络程序实现本地存储,进而成为一个
离线应用;第7章利用PhoneGap项目使网络程序也可以操作Android硬件特
性;第8章则为开发者描绘了在Android应用程序市场上... (展开全部) Jonatban Stark所著的《使用HTML、CSS和JavaScript开发Android程
序》是《Building Android Apps with HTML, CSS, and JavaScript》的
中文翻译版,主要介绍了如何使用现有的Web技术构建Android应用程序。
《使用HTML、CSS和JavaScript开发Android程序》的前3章介绍了如何
使用基本的HTML、CSS和JavaScript技术构建简单的网络程序;第4章介绍
了使用jQTouch技术使得网络程序与原生程序的体验相同;第5、6两章则讲
述了利用HTML5的客户端存储技术使网络程序实现本地存储,进而成为一个
离线应用;第7章利用PhoneGap项目使网络程序也可以操作Android硬件特
性;第8章则为开发者描绘了在Android应用程序市场上发布应用程序的流
程和一些技巧。
本书最大的特点是深入浅出,每一部分都与实例结合,增强了可操作
性,更通俗易懂。无论对于希望通过Web技术构建移动应用的初学者,还是
对于希望进入Android领域的Web工程师,都是一本不错的参考书。
序》是《Building Android Apps with HTML, CSS, and JavaScript》的
中文翻译版,主要介绍了如何使用现有的Web技术构建Android应用程序。
《使用HTML、CSS和JavaScript开发Android程序》的前3章介绍了如何
使用基本的HTML、CSS和JavaScript技术构建简单的网络程序;第4章介绍
了使用jQTouch技术使得网络程序与原生程序的体验相同;第5、6两章则讲
述了利用HTML5的客户端存储技术使网络程序实现本地存储,进而成为一个
离线应用;第7章利用PhoneGap项目使网络程序也可以操作Android硬件特
性;第8章则为开发者描绘了在Android应用程序市场上... (展开全部) Jonatban Stark所著的《使用HTML、CSS和JavaScript开发Android程
序》是《Building Android Apps with HTML, CSS, and JavaScript》的
中文翻译版,主要介绍了如何使用现有的Web技术构建Android应用程序。
《使用HTML、CSS和JavaScript开发Android程序》的前3章介绍了如何
使用基本的HTML、CSS和JavaScript技术构建简单的网络程序;第4章介绍
了使用jQTouch技术使得网络程序与原生程序的体验相同;第5、6两章则讲
述了利用HTML5的客户端存储技术使网络程序实现本地存储,进而成为一个
离线应用;第7章利用PhoneGap项目使网络程序也可以操作Android硬件特
性;第8章则为开发者描绘了在Android应用程序市场上发布应用程序的流
程和一些技巧。
本书最大的特点是深入浅出,每一部分都与实例结合,增强了可操作
性,更通俗易懂。无论对于希望通过Web技术构建移动应用的初学者,还是
对于希望进入Android领域的Web工程师,都是一本不错的参考书。
作者简介 · · · · · ·
JonathancStark是一位移动应用程序开发顾问及研究如何将桌面数据发布到Web方面的专家.a他同时是3本关于Web应用程序编程书籍的作者.a
目录 · · · · · ·
第1章 入门指南 1
网络应用程序与原生应用程序的对比 1
什么是网络应用程序 1
什么是原生应用程序 1
优势和劣势 2
哪种方法最合适你 2
网络编程速成 3
html入门 3
css入门 5
javascript入门 9
第2章 基本样式 13
还没网站 13
准备工作 14
准备独立的android样式表 17
控制页面缩放 18
添加android css 20
添加android视觉效果 23
使用jquery添加基本行为 24
内容回顾 30
.第3章 高级样式 31
添加一点ajax 31
交通警察 31
添加一些内容 34
javascript的路由请求 34
简单的点缀 36
进度指示器(process indicator) 36
设置页面标题 39
处理长标题 41
自动回到顶部 42
只拦截本地链接 43
编写自己的返回按钮 44
在主屏幕上添加图标 50
内容回顾 50
第4章 动画 51
来自朋友的帮助 51
让主页滑动起来 51
添加dates面板 54
添加date面板 56
添加new entry面板 57
添加settings面板 60
将所有代码放在一起 61
自定义jqtouch 64
内容回顾 65
第5章 客户端数据存储 67
web storage 67
将用户设置保存到本地 68
将选中的数据保存到session storage中 71
web sql database 74
创建数据库 74
插入行 77
检索行及处理结果集 80
删除行 84
内容回顾 88
web database错误编码参考 88
第6章 走向离线 89
离线应用程序缓存基础 89
在线whitelist(白名单)和fallback(备选)选项 92
创建动态manifest文件 95
调试 101
javascript控制台(javascript console) 101
内容回顾 104
第7章 走向原生 105
phonegap简介 105
下载android sdk 107
下载phonegap 110
配置环境 111
创建android virtual device(android虚拟设备) 113
创建kilogap 114
在模拟器中安装kilogap 118
使用屏幕的全部高度 121
自定义程序图标 122
在手机上安装kilogap 123
使用javascript来控制手机 123
beep(蜂鸣)、vibrate(振动)及alert(提醒) 123
地理位置 127
加速度传感器 133
内容回顾 136
第8章 将应用程序提交到android应用程序市场上 137
准备程序的发行版本 137
移除调试代码 137
应用程序版本管理 138
应用程序签名管理 138
将程序上传到android应用程序市场 141
直接分发程序 143
延伸阅读 145
附录 147
索引 151
· · · · · · (收起)
网络应用程序与原生应用程序的对比 1
什么是网络应用程序 1
什么是原生应用程序 1
优势和劣势 2
哪种方法最合适你 2
网络编程速成 3
html入门 3
css入门 5
javascript入门 9
第2章 基本样式 13
还没网站 13
准备工作 14
准备独立的android样式表 17
控制页面缩放 18
添加android css 20
添加android视觉效果 23
使用jquery添加基本行为 24
内容回顾 30
.第3章 高级样式 31
添加一点ajax 31
交通警察 31
添加一些内容 34
javascript的路由请求 34
简单的点缀 36
进度指示器(process indicator) 36
设置页面标题 39
处理长标题 41
自动回到顶部 42
只拦截本地链接 43
编写自己的返回按钮 44
在主屏幕上添加图标 50
内容回顾 50
第4章 动画 51
来自朋友的帮助 51
让主页滑动起来 51
添加dates面板 54
添加date面板 56
添加new entry面板 57
添加settings面板 60
将所有代码放在一起 61
自定义jqtouch 64
内容回顾 65
第5章 客户端数据存储 67
web storage 67
将用户设置保存到本地 68
将选中的数据保存到session storage中 71
web sql database 74
创建数据库 74
插入行 77
检索行及处理结果集 80
删除行 84
内容回顾 88
web database错误编码参考 88
第6章 走向离线 89
离线应用程序缓存基础 89
在线whitelist(白名单)和fallback(备选)选项 92
创建动态manifest文件 95
调试 101
javascript控制台(javascript console) 101
内容回顾 104
第7章 走向原生 105
phonegap简介 105
下载android sdk 107
下载phonegap 110
配置环境 111
创建android virtual device(android虚拟设备) 113
创建kilogap 114
在模拟器中安装kilogap 118
使用屏幕的全部高度 121
自定义程序图标 122
在手机上安装kilogap 123
使用javascript来控制手机 123
beep(蜂鸣)、vibrate(振动)及alert(提醒) 123
地理位置 127
加速度传感器 133
内容回顾 136
第8章 将应用程序提交到android应用程序市场上 137
准备程序的发行版本 137
移除调试代码 137
应用程序版本管理 138
应用程序签名管理 138
将程序上传到android应用程序市场 141
直接分发程序 143
延伸阅读 145
附录 147
索引 151
· · · · · · (收起)
豆瓣成员常用的标签(共20个) · · · · · ·
按有用程度 按页码先后 最新笔记
-
第50页
在主屏幕上添加图标 /代码内容已省略/ 图标大小:56px × 56px 或者 60px × 60px 参考(http://developer.android.com/guide/practices/ui_guidelines/icon_design.html#launcherstructure) (更多)在主屏幕上添加图标<link rel="apple-touch-icon-precomposed" href="myCustomIcon.png" />
图标大小:56px × 56px 或者 60px × 60px 参考(http://developer.android.com/guide/practices/ui_guidelines/icon_design.html#launcherstructure) (收起)2011-10-14 09:59:36 回应
-
第45页
编写自己的返回按钮,处理访问历史记录 /代码内容已省略/ leftButton的CSS: /代码内容已省略/ 按钮被点击时,按钮样式改变的方法: 使用CSS设定新的样式,使用jQuery改变按钮的class 代码如下: /代码内容已省略/ /代码内容已省略/ (更多)编写自己的返回按钮,处理访问历史记录var hist = []; //保存历史记录的全局数组 var startUrl = 'index.html'; $(document).ready(function(){ loadPage(startUrl); }); function loadPage(url) { $('body').append('<div id="progress">Loading...</div>'); //正在加载提示 scrollTo(0,0); if (url == startUrl) { var element = ' #header ul'; } else { var element = ' #content'; } $('#container').load(url + element, function(){ var title = $('h2').html() || 'Hello!'; $('h1').html(title); //将内容中的h2升级为h1作为标题 $('h2').remove(); $('.leftButton').remove(); hist.unshift({'url':url, 'title':title}); //链接及标题加入数组 if (hist.length > 1) { //最后一个为当前页,所以>1 $('#header').append('<div class="leftButton">'+hist[1].title+'</div>'); $('#header .leftButton').click(function(){ var thisPage = hist.shift(); //从数组中读出值 var previousPage = hist.shift(); loadPage(previousPage.url); }); } $('#container a').click(function(e){ var url = e.target.href; if (url.match(/jonathanstark.com/)) { //只是对本站站内链接处理,正则表达式 e.preventDefault(); //阻止默认行为 loadPage(url); } }); $('#progress').remove(); }); }leftButton的CSS:#header div.leftButton { font-weight: bold; text-align: center; line-height: 28px; color: white; text-shadow: 0px -1px 1px rgba(0,0,0,0.6); position: absolute; top: 7px; left: 6px; max-width: 50px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-width: 0 8px 0 14px; -webkit-border-image: url(images/back_button.png) 0 8 0 14; -webkit-tap-highlight-color: rgba(0,0,0,0); //清除android默认的点击高亮效果 }按钮被点击时,按钮样式改变的方法:使用CSS设定新的样式,使用jQuery改变按钮的class代码如下:$('#header .leftButton').click(function(e){ $(e.target).addClass('clicked'); var thisPage = hist.shift(); var previousPage = hist.shift(); loadPage(lastUrl.url); });#header div.leftButton.clicked { -webkit-border-image: url(images/back_button_clicked.png) 0 8 0 14; }(收起)2011-10-14 09:48:57 回应
-
第41页
CSS处理长标题多余字符以...显示#header h1 { color: #222; font-size: 20px; font-weight: bold; margin: 0 auto; padding: 10px 0; text-align: center; text-shadow: 0px 1px 1px #fff; max-width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }滚到顶部简单jQuery代码scrollTo(0, 0);
(收起)2011-10-14 09:41:00 回应
-
第18页
第2章 基本样式 准备独立的android样式表 /代码内容已省略/ 控制页面缩放,让移动浏览器知道页面大小 /代码内容已省略/ 添加android视觉效果 1. 给header文字加1px向下白色阴影,背景css渐变 /代码内容已省略/ 2. 导航菜单加上圆角 /代码内容已省略/ (更多)第2章 基本样式准备独立的android样式表<link rel="stylesheet" type="text/css" href="android.css" media="only screen and (max-width: 480px)" /> <link rel="stylesheet" type="text/css" href="desktop.css" media="screen and (min-width: 481px)" />控制页面缩放,让移动浏览器知道页面大小<meta name="viewport" content="user-scalable=no, width=device-width" />
添加android视觉效果1. 给header文字加1px向下白色阴影,背景css渐变#header h1 a { text-shadow: 0px 1px 1px #fff; background-image: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#999)); }2. 导航菜单加上圆角#header ul li:first-child a { -webkit-border-top-left-radius: 8px; -webkit-border-top-right-radius: 8px; } #header ul li:last-child a { -webkit-border-bottom-left-radius: 8px; -webkit-border-bottom-right-radius: 8px; }(收起)2011-10-13 16:00:57 回应
-
第38页
第三章 高级样式 模拟真实网络性能 1. Mac OS X:降低网速到4KBps sudo ipfw pipe 1 config bw 4KByte/s sudo ipfw add 100 pipe 1 tcp from any to me 80 You should use your computer’s hostname or external IP address in the URL (for example, mycomputer.local rather than localhost). 测试完成后清除: sudo ipfw delete 100 2. Linux • http://linux-ip.net/articles/Traffic-Control-HOWTO/classles... (更多)第三章 高级样式模拟真实网络性能1. Mac OS X:降低网速到4KBpssudo ipfw pipe 1 config bw 4KByte/ssudo ipfw add 100 pipe 1 tcp from any to me 80You should use your computer’s hostname or external IP address in the URL (for example, mycomputer.local rather than localhost).测试完成后清除: sudo ipfw delete 1002. Linux• http://linux-ip.net/articles/Traffic-Control-HOWTO/classless-qdiscs.html • http://lartc.org/howto/lartc.ratelimit.single.html3. Windows:• http://blogs.msdn.com/b/wndp/archive/2006/06/30/653047.aspx • http://www.netlimiter.com4. 在模拟器上使用you can configure it to limit its speed using the -netspeed command-line option. For example, invoking the emulator with the arguments -netspeed edge will simulate real-world EDGE network speeds (118.4 kilobits per second upstream, 236.8 kilobits per second downstream). Run emulator -help-netspeed at the command line to see a list of all supported speeds. (收起)2011-10-14 09:35:45 回应
-
第41页
CSS处理长标题多余字符以...显示#header h1 { color: #222; font-size: 20px; font-weight: bold; margin: 0 auto; padding: 10px 0; text-align: center; text-shadow: 0px 1px 1px #fff; max-width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }滚到顶部简单jQuery代码scrollTo(0, 0);
(收起)2011-10-14 09:41:00 回应
-
第50页
在主屏幕上添加图标 /代码内容已省略/ 图标大小:56px × 56px 或者 60px × 60px 参考(http://developer.android.com/guide/practices/ui_guidelines/icon_design.html#launcherstructure) (更多)在主屏幕上添加图标<link rel="apple-touch-icon-precomposed" href="myCustomIcon.png" />
图标大小:56px × 56px 或者 60px × 60px 参考(http://developer.android.com/guide/practices/ui_guidelines/icon_design.html#launcherstructure) (收起)2011-10-14 09:59:36 回应
-
第45页
编写自己的返回按钮,处理访问历史记录 /代码内容已省略/ leftButton的CSS: /代码内容已省略/ 按钮被点击时,按钮样式改变的方法: 使用CSS设定新的样式,使用jQuery改变按钮的class 代码如下: /代码内容已省略/ /代码内容已省略/ (更多)编写自己的返回按钮,处理访问历史记录var hist = []; //保存历史记录的全局数组 var startUrl = 'index.html'; $(document).ready(function(){ loadPage(startUrl); }); function loadPage(url) { $('body').append('<div id="progress">Loading...</div>'); //正在加载提示 scrollTo(0,0); if (url == startUrl) { var element = ' #header ul'; } else { var element = ' #content'; } $('#container').load(url + element, function(){ var title = $('h2').html() || 'Hello!'; $('h1').html(title); //将内容中的h2升级为h1作为标题 $('h2').remove(); $('.leftButton').remove(); hist.unshift({'url':url, 'title':title}); //链接及标题加入数组 if (hist.length > 1) { //最后一个为当前页,所以>1 $('#header').append('<div class="leftButton">'+hist[1].title+'</div>'); $('#header .leftButton').click(function(){ var thisPage = hist.shift(); //从数组中读出值 var previousPage = hist.shift(); loadPage(previousPage.url); }); } $('#container a').click(function(e){ var url = e.target.href; if (url.match(/jonathanstark.com/)) { //只是对本站站内链接处理,正则表达式 e.preventDefault(); //阻止默认行为 loadPage(url); } }); $('#progress').remove(); }); }leftButton的CSS:#header div.leftButton { font-weight: bold; text-align: center; line-height: 28px; color: white; text-shadow: 0px -1px 1px rgba(0,0,0,0.6); position: absolute; top: 7px; left: 6px; max-width: 50px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-width: 0 8px 0 14px; -webkit-border-image: url(images/back_button.png) 0 8 0 14; -webkit-tap-highlight-color: rgba(0,0,0,0); //清除android默认的点击高亮效果 }按钮被点击时,按钮样式改变的方法:使用CSS设定新的样式,使用jQuery改变按钮的class代码如下:$('#header .leftButton').click(function(e){ $(e.target).addClass('clicked'); var thisPage = hist.shift(); var previousPage = hist.shift(); loadPage(lastUrl.url); });#header div.leftButton.clicked { -webkit-border-image: url(images/back_button_clicked.png) 0 8 0 14; }(收起)2011-10-14 09:48:57 回应
-
第41页
CSS处理长标题多余字符以...显示#header h1 { color: #222; font-size: 20px; font-weight: bold; margin: 0 auto; padding: 10px 0; text-align: center; text-shadow: 0px 1px 1px #fff; max-width: 160px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }滚到顶部简单jQuery代码scrollTo(0, 0);
(收起)2011-10-14 09:41:00 回应
书评 · · · · · · 我来评论这本书
热门评论 最新评论
Out of Control
-
- 六弦断有谁听 每天都会看到iphone上app store有几十个应用升级提醒,有itunes还好,等个几十分钟或几百分钟就都能更新成功,但时间长了就懒得去点。作为用户,没有直观的方式让我知道升级给我的好处,现在的产品可用,干嘛还要升级呢?于是乎,大家就像无视Windows各种提示框一样,开始习惯无视应用的升级提醒。再然后,开发者将......2011-06-29 5/5有用
对于有些WEB经验的开发者,建议不要买,性价比差
-
- acupofespresso 从京东买的,刚拿到书,书很薄,内容很简单, 基本适合完全没有经验的初学者算是入门教程吧, 价钱有点贵,性价比不怎么样。 对于有些WEB经验的开发者,建议不要买, 上一下jquerymobile,jtouch,PhoneGap 的网站, 看一下实例,很快就能搞定。......2011-10-21 2/2有用
"使用HTML、CSS和JavaScript开发Android程序"的论坛 · · · · · ·
| 书中的示例代码有问题 | 来自维克默多 | 2011-07-27 |
在哪儿买这本书? · · · · · ·
以下豆列推荐 · · · · · · (全部)
- 经典自虐计算机读书计划 (橘子橙子和柚子)
- 21世纪互联网英雄传说@京东:界面设计 (Leechael)
- 网站程序开发 (野鹤鹤)
- 惨烈的真实 (橘子橙子和柚子)
- 【系列专栏】梦寐以求的那些禽兽书! (亲爱的猥琐猪)
谁读这本书?
喜欢这本书的人关注的活动 · · · · · ·
订阅关于使用HTML、CSS和JavaScript开发Android程序的评论:
feed: rss 2.0




