2）3次上机占比20%。

3）5次课堂考勤占比20%。

2

教学重点、难点

重点：

1、HTML基础，包括各种常用标签的使用

2、CSS样式表的基本语法

3、Java基本语法、常用内置对象、文档对象

4、JQuery常用对象和方法的使用

5、Canvas API画图

难点：

1、前端运行错误的调试

2、HTML5流行的游戏引擎lufylegend的学习

3

课程章节主要内容及学时分配

4

教材名称及主要参考书

推荐教材：

夏敏捷. HTML5网页游戏设计从基础到开发[M].北京：清华大学出版社,2023

教学参考书：

冷亚洪,黄炜,宋宇 . 交互式Web前端开发实践[M].北京：清华大学出版社,2017

✦

参考书籍

✦

HTML5网页游戏设计从基础到开发（第2版·微课视频版）

作者：夏敏捷、尚展垒

定价：69.90元

ISBN：9787302629771

编辑推荐：11个游戏实战案例，提供视频、源代码、教学课件、教学大纲、扩展案例

技术背景

HTML5是 HyperText Markup Language 5 的缩写。HTML5 技术结合了 HTML4.01的相关标准并对其进行革新，符合现代网络发展要求。HTML5是互联网的下一代标准，是构建和呈现互联网内容的一种语言方式，被认为是互联网的核心技术之一。HTML5在2014年10月由万维网联盟（W3C）完成标准制定，仍处于完善之中。然而HTML5已经引起了业内的广泛兴趣，Chrome、Firefox、Opera、Safari等主流浏览器都已经支持HTML5技术，新Edge浏览器率先实现100%支持HTML5。

本书作者长期从事HTML5网页设计教学与应用开发，在长期的工作、学习中，积累了丰富经验和教训，能够了解在学习编程的时候需要什么样的书才能提高HTML5开发能力，以最少的时间投入得到最快的实际应用。

本书主要内容

本书分为基础篇和实战篇。

基础篇包括第1~6章，主要讲解HTML5的基础知识和相关新技术，如Java、Canvas API画图、CSS3和jQuery及其使用技巧；

实战篇包括第7~17章，综合应用前面技术，开发经典的大家耳熟能详的游戏，如人物拼图、扑克翻牌、推箱子、五子棋、黑白棋、俄罗斯方块、贪吃蛇、雷电飞机射击、Flappy Bird、中国象棋。通过本书读者将学会如何利用HTML5和Java、CSS3制作交互式游戏、平台类游戏，学会网页游戏设计。

本书特点

(1)内容全面，代码通用。本书所有案例的源代码通用性强，便于读者直接应用于大部分游戏的开发。

(2)理论夯实，案例丰富。每款游戏案例均提供详细的设计思路、关键技术分析以及具体的解决步骤方案，案例实用性强。

配套资源

为便于教与学，本书配有微课视频(420分钟)、源代码、教学课件、教学大纲、扩展案例。

目录

向上滑动阅览

第1部分基础篇

第1章HTML5概述

1．1HTML基础

1．1．1HTML的定义

1．1．2HTML的历史

1．2HTML基础

1．2．1HTML基础知识

1．2．2HTML基本标记

1．3HTML5的新特性

1．3．1简化的文档类型和字符集

1．3．2HTML5的新结构

1．3．3支持本地存储

1．3．4全新的表单设计

1．3．5强大的绘图功能

1．3．6获取地理位置信息

1．3．7支持多媒体功能

1．3．8支持多线程

第2章Java语法基础

2．1Java语言

2．1．1Java语言概述

2．1．2运行Java语言

2．2基本语法

2．2．1数据类型

2．2．2常量和变量

2．2．3注释

2．2．4运算符和表达式

2．3常用控制语句

2．3．1选择结构语句

2．3．2循环结构语句

2．4函数

2．4．1创建自定义函数

2．4．2调用函数

2．4．3变量的作用域

