《HTML5 canvas开发详解（第2版）》 - [美]Steve Fulton Jeff Fulton 著 - 人民邮电出版社 - 香港大書城

	登入帳戶　 \|　訂單查詢　 \|　購物車/收銀台(0)　\|　在線留言板　 \|　付款方式　 \|　運費計算　 \|　聯絡我們　 \|　幫助中心　\|　加入書簽
		會員登入新用戶登記

HOME

新書上架

暢銷書架

好書推介

2023年度TOP

臺灣用戶

品種：超過100萬種各類書籍/音像和精品，正品正價，放心網購，悭钱省心

服務：香港／台灣／澳門／海外

送貨：速遞／郵局／服務站

新書上架：簡體書繁體書
暢銷書架：簡體書繁體書
好書推介：簡體書繁體書

『簡體書』HTML5 canvas开发详解（第2版）

書城自編碼： 2444640
分類：簡體書→大陸圖書→計算機/網絡→程序設計
作者： [美]Steve Fulton Jeff Fulton 著
國際書號(ISBN)： 9787115351487
出版社：人民邮电出版社
出版日期： 2014-08-01
版次： 1 印次： 1
頁數/字數： 643/863
書度/開本： 16开釘裝：平装

售價：HK$ 306.8

我要買件

** 我創建的書架 **
未登入.

新書推薦：

《艺术图像学研究（第一辑）》
售價：HK$ 188.2

《摆脱强迫的人生（修订版）》
售價：HK$ 88.5

《知宋·宋代之司法》
售價：HK$ 99.7

《空间与政治》
售價：HK$ 87.4

《少年读三国（全套12册）》
售價：HK$ 490.6

《不完美之美：日本茶陶的审美变》
售價：HK$ 87.4

《现代化的迷途》
售價：HK$ 98.6

《钛经济》
售價：HK$ 77.3

建議一齊購買：

HK$ 254.8
《WebGL编程指南（可交互3D图形编程第一书国内第一社区、》

HK$ 153.4
《HTML5触摸界面设计与开发》

HK$ 335.4
《HTML5权威指南【迄今为止最全面详实的网页设计参考书】》

HK$ 262.4
《HTML5 Canvas核心技术：图形、动画与游戏开发（HT》

編輯推薦：

随着Canvas的持续升温，Flash的光芒迅速消退。本书是Canvas的畅销图书，它在上一版的基础上，通过讲解如何开发可交互式多媒体应用，引导读者学习HTML5 Canvas。通过本书，你将学到如何使用Canvas进行绘图、渲染文字、处理图像、创建动画，而这些是开发交互式Web游戏的必备知识。

本书针对Canvas和HTML5技术的最新变动进行了更新，其中包含了大量清晰、可重用的代码示例，无论你当前使用的是Flash、Silverlight，还是HTML与JavaScript，都可以通过本书中的这些代码示例迅速掌握HTML5 Canvas。

你也会从本书中发现，为什么HTML5代表着创新性Web开发的未来。

创建和修改2D绘图、文本和位图图像；

使用数学算法来移动对象并模拟物理交互效果；

整合、操作视频，并添加音频；

构建一个可用于创建多款游戏的基本框架；

使用位图和tile表格开发游戏图形动画；

针对移动设备：创建Web应用，并针对iOS设备进行修改；

使用Canvas开发3D

內容簡介：

《HTML5 canvas开发详解第2版》是HTML5 Canvas的畅销图书，在上一版的基础之上，针对Canvas和HTML5技术的最新变动进行了更新。《HTML5 canvas开发详解第2版》通过讲解如何开发交互式多媒体应用，引导读者学习HTML5 Canvas，其内容包括HTML5 Canvas简介、在Canvas上绘图、Canvas的文本API、Canvas图像、Canvas中的数学、物理知识以及由其实现的动画效果、整合操作视频和音频、使用位图和tile表格开发游戏、开发Web应用，以及WebGL和ElectroServer5的使用等内容。

《HTML5 canvas开发详解第2版》包含了大量清晰、可重用的代码示例，适合各个层级的Web开发人员阅读，而且无论他们当前使用的是Flash、Silverlight，还是HTML与JavaScript，都可以通过本书迅速掌握HTML5 Canvas。

關於作者：

