源码下载 第1篇 基 础 篇 第1章 微信小程序基础 3 1.1 微信小程序介绍 3 1.1.1 什么是微信小程序 3 1.1.2 注册开发者账号 4 1.2 微信小程序开发工具的使用 5 1.2.1 获取微信小程序AppID 5 1.2.2 安装微信开发者工具 5 1.2.3 微信小程序发布流程 8 1.3 微信小程序框架文件 9 1.3.1 创建一个微信小程序项目 9 1.3.2 小程序的框架结构 10 1.3.3 Page( )注册页面 16 1.4 微信小程序视图 18 1.4.1 绑定数据 18 1.4.2 条件渲染 21 1.4.3 循环渲染 21 1.4.4 WXML模板 23 1.4.5 WXML视图中的事件 23 1.4.6 WXSS 25 1.4.7 Flex布局 29 1.5 微信小程序页面组件 33 1.5.1 视图容器组件 34 1.5.2 基础内容组件 41 1.5.3 表单组件 45 1.5.4 导航组件 53 1.5.5 媒体组件 54 1.5.6 map地图组件 59 1.5.7 canvas画布组件 60 1.6 使用canvas画图 60 1.6.1 canvas组件定义语法 60 1.6.2 坐标系统 61 1.6.3 颜色的表示方法 61 1.6.4 绘制直线 62 1.6.5 绘制矩形 65 1.6.6 绘制圆弧 66 1.6.7 绘制图像 67 1.6.8 输出文字 68 1.6.9 保存和恢复绘图状态 71 1.6.10 图形的变换 72 1.7 canvas动画实例 73 1.7.1 动画的概念及原理 73 1.7.2 游戏人物的跑步动画 75 第2章 JavaScript语法基础 77 2.1 JavaScript语言概述 77 2.1.1 JavaScript语言简介 77 2.1.2 运行JavaScript语言 77 2.2 基本语法 79 2.2.1 数据类型 79 2.2.2 常量和变量 80 2.2.3 注释 81 2.2.4 运算符和表达式 82 2.3 常用控制语句 86 2.3.1 选择结构语句 86 2.3.2 循环结构语句 91 2.4 函数 94 2.4.1 创建自定义函数 95 2.4.2 调用函数 95 2.4.3 变量的作用域 96 2.4.4 函数的返回值 97 2.4.5 JavaScript内置函数 97 第3章 JavaScript面向对象程序设计 99 3.1 面向对象程序设计思想简介 99 3.1.1 什么是对象 99 3.1.2 面向对象编程 100 3.2 JavaScript类的定义和实例化 101 3.2.1 类的定义 101 3.2.2 创建对象(类的实例化) 101 3.2.3 通过对象直接初始化创建对象 102 3.3 JavaScript访问和添加对象的属性和方法 103 3.3.1 访问对象的属性和方法 103 3.3.2 向对象添加属性和方法 105 3.4 继承 106 3.4.1 原型实现继承 107 3.4.2 构造函数实现继承 108 3.4.3 重新定义继承的方法 108 3.5 JavaScript内置对象 109 3.5.1 JavaScript的内置对象框架 109 3.5.2 基类Object 110 3.5.3 Date类 110 3.5.4 String类 112 3.5.5 Array类 113 3.5.6 Math对象 120 3.5.7 Object对象 121 3.6 ES6简介 123 3.6.1 变量相关 123 3.6.2 数据类型 123 3.6.3 对象 124 3.6.4 class类 125 3.6.5 模块功能 127 3.6.6 箭头函数 128 第2篇 开 发 篇 第4章 石头剪刀布游戏 133 4.1 石头剪刀布游戏功能介绍 133 4.2 程序设计的思路 133 4.2.1 控制剪刀、石头、布的快速切换 133 4.2.2 用户出拳 134 4.3 关键技术 134 4.3.1 事件的绑定 134 4.3.2 事件对象 136 4.3.3 事件对象数据参数的传递 137 4.4 程序设计的步骤 138 4.4.1 游戏布局 138 4.4.2 游戏脚本 141 第5章 井字棋游戏 144 5.1 井字棋游戏介绍 144 5.2 程序设计的思路 144 5.2.1 计算机智能下棋 144 5.2.2 井字棋输赢判断 145 5.3 关键技术 146 5.3.1 画布canvas 146 5.3.2 响应canvas组件事件 147 5.4 程序设计的步骤 148 5.4.1 选择对战模式页面 148 5.4.2 人人对战游戏页面 150 5.4.3 人机对战游戏页面 153 第6章 贪吃蛇游戏 156 6.1 贪吃蛇游戏介绍 156 6.2 程序设计的思路 156 6.3 关键技术 157 6.3.1 获取屏幕大小 157 6.3.2 小程序中this和that的使用 158 6.3.3 JavaScript数组操作 158 6.4 程序设计的步骤 159 6.4.1 index.wxml视图文件 159 6.4.2 index.js文件 159 第7章 看图猜成语游戏 165 7.1 看图猜成语游戏介绍 165 7.2 程序设计的思路 165 7.2.1 游戏素材 165 7.2.2 设计思路 166 7.3 关键技术 166 7.3.1 动态控制按钮组件的文字 166 7.3.2 通过条件渲染显示不同结果 167 7.4 程序设计的步骤 168 7.4.1 guess.wxml文件 168 7.4.2 guess.js文件 169 第8章 智力测试游戏--button版 172 8.1 智力测试游戏介绍 172 8.2 程序设计的思路 172 8.3 程序设计的步骤 173 8.3.1 exam.wxml文件 173 8.3.2 exam.js页面文件 174 8.3.3 exam.wxss样式文件 177 8.3.4 简单的结束页面 178 8.4 拓展知识 179 8.4.1 读取本地TXT文本 179 8.4.2 云文件存储题目 180 第9章 智力测试游戏--radio版 182 9.1 智力测试游戏介绍 182 9.2 程序设计的思路 182 9.3 关键技术 183 9.3.1 radio组件 183 9.3.2 列表渲染 184 9.3.3 checkbox组件 187 9.4 程序设计的步骤 189 9.4.1 radio.wxml文件 189 9.4.2 radio.js文件 189 第10章 连连看游戏 193 10.1 连连看游戏介绍 193 10.2 程序设计的思路 194 10.3 程序设计的步骤 205 第11章 推箱子游戏 210 11.1 推箱子游戏介绍 210 11.2 程序设计的思路 211 11.3 程序设计的步骤 213 11.3.1 游戏视图文件index.wxml 213 11.3.2 设计脚本index.js 214 第12章 五子棋游戏 225 12.1 五子棋游戏简介 225 12.2 五子棋设计思想 226 12.3 关键技术 226 12.3.1 判断输赢的算法 226 12.3.2 图形上色 228 12.3.3 调用模块代码 228 12.4 程序设计的步骤 229 12.4.1 游戏视图index.wxml 229 12.4.2 设计脚本index.js 229 12.5 人机五子棋游戏的开发 231 第13章 黑白棋游戏 241 13.1 黑白棋游戏介绍 241 13.2 黑白棋游戏设计的思路 242 13.2.1 棋子和棋盘 242 13.2.2 翻转对方的棋子 242 13.2.3 显示执棋方可落子位置 242 13.2.4 判断胜负功能 243 13.3 黑白棋游戏设计的步骤 243 13.3.1 游戏页面视图WXML 243 13.3.2 设计脚本index.js 243 第14章 拼图游戏 252 14.1 拼图游戏介绍 252 14.2 程序设计的思路 253 14.3 数字拼图游戏程序设计的步骤 254 14.3.1 游戏页面 254 14.3.2 pintu2.js文件 255 14.4 人物拼图游戏程序设计的步骤 257 14.5 图片组件拓展案例——翻牌游戏 257 14.5.1 游戏页面 258 14.5.2 查看排行榜页面 263 第15章 Flappy Bird游戏 265 15.1 Flappy Bird游戏介绍 265 15.2 Flappy Bird游戏设计的思路 266 15.2.1 游戏素材 266 15.2.2 游戏实现原理 266 15.2.3 游戏关键技术——碰撞检测 266 15.3 Flappy Bird游戏设计的步骤 270 15.3.1 设计Bird类(小鸟类) 270 15.3.2 设计Obstacle类(管道障碍物类) 270 15.3.3 设计FlappyBird类 271 15.3.4 主程序 275 15.3.5 游戏页面视图文件 276 第16章 摇一摇变脸游戏 278 16.1 摇一摇变脸游戏介绍 278 16.2 程序设计的思路 278 16.3 关键技术 279 16.3.1 小程序的加速度计API 279 16.3.2 加速度计API的简单应用 280 16.4 程序设计的步骤 281 16.4.1 游戏页面视图WXML 281 16.4.2 设计脚本index.js 281 第17章 抽奖小游戏 283 17.1 抽奖小游戏介绍 283 17.2 程序设计的思路 283 17.3 关键技术 284 17.3.1 动画实例 284 17.3.2 动画描述 285 17.3.3 动画导出 287 17.4 程序设计的步骤 288 17.4.1 游戏页面视图WXML 288 17.4.2 设计脚本index.js 289 第3篇 提 高 篇 第18章 原生微信小游戏开发基础 295 18.1 微信小游戏的发展史 295 18.2 什么是微信小游戏 295 18.3 微信小游戏开发过程 296 18.4 微信小游戏目录结构 298 18.5 微信小游戏开发API 298 18.6 微信小游戏动画和触摸事件 300 18.7 微信小游戏全局对象 302 18.8 微信小游戏Adapter(适配器) 303 第19章 微信小游戏——接宝石箱子游戏 304 19.1 接宝石箱子游戏介绍 304 19.2 程序设计的步骤 304 19.3 游戏功能改进 307 19.3.1 增加炸弹功能 307 19.3.2 增加游戏失败功能 308 19.3.3 增加背景音乐功能 309 第20章 Cocos Creator游戏开发基础 311 20.1 Cocos Creator介绍 311 20.1.1 Cocos Creator安装和启动 311 20.1.2 Cocos Creator发布到原生平台 312 20.2 第一个Hello项目 314 20.2.1 打开场景 314 20.2.2 预览场景 315 20.2.3 项目结构 316 20.3 Cocos Creator编辑器的使用 317 20.3.1 资源管理器 317 20.3.2 场景编辑器 318 20.3.3 层级管理器 320 20.3.4 属性检查器 321 20.3.5 控件库 323 20.4 Cocos Creator游戏开发入门 323 20.4.1 使用组件(控件) 324 20.4.2 事件响应 334 20.4.3 坐标系 336 20.4.4 节点属性和方法 338 20.4.5 动作 340 第21章 Cocos Creator开发实战——跳跳猫 342 21.1 跳跳猫小游戏介绍 342 21.2 创建项目 342 21.2.1 添加资源和游戏场景 343 21.2.2 创建游戏场景 344 21.2.3 添加游戏背景 345 21.2.4 添加游戏地面 345 21.3 添加游戏主角 346 21.3.1 添加游戏的主角小猫 346 21.3.2 编写主角脚本 346 21.3.3 实现主角跳跃和移动 348 21.3.4 实现主角移动控制 349 21.4 添加星星 352 21.4.1 制作Prefab(预制)资源星星 352 21.4.2 游戏主逻辑脚本 353 21.4.3 随机位置添加星星 355 21.4.4 主角碰触收集星星 356 21.5 游戏逻辑实现 357 21.5.1 显示游戏得分 357 21.5.2 添加得分逻辑 357 21.5.3 失败判定和重新开始 359 21.5.4 加入音效 360 21.6 发布到微信小游戏平台 362 第22章 Cocos Creator开发实战——俄罗斯方块 364 22.1 俄罗斯方块小游戏介绍 364 22.2 创建项目 365 22.2.1 添加资源 365 22.2.2 创建游戏场景 365 22.3 项目核心代码实现 367 22.3.1 游戏方块的七种形状 367 22.3.2 游戏逻辑实现 369 22.3.3 形状的旋转和移动 372 22.3.4 游戏方块消除 376 22.3.5 游戏失败逻辑 377 22.3.6 游戏暂停以及得分和音效 378 22.3.7 记录历史成绩功能 380 参考文献 381 ?? ?? ?? XII V