计算机类教材 > 算法与程序设计
微信小程序开发教程(微课版)
书号:9787113279004 套系名称:普通高等院校计算机基础教育“十四五”规划教材
作者:夏敏捷 潘惠勇 宋宝卫 出版日期:2021-06-01
定价:55.00 页码 / 开本: /16
策划编辑:韩从付 责任编辑:贾星 彭立辉
适用专业:计算机基础教育 适用层次:高等教育
最新印刷时间:2025-02-08
资源下载
教学课件
教学素材(暂无)
习题答案(暂无)
教学案例(暂无)
教学设计(暂无)
教学视频(暂无)
内容简介
前言
目录
作者介绍
图书特色
本书以开发案例为导向,通过具体案例讲解微信小程序开发,了解微信小程序的设计原理。全书共分两篇:基础篇对微信小程序的框架文件、微信小程序逻辑层和视图层、微信小程序组件进行详细介绍,包括 JavaScript编程语言基础、WXML、WXSS和组件的使用,重点学习与游戏绘图相关的 canvas画布组件;提高篇讲解微信小程序提供的 API、云开发功能和微信小游戏开发,进一步提高微信小程序的应用能力。通过本书的学习,不仅可使读者掌握关键的知识点,更重要的是读者将学会微信小程序编程技术和技巧。书中不仅列出了完整的代码,同时对所有的源代码进行了非常详细的解释,做到通俗易懂,图文并茂。 本书适合作为普通高等院校计算机相关专业的教材,也可作为程序设计人员和微信小程序编程爱好者的参考用书。 ?
微信小程序是一种不需要下载安装即可使用的应用程序,用户只要“扫一扫”或“搜一搜”即可打开该程序。相对于 App,微信小程序游戏具有随用随点、随走随退、无须下载、不占内存等特点,用户可以在各种各样的环境中拿起手机,忙里偷闲地满足放松与娱乐需求。数据显示,大量用户已在日常生活中逐步养成了使用微信小程序的习惯,其中小游戏活跃度与阅读留存量均大幅度提升。小游戏数量在所有微信小程序中虽然占比不高,但依然是用户访问最多的品类。 本书作者长期从事程序设计语言教学与应用开发,在长期的工作学习中,积累了丰富的经验,能够了解读者在学习编程时需要什么样的书才能提高微信小程序开发能力,以最少的时间投入得到最多的实际应用。 本书内容分成基础篇和提高篇: 基础篇包括第 1~5章,主要讲解微信小程序开发工具的使用,对微信小程序的框架文件、微信小程序逻辑层和视图层、微信小程序组件进行了详细介绍,包括 JavaScript编程语言基础、 WXML、WXSS和组件的使用,尤其重点讲解了与游戏绘图相关 canvas画布组件的使用等。 提高篇包括第 6~8章,讲解微信提供的 API和云开发功能,以及原生微信小游戏的开发方式,并实现接宝石箱子游戏,可进一步提高读者微信小程序的开发能力。 需要说明的是,学习微信小程序编程是一个实践的过程,而不仅仅是看书、看资料的过程,亲自动手编写、调试程序才是至关重要的。通过实际的编程和积极的思考,读者可以很快地掌握编程知识及许多宝贵的编程经验,这种编程经验对开发者不可或缺。 本书由夏敏捷(中原工学院)主持编写,宋宝卫(郑州轻工业大学)编写第 1~6章,潘惠勇(中原工学院)编写第 7章,其余章节由夏敏捷编写。张锦歌(河南工业大学)参与了附录 A的编写工作。在本书的编写过程中,为确保内容的正确性,参阅了很多资料,并得到郑秋生教授的支持,在此谨向他们表示衷心的感谢。 由于时间仓促,编者水平有限,书中难免存在疏漏与不妥之处,敬请广大读者批评指正。作者电子邮件地址: xmj@zut.edu.cn。 夏敏捷 2020年 12月?
基 础 篇 第1章 微信小程序基础............................................................................2 1.1 微信小程序介绍 .................................................................................................................2 1.1.1 微信小程序的概念 ....................................................................................................2 1.1.2 注册开发者账号 ........................................................................................................3 1.2 微信小程序开发工具的使用 .............................................................................................4 1.2.1 获取微信小程序AppID ............................................................................................4 1.2.2 安装微信开发者工具 ................................................................................................4 1.2.3 微信小程序发布流程 ................................................................................................7 1.3 创建一个微信小程序项目 .................................................................................................8 习题... .........................................................................................................................................10 第2章 JavaScript语法基础 .................................................................11 2.1 JavaScript语言概述 .........................................................................................................11 2.1.1 JavaScript语言简介 .................................................................................................11 2.1.2 运行JavaScript语言 ................................................................................................11 2.2 基本语法 ..........................................................................................................................13 2.2.1 数据类型 .................................................................................................................13 2.2.2 常量和变量 ..............................................................................................................14 2.2.3 注释 ..........................................................................................................................15 2.2.4 运算符和表达式 ......................................................................................................16 2.3 常用控制语句 ...................................................................................................................19 2.3.1 选择结构语句 .........................................................................................................19 2.3.2 循环结构语句 ..........................................................................................................23 2.4 函数 ..................................................................................................................................26 2.4.1 创建自定义函数 ......................................................................................................26 2.4.2 调用函数 .................................................................................................................27 2.4.3 变量的作用域 ..........................................................................................................28 2.4.4 函数的返回值 ..........................................................................................................28 2.4.5 JavaScript内置函数 .................................................................................................29 2.5 JavaScript面向对象程序设计 ..........................................................................................30 2.5.1 对象的概念 ..............................................................................................................30 2.5.2 面向对象编程 ..........................................................................................................31 2.5.3 JavaScript类的定义和实例化 .................................................................................32 2.5.4 JavaScript访问对象的属性和方法 .........................................................................34 2.6 JavaScript内置对象 ..........................................................................................................35 2.6.1 JavaScript的内置对象框架 .....................................................................................35 2.6.2 基类Object ...............................................................................................................36 2.6.3 Date类 ......................................................................................................................37 2.6.4 String类 ....................................................................................................................38 2.6.5 Array类 ....................................................................................................................39 2.6.6 Math对象 .................................................................................................................45 2.7 ES6简介 ............................................................................................................................47 2.7.1 变量相关 ..................................................................................................................47 2.7.2 数据类型 ..................................................................................................................47 2.7.3 对象 ..........................................................................................................................48 2.7.4 类 ..............................................................................................................................48 2.7.5 模块功能 ..................................................................................................................50 2.7.6 箭头函数 ..................................................................................................................52 习题... .........................................................................................................................................53 第3章 微信小程序框架 .........................................................................55 3.1 微信小程序框架文件 .......................................................................................................55 3.1.1 小程序的框架结构 ..................................................................................................55 3.1.2 Page()注册页面 .......................................................................................................60 3.2 微信小程序视图层 ...........................................................................................................62 3.2.1 绑定数据 ..................................................................................................................62 3.2.2 条件渲染 ..................................................................................................................64 3.2.3 循环渲染 ..................................................................................................................65 3.2.4 WXML模板 .............................................................................................................67 目录 3.2.5 WXSS ......................................................................................................................68 3.2.6 Flex布局 ..................................................................................................................72 3.3 微信小程序逻辑层 ...........................................................................................................77 3.3.1 事件 ..........................................................................................................................78 3.3.2 事件对象 ..................................................................................................................80 3.3.3 事件对象数据参数的传递 ......................................................................................80 3.3.4 页面事件处理函数 ..................................................................................................82 习题... .........................................................................................................................................82 第4章 微信小程序常用组件 ...................................................................83 4.1 微信小程序组件概述 .......................................................................................................83 4.2 视图容器组件 ...................................................................................................................84 4.3 基础内容组件 ...................................................................................................................90 4.4 表单组件 ...........................................................................................................................94 4.5 导航组件 .........................................................................................................................102 4.6 媒体组件和地图组件 .....................................................................................................104 4.6.1 媒体组件 ................................................................................................................104 4.6.2 地图组件 ................................................................................................................108 4.7 拓展案例——翻牌游戏 .................................................................................................109 4.7.1 游戏页面 ................................................................................................................110 4.7.2 查看排行榜页面 ....................................................................................................115 4.8 拓展案例——智力测试程序 .........................................................................................115 4.8.1 单选按钮(radio) ...............................................................................................116 4.8.2 列表渲染 ................................................................................................................117 4.8.3 checkbox组件 ........................................................................................................120 4.8.4 程序设计的步骤 ....................................................................................................121 4.8.5 拓展知识——读取本地TXT文本........................................................................125 习题... .......................................................................................................................................126 第5章 微信小程序canvas画布组件应用................................................ 127 5.1 canvas画布组件 ..............................................................................................................127 5.1.1 画布canvas .............................................................................................................127 5.1.2 响应canvas组件事件 .............................................................................................128 5.2 使用canvas画图 ..............................................................................................................130 5.2.1 canvas组件定义语法 .............................................................................................130 5.2.2 坐标系统 ...............................................................................................................130 5.2.3 颜色的表示方法 ....................................................................................................131 5.2.4 绘制直线 ................................................................................................................132 5.2.5 绘制矩形 ................................................................................................................134 5.2.6 绘制圆弧 ...............................................................................................................135 5.2.7 绘制图像 ................................................................................................................136 5.2.8 输出文字 ...............................................................................................................138 5.2.9 保存和恢复绘图状态 ...........................................................................................139 5.2.10 图形的变换 .........................................................................................................140 5.3 canvas动画实例 .............................................................................................................142 5.3.1 动画的概念及原理 ................................................................................................142 5.3.2 游戏人物的跑步动画 ............................................................................................143 5.4 拓展案例——贪吃蛇游戏 .............................................................................................144 5.4.1 程序设计的思路 ....................................................................................................144 5.4.2 获取屏幕大小 ........................................................................................................145 5.4.3 小程序中this和that的使用 ....................................................................................146 5.4.4 JavaScript数组操作 ...............................................................................................146 5.4.5 程序设计步骤 ........................................................................................................147 习题... .......................................................................................................................................152 提 高 篇 第 6 章 微信小程序常用API ................................................................ 154 6.1 加速度计API——摇一摇变脸游戏 ...............................................................................154 6.1.1 小程序的加速度计API .........................................................................................155 6.1.2 加速度计API的简单应用 .....................................................................................156 6.1.3 摇一摇变脸小程序设计步骤 ................................................................................156 6.2 位置API——签到测距小程序 .......................................................................................158 6.2.1 获取设备的位置 ....................................................................................................158 6.2.2 选择位置 ................................................................................................................159 6.2.3 签到测距小程序设计步骤 ....................................................................................160 6.3 动画API——抽奖小程序 ...............................................................................................163 6.3.1 动画实例 ................................................................................................................164 6.3.2 动画描述 ................................................................................................................164 6.3.3 动画导出 ................................................................................................................166 目录 6.3.4 页面视图WXML...................................................................................................167 6.3.5 设计脚本(index.js) ...........................................................................................168 6.4 数据缓存API——存储登录账号信息 ...........................................................................171 6.4.1 数据缓存API .........................................................................................................171 6.4.2 数据存储 ................................................................................................................172 6.4.3 获取数据 ................................................................................................................172 6.4.4 获取缓存信息 ........................................................................................................173 6.4.5 删除数据 ................................................................................................................173 6.4.6 清空数据 ................................................................................................................174 6.4.7 存储登录账号小程序设计步骤 ............................................................................174 6.5 图片操作API——使用相册选择图片 ...........................................................................176 6.5.1 选择图片 ................................................................................................................177 6.5.2 获取图片信息 ........................................................................................................177 6.5.3 保存图片到系统相册 ............................................................................................178 6.5.4 使用相册选择图片小程序设计步骤 ....................................................................178 6.6 网络请求操作API——获取天气预报信息 ...................................................................180 6.6.1 实况天气API .........................................................................................................181 6.6.2 服务器域名配置 ....................................................................................................182 6.6.3 服务器域名配置 ....................................................................................................184 6.6.4 天气预报小程序设计步骤 ....................................................................................185 6.7 文件API——本地文件管理 ...........................................................................................187 6.7.1 保存文件到本地 ....................................................................................................187 6.7.2 获取本地文件信息 ................................................................................................189 6.7.3 获取本地文件列表 ................................................................................................190 6.7.4 删除本地文件 ........................................................................................................190 6.7.5 打开本地文件 ........................................................................................................191 6.8 其他API ...........................................................................................................................191 6.8.1 交互API .................................................................................................................191 6.8.2 设备API .................................................................................................................194 6.8.3 账号API .................................................................................................................198 6.8.4 页面跳转API .........................................................................................................200 习题... .......................................................................................................................................202 第7章 微信小程序云开发 ....................................................................203 7.1 云开发简介 .....................................................................................................................203 7.1.1 小程序新旧模式对比 ............................................................................................203 7.1.2 开通云开发功能 ....................................................................................................204 7.1.3 建立云程序 ............................................................................................................205 7.2 云存储 .............................................................................................................................206 7.2.1 云控制台管理云存储 ............................................................................................207 7.2.2 云存储API .............................................................................................................208 7.2.3 云文件存储使用案例 ............................................................................................211 7.3 云函数 .............................................................................................................................212 7.3.1 云函数创建和部署 ................................................................................................212 7.3.2 云函数调用 ............................................................................................................213 7.3.3 云函数调试 ............................................................................................................214 7.3.4 Callback风格和Promise风格 ................................................................................215 7.4 云数据库 .........................................................................................................................217 7.4.1 创建云数据库 ........................................................................................................217 7.4.2 插入数据 ................................................................................................................218 7.4.3 查询数据 ................................................................................................................219 7.4.4 修改数据 ................................................................................................................220 7.4.5 删除数据 ................................................................................................................221 7.5 云开发综合案例 .............................................................................................................222 7.5.1 需求分析 ................................................................................................................223 7.5.2 总体设计 ................................................................................................................223 7.5.3 系统实现 ................................................................................................................224 习题... .......................................................................................................................................254 第8章 微信小游戏开发 .......................................................................255 8.1 微信小游戏开发基础 .....................................................................................................255 8.1.1 微信小游戏的发展史 ............................................................................................255 8.1.2 微信小游戏开发过程 ............................................................................................255 8.1.3 微信小游戏目录结构 ............................................................................................256 8.1.4 CommonJS风格 .....................................................................................................257 8.1.5 微信小游戏Adapter(适配器) ...........................................................................258 8.2 微信小游戏开发API .......................................................................................................259 8.3 微信小游戏动画和触摸事件 .........................................................................................260 8.4 微信小游戏开发——接宝石箱子游戏 .........................................................................262 8.4.1 程序设计步骤 ........................................................................................................263 目录 8.4.2 增加炸弹功能 ........................................................................................................266 8.4.3 增加游戏失败功能 ................................................................................................266 8.4.4 增加背景音乐功能 ................................................................................................267 附录A 项目案例——约尚蛋糕订购微信小程序 ..........................................269 附录B 项目案例——计算器小程序.........................................................270 附录C 项目案例——推箱子游戏 ........................................................... 271 参考文献 ..........................................................................................272
夏敏捷,男,副教授,硕士研究生,现任中原工学院计算机基础教研部副主任。主要研究方向为电子文件、可视化、数据挖掘。1996年开始任教,主要讲授高级语言C++程序设计、数据库、VB.NET程序设计、计算机网络、Flash动画设计等课程,主编教材30余部。曾主持郑州市科技厅1项,教育厅2项科研项目。 潘惠勇,男,副教授,1977年4月出生。2000年毕业于河南大学计算机科学技术与教育专业,一直在中原工学院从事计算机教育工作主要研究方向为软件工程、大数据可视化。先后发表核心论文5篇,主持完成河南省科技厅和教育厅项目3项。 宋宝卫,男,本科学历,郑州轻工业大学讲师,研究方向为软件工程。研究成果:发表论文10篇左右,出版著作1部、教材10部左右,参与省级重点项目2项。 ?
以开发案例为导向,通过具体案例讲解微信小程序开发; 配套资源丰富,提供完整代码下载,书中部分重点案例配有二维码,扫描可观看案例操作微视频 ?