Steve Fulton和Jeff Fulton各自在交互式娱乐开发领域均有16年以上的工作经验。Steve是Matel Toys公司数字游戏软件开发部的高级经理。Jeff是Producto工作室的CTO。他们两人还培养了一大批忠实粉丝，他们在8bitrocket.com上了解有关Flash、Sliverlight以及HTML5 Canvas的新闻、故事、博客和教程。

目　录

第1章　HTML5 Canvas简介　1

1.1　什么是HTML5　2

1.2　基础的HTML5页面　3

1.2.13

1.2.23

1.2.34

1.2.4　…　4

1.2.5　一个简单的HTML5页面　4

1.3　本书使用的基础HTML页面　5

1.3.1　

　5

1.3.26

1.4　文档对象模型DOM和Canvas　7

1.5　JavaScript和Canvas　7

JavaScript放置的位置及其理由　7

1.6　HTML5 Canvas版“Hello World！”　8

1.6.1　为Canvas封装JavaScript代码　9

1.6.2　将Canvas添加到HTML页面中　10

1.6.3　检测浏览器是否支持Canvas　10

1.6.4　获得2D环境　11

1.6.5　drawScreen函数　12

1.7　用console.log调试　15

1.8　2D环境及其当前状态　16

1.9　HTML5 Canvas对象　17

1.10　第二个示例：猜字母　18

1.10.1　游戏如何工作　18

1.10.2　“猜字母”游戏的变量　18

1.10.3　initGame函数　19

1.10.4　eventKeyPressed函数　20

1.10.5　drawScreen函数　21

1.10.6　导出Canvas到图像　23

1.10.7　最终的游戏代码　23

1.11　动画版本的Hello World　23

1.11.1 一些必要的属性　24

1.11.2　动画循环　25

1.11.3　使用globalAlpha属性设置alpha透明度　26

1.11.4　清除并显示背景　26

1.11.5　更新globalAlpha属性　26

1.11.6　绘制文字　27

1.11.7　HTML5 Canvas实现无障碍访问：子dom　29

1.12　内容预告　31

第2章　在Canvas上绘图　32

2.1　本章基本文件设置　32

2.2　基本矩形　33

2.3　Canvas状态　34

2.3.1　什么不属于状态　35

2.3.2　如何保存和恢复Canvas状态　35

2.4　使用路径创建线段　35

2.4.1　设置路径的开始和结束　35

2.4.2　动态绘图　36

2.4.3　高级线段绘制举例　37

2.5　高级路径方法　38

2.5.1　弧线　38

2.5.2　贝塞尔曲线　40

2.5.3　Canvas裁切区域　41

2.6　在画布上合成　42

2.7　简单画布变换　45

2.7.1　旋转和平移变换　45

2.7.2　缩放变换　50

2.7.3　缩放和旋转组合变换　51

2.8　用颜色和渐变填充对象　53

2.8.1　基本填充颜色设置　53

2.8.2　填充渐变形状　54

2.9　用图案填充形状　63

2.10　创建阴影　65

2.11　清除画布的方法　67

2.11.1　简单填充　67

2.11.2　重置画布的宽和高　67

2.11.3　重新设置画布的clearRect函数　67

2.12　检查一个点是否在当前路径　68

2.13　绘制一个焦点环　69

2.14　内容预告　69

第3章　HTML5 Canvas的文本API　70

3.1　显示基本文本　70

3.1.1　基本文本显示　71

3.1.2　在Text Arranger中处理基本文本　71

3.1.3　HTML表单和画布之间的通信　72

3.1.4　使用measureText　72

3.1.5　fillText和strokeText　74

3.2　设置文本字体　77

3.2.1　字体大小、磅重和样式基础　77

3.2.2　在文本编辑器中处理字体大小和外观　77

3.2.3　字体颜色　82

3.2.4　字体基线和对齐　84

3.2.5　Text Arranger 2.0版　87

3.3　文本和Canvas上下文　87

3.3.1　全局alpha和文本　87

3.3.2　全局阴影和文本　89

3.4　文本渐变和图案　91

3.4.1　文本线性渐变　91

3.4.2　文本径向渐变　93

3.4.3　文本图像图案　93

3.4.4　在Text Arranger中处理渐变和图案　94

3.5　宽度、高度、缩放和toDataURL回顾　97

3.5.1　动态调整画布尺寸　97

3.5.2　动态缩放画布　99