2．4．4函数的返回值

2．4．5定义函数库

2．4．6Java内置函数

2．5调试Java程序的方法

2．5．1定位Java程序中的错误

2．5．2开发者工具调试代码

2．5．3Visual Studio Code中调试Java代码

第3章Java事件处理

3．1Java事件的基本概念

3．1．1事件类型

3．1．2Java处理事件的基本机制

3．2Java绑定事件的方法

3．3Java事件的event对象

3．3．1获取event对象

3．3．2Java获取鼠标坐标

3．3．3Java获取事件源

3．4Java取消浏览器默认动作

第4章Java面向对象程序设计

4．1面向对象程序设计思想简介

4．1．1对象的概念

4．1．2面向对象编程

4．2Java类的定义和实例化

4．2．1类的定义

4．2．2创建对象(类的实例化)

4．2．3通过对象直接初始化创建对象

4．3Java访问和添加对象的属性和方法

4．3．1访问对象的属性和方法

4．3．2向对象添加属性和方法

4．4继承

4．4．1原型实现继承

4．4．2构造函数实现继承

4．4．3重新定义继承的方法

4．5Java内置对象

4．5．1Java的内置对象框架

4．5．2基类Object

4．5．3Date类

4．5．4String类

4．5．5Array类

4．5．6Math对象

4．5．7Object对象

4．6HTML DOM编程

4．6．1HTML DOM框架

4．6．2Document 对象

4．6．3Node(节点)对象

4．6．4NodeList对象

4．7ES6简介

4．7．1变量相关

4．7．2数据类型

4．7．3对象

4．7．4class类

4．7．5箭头函数

第5章使用Canvas画图

5．1Canvas元素

5．1．1Canvas元素的定义语法

5．1．2使用Java获取网页中的Canvas对象

5．2坐标与颜色

5．2．1坐标系统

5．2．2颜色的表示方法

5．3绘制图形

5．3．1绘制直线

5．3．2绘制矩形

5．3．3绘制圆弧

5．4描边和填充

5．4．1描边

5．4．2填充图形内部

5．4．3渐变颜色

5．4．4透明颜色

5．5绘制图像与文字

5．5．1绘制图像

5．5．2组合图形

5．5．3输出文字

5．6图形的操作

5．6．1保存和恢复绘图状态

5．6．2图形的变换

5．7HTML5 Canvas动画实例

5．7．1动画的概念及原理

5．7．2游戏人物的跑步动画

5．7．3雪花飘落动画

第6章CSS3和jQuery动画

6．1CSS3语法基础

6．1．1CSS基本语句

6．1．2在HTML文档中应用CSS样式

6．1．3CSS 选择器

6．2CSS3动画

6．2．1变形

6．2．2过渡变换

6．2．3动画

6．3jQuery基础

6．3．1认识jQuery语法

6．3．2元素的属性与文本内容控制

6．3．3CSS样式控制

6．3．4元素的操作

6．3．5事件和Event对象

6．4jQuery动画

6．4．1显示和隐藏HTML元素

6．4．2淡入淡出效果

6．4．3滑动效果

6．4．4自定义动画

6．4．5动画队列

第2部分实战篇

第7章人物拼图游戏

7．1人物拼图游戏介绍

7．2人物拼图游戏设计的思路

7．3人物拼图游戏设计的步骤

第8章扑克翻牌游戏

8．1扑克翻牌游戏介绍

8．2扑克翻牌游戏设计的思路

8．2．1HTML5倒计时功能

8．2．2扑克牌的显示与隐藏

8．2．3扑克牌的删除

8．2．4添加删除类别Class

8．3扑克翻牌游戏设计的步骤

8．3．1设计CSS(matchgame．css)

8．3．2游戏页面index．html

8．3．3设计脚本(matchgame．js)

第9章推箱子游戏

9．1推箱子游戏介绍

9．2推箱子游戏设计的思路