3.5.3　Canvas对象的toDataURL方法　100

3.6　最终版的Text Arranger　102

3.7　渐变动画　112

3.8　Canvas里文本的未来　115

3.8.1　CSS文本　116

3.8.2　文本的无障碍访问　116

3.9　内容预告　116

第4章　Canvas图像　117

4.1　本章的基本文件设置　117

4.2　图像基础　118

4.2.1　预下载图像　119

4.2.2　使用drawImage函数在画布上显示图像　119

4.2.3　调整画布上图像的大小　121

4.2.4　将部分图像复制到画布　122

4.3　简单的帧式动画　124

4.3.1　创建动画帧计数器　124

4.3.2　创建一个计时循环　124

4.3.3　改变拼板显示　125

4.4　高级帧式动画　126

4.4.1　检查拼图　126

4.4.2　创建动画数组　126

4.4.3　选择拼板显示　127

4.4.4　在拼板中循环　127

4.4.5　绘制拼板　127

4.4.6　在整个画布上移动图像　128

4.5　在图像上应用旋转变换　130

4.5.1　画布变换基础　130

4.5.2　为变换的图像设置动画　133

4.6　创建一个拼板网格　136

4.6.1　定义拼板地图　136

4.6.2　用Tiled创建拼板地图　136

4.6.3　在画布上显示地图　138

4.7　通过大图片深入了解绘图属性　141

4.7.1　为图像创建一个窗口　142

4.7.2　绘制图像窗口　142

4.7.3　修改图片容器的属性　143

4.7.4　缩放图像　144

4.7.5　平移图片　146

4.7.6　同时对图片进行移动和缩放　147

4.8　像素操作　148

4.8.1　操作画布像素的API　148

4.8.2　应用程序拼板印章　149

4.9　画布间的复制　156

4.10　使用像素检测物体碰撞　158

4.10.1　碰撞的对象　159

4.10.2　如何检测物体碰撞　160

4.10.3　检查两个物体的重叠部分　160

4.11　内容预告　165

第5章　数学、物理与动画　166

5.1　直线移动　166

5.1.1　两点间移动：线段距离　168

5.1.2　按照矢量移动　173

5.2　撞墙反弹　177

5.2.1　单个球反弹　178

5.2.2　多球撞墙反弹　181

5.2.3　可动态调整画布大小的多球碰撞反弹　187

5.2.4　多球反弹和碰撞　191

5.2.5　有摩擦力的多球碰撞反弹　203

5.3　曲线和圆弧运动　210

5.3.1　匀速圆周运动　210

5.3.2　简单螺旋运动　212

5.3.3　3次贝赛尔曲线运动　215

5.3.4　移动图像　220

5.3.5　创建立方贝塞尔曲线环　224

5.4　简单重力、弹力及摩擦力　228

5.4.1　简单重力　228

5.4.2　带反弹的简单重力　232

5.4.3　重力反弹及应用简单弹力　234

5.4.4　简单重力、弹力及摩擦力的综合　237

5.5　缓冲　240

5.5.1　缓冲结束飞船着陆　240

5.5.2　缓冲开始起飞　244

5.6　Box2D和画布　247

5.6.1　下载Box2dWeb　247

5.6.2　Box2D的工作原理　248

5.6.3　Box2D的Hello World　248

5.6.4　引入框架库　248

5.6.5　创建Box2dWeb世界　249

5.6.6　Box2dWeb中的单位　249

5.6.7　在Box2D中定义墙　250

5.6.8　创建小球　251

5.6.9　b2debugDraw渲染与Canvas渲染的对比　252

5.6.10　drawScreen函数　252

5.6.11　重温反弹球　255

5.6.12　转换为Canvas　256

5.7　与Box2D交互　258

5.7.1　创建箱子　259

5.7.2　渲染箱子　260

5.7.3　增加互动效果　260

5.7.4　创建箱子　261

5.7.5　处理小球　261

5.8　关于Box2D的更多内容　267

5.9　内容预告　267

第6章　在画布中融合HTML5视频　268

6.1　HTML5中对视频的支持　268

6.1.1　Theora + Vorbis = .ogg　268

6.1.2　H.264 + $$$ = .mp4　269

6.1.3　VP8 + Vorbis = .webm　269

6.1.4　结合3种视频格式　270

6.2　转换视频格式　270

6.3　HTML5视频的基本实现方法　271

6.3.1　普通的视频嵌入方法　272

6.3.2　添加视频控制器并设置播放方式　273

6.3.3　调整视频的宽度和高度　274

6.4　使用JavaScript预加载视频　279

6.5　视频与画布　282

6.5.1　在HTML5 Canvas上显示视频　282

6.5.2　HTML5的视频属性　288

6.6　在画布上使用视频的示例　292

6.6.1　使用currentTime属性创建视频事件　292

6.6.2　在画布上旋转视频　296

6.6.3　在画布上制作视频拼图　302

6.6.4　在画布上创建视频控制器　315

6.7　回顾动画效果之移动视频　324

6.8　使用JavaScript录制视频　329

6.8.1　网络RTC多媒体捕捉接口及数据流接口　329

6.8.2　例1：播放视频　329

6.8.3　例2：在Canvas上播放视频并截图　332

6.8.4　例3：创建视频拼图　334

6.9　移动端HTML5视频的支持状况　336

6.10　内容预告　336

第7章　使用音频　337

7.1　标签　337

7.2　音频格式　338

7.2.1　支持的音频格式　338

7.2.2　音频转换工具Audacity　338

7.2.3　示例：使用所有3种音频格式　339

7.3　Audio标签的属性、函数和事件　340

7.3.1　音频函数　340

7.3.2　重要的音频属性　341

7.3.3　重要的音频事件　341

7.3.4　加载并播放音频　342

7.3.5　在画布上显示属性信息　343

7.4　不使用Audio标签播放声音　346

7.4.1　使用JavaScript动态创建audio元素　346

7.4.2　查找支持的音频格式　347

7.4.3　播放声音　348

7.4.4　不使用标签　349

7.5　创建画布音频播放器　352

7.5.1　在Canvas中创建自定义用户控件　352

7.5.2　加载按钮资源　353

7.5.3　设置音频播放器的值　354

7.5.4　鼠标事件　355

7.5.5　滑动播放指示器　356

7.5.6　播放暂停按钮：检测单击并获取位置　357

7.5.7　循环不循环切换按钮　359

7.5.8　单击并拖动音量滑块　360

7.6　音频案例：太空掠夺者游戏　368

7.6.1　应用程序中不同的声音——事件声音　369

7.6.2　迭代　369

7.6.3　太空掠夺者游戏框架　369

7.6.4　第一次迭代：使用单个对象播放声音　378

7.6.5　第二次迭代：创建无限个动态声音对象　378

7.6.6　第三次迭代：创建一个声音池　380

7.6.7　第四次迭代：重用预加载的声音　382

7.7　Web Audio API　386

7.7.1　什么是Web Audio API　386

7.7.2　使用Web Audio API开发太空掠夺者　386

7.8　内容预告　389

第8章　Canvas游戏上　390

8.1　为什么用HTML5开发游戏　390

8.1.1　Canvas与Flash比较　390

8.1.2　Canvas提供的新特性　391

8.2　游戏的基本HTML5文件　391

8.3　游戏的设计　393

8.4　游戏图形：使用路径绘制　393

8.4.1　所需的资源　393

8.4.2　使用路径绘制游戏的主角　394

8.5　Canvas上的动画　396

8.5.1　游戏定时器循环　396

8.5.2　玩家飞船的状态变化　397

8.6　对游戏图形应用形状变换　399

Canvas的栈　399

8.7　游戏图形变换　401

8.7.1　使玩家飞船绕中心旋转　401

8.7.2　使用Alpha通道实现飞船淡入　403

8.8　游戏物体的物理算法和动画　405

8.8.1　移动玩家飞船　405

8.8.2　使用键盘控制玩家飞船　407

8.8.3　设置玩家飞船的最大速度　411

8.9　基本游戏框架　412

8.9.1　游戏状态机　412

8.9.2　更新渲染的重复周期　416

8.9.3　帧率计数器对象原型　419

8.10　整合所有元素　420

8.10.1　Geo Blaster游戏架构　420

8.10.2　Geo Blaster全局游戏变量　423

8.11　玩家对象　424

8.12　Geo Blaster游戏的算法　425

8.12.1　逻辑显示对象数组　425

8.12.2　级别难度控制　427

8.12.3　关卡和游戏结束　427

8.12.4　奖励玩家另外的飞船　429