9．3推箱子游戏设计的步骤

9．3．1游戏页面pushbox．html

9．3．2设计脚本(pushbox1．js)

第10章五子棋游戏

10．1五子棋游戏介绍

10．2五子棋游戏设计的思路

10．3关键技术

10．3．1判断输赢的算法

10．3．2图形上色

10．4五子棋游戏设计的步骤

10．4．1游戏页面five．html

10．4．2设计脚本(Main．js)

10．5人机五子棋游戏的开发

第11章黑白棋游戏

11．1黑白棋游戏介绍

11．2黑白棋游戏设计的思路

11．2．1棋子和棋盘

11．2．2翻转对方的棋子

11．2．3显示执棋方可落子位置

11．2．4判断胜负的功能

11．3关键技术

11．3．1Canvas对象支持的Java的鼠标事件

11．3．2获取鼠标在Canvas对象上的坐标

11．4黑白棋游戏设计的步骤

11．4．1游戏页面index.html

11．4．2设计脚本(Main．js)

第12章俄罗斯方块游戏

12．1俄罗斯方块游戏介绍

12．2俄罗斯方块游戏设计的思路

12．2．1俄罗斯方块形状设计

12．2．2俄罗斯方块游戏面板屏幕

12．2．3定位和旋转形状

12．3俄罗斯方块游戏设计的步骤

12．3．1游戏页面index.html

12．3．2设计脚本

第13章贪吃蛇游戏

13．1贪吃蛇游戏介绍

13．2贪吃蛇游戏设计的思路

13．3贪吃蛇游戏设计的步骤

13．3．1游戏页面index.html

13．3．2设计脚本

第14章雷电飞机射击游戏

14．1雷电飞机射击游戏介绍

14．2雷电飞机射击游戏设计的思路

14．2．1游戏素材

14．2．2地图滚动的原理实现

14．2．3飞机和子弹的实现

14．3游戏关键技术——碰撞检测

14．3．1矩形碰撞

14．3．2圆形碰撞

14．3．3像素碰撞

14．3．4Image对象

14．4雷电飞机射击游戏设计的步骤

14．4．1设计子弹类

14．4．2设计飞机类

14．4．3爆炸类

14．4．4设计主程序

14．4．5游戏页面plan3.html

第15章Flappy Bird游戏

15．1Flappy Bird游戏介绍

15．2Flappy Bird游戏设计的思路

15．2．1游戏素材

15．2．2游戏实现的原理

15．3Flappy Bird游戏设计的步骤

15．3．1设计Bird类(小鸟类)

15．3．2设计Obstacle类(管道障碍物类)

15．3．3设计FlappyBird类

15．3．4主程序

15．3．5游戏页面index.html

第16章中国象棋游戏

16．1中国象棋游戏介绍

16．2中国象棋游戏设计的思路

16．2．1棋盘表示

16．2．2棋子表示

16．2．3走棋规则

16．2．4坐标转换

16．3中国象棋游戏设计的步骤

16．3．1设计棋子类(Chess．js)

16．3．2设计游戏逻辑(ChessGame．js)

16．3．3游戏页面index.html

第17章基于lufylegend游戏引擎开发

17．1lufylegend游戏引擎介绍

17．1．1游戏引擎原理

17．1．2引入lufylegend游戏引擎

17．1．3利用引擎初始化游戏

17．2lufylegend游戏引擎基本功能

17．2．1图片的加载与显示

17．2．2图层

17．2．3利用图层实现游戏中的卷轴

17．2．4使用LGraphics对象绘图

17．2．5使用LTextField显示文字

17．2．6LGlobal全局类

17．2．7LLoadManage加载文件

17．2．8事件处理

17．2．9动画的实现

17．3lufylegend游戏引擎案例——接水果游戏

参考文献

在公众号书圈后台回复【9787302629771】，下载本书配套的教学资源

单击页面下方【阅读原文】，订阅【教学大纲】栏目