8.12.5　应用碰撞检测　429

8.13　Geo Blaster Basic的完整源代码　431

8.14　陨石对象原型　432

8.15　在网格上使用A*算法查找最短路径　434

8.15.1　什么是A*算法　434

8.15.2　在更大的地图上使用A*　440

8.15.3　可穿过对角线的A*寻路算法　444

8.15.4　在带权值节点的地图里使用A*寻路算法　448

8.15.5　带权值及穿越对角线功能的A*寻路算法　452

8.15.6　让游戏角色顺着A*最短路径移动　459

8.15.7　坦克斜穿过墙壁　463

8.16　内容预告　472

第9章　Canvas游戏下　474

9.1　扩展版的Geo Blaster　474

9.1.1　Geo Blaster的图片表　475

9.1.2　渲染其他游戏对象　480

9.1.3　添加声音　485

9.1.4　用对象池管理对象实例　490

9.1.5　添加步长定时器　492

9.2　在运行时创建动态的图片表　494

9.3　简单的基于区块的游戏　498

9.3.1　微型坦克迷宫的介绍　499

9.3.2　游戏中用到的图片表　500

9.3.3　游戏区域　501

9.3.4　玩家　502

9.3.5　敌人　503

9.3.6　目标　504

9.3.7　爆炸效果　504

9.3.8　回合制游戏的流程和状态机　504

9.3.9　简单区块移动逻辑概述　508

9.3.10　渲染逻辑概述　510

9.3.11　自定义简单人工智能概述　511

9.3.12　微型坦克迷宫的完整游戏代码　512

9.4　为基于区块的游戏世界添加滚动效果　512

9.4.1　第一步：将用于绘制屏幕的区块放在一个图片表中　513

9.4.2　第二步：用二维数组表示游戏世界　513

9.4.3　第三步：将基于区块的世界绘制在画布上　513

9.4.4　粗糙滚动与精确滚动　514

9.4.5　camera对象　514

9.4.6　world对象　515

9.4.7　精确滚动时行和列的缓冲区　515

9.4.8　粗糙滚动的完整代码示例　521

9.4.9　精确滚动的完整代码示例　525

9.5　内容预告　530

第10章　在移动设备上开发　531

10.1　第一个应用程序　531

10.1.1　代码　532

10.1.2　查看BSBingo.html的代码　537

10.1.3　应用程序代码　540

10.1.4　针对浏览器修改游戏　541

10.1.5　在真实设备上测试游戏　544

10.2　触屏版的Retro Blaster游戏　546

10.3　将触屏版Retro Blaster移动化　548

10.3.1　开发全屏游戏　548

10.3.2　触摸移动事件　550

10.3.3　触屏版Retro Blaster的完整代码　555

10.4　超越Canvas　555

10.5　内容预告　555

第11章　进一步探索　557

11.1　使用WebGL实现3D效果　557

11.1.1　WebGL是什么　557

11.1.2　测试WebGL　558

11.1.3　学习更多WebGL的知识　558

11.1.4　WebGL应用示例　558

11.1.5　进一步探索WebGL　564

11.1.6　WebGL的JavaScript类库　564

11.2　使用ElectroServer 5实现多人应用程序　566

11.2.1　安装ElectroServer　566

11.2.2　套接字服务器程序的基础架构　568

11.2.3　ElectroServer程序的基础架构　569

11.2.4　使用ElectroServer创建聊天程序　570

11.2.5　在Google Chrome中测试应用程序　576

11.2.6　进一步探索ElectroServer　577

11.2.7　这只是冰山一角　579

11.3　为Canvas创建一个简单对象框架　579

11.3.1　创建一个支持拖放的应用程序　580

11.3.2　应用程序设计　580

11.4　Windows 8应用与HTML5 Canvas　592

11.5　HTML5.1与Canvas Level 2中有什么　596

11.5.1　HTML5.1 Canvas Context　596

11.5.2　Canvas Level2　597

11.6　总结　597

附录　完整代码列表　599

書城介紹　 \|　合作申請　\|　索要書目　 \|　新手入門　\|　聯絡方式　 \|　幫助中心　\|　找書說明　 \|　送貨方式　\|　付款方式	香港用户　 \|　台灣用户　\|　海外用户

	megBook.com.hk
Copyright © 2013 - 2024 （香港）大書城有限公司　 All Rights Reserved.