游戏开发微信小程序(Cocos2d的升级版 CocosCreator + JavaScript)
黑马程序员6天实战游戏开发微信小程序(Cocos2d的升级版 CocosCreator + JavaScript)
https://www.bilibili.com/video/BV1Uy4y1m7fx
5 10
01_什么是游戏编程
1什么是游戏编程
游戏编程(Gaming Programming)是一种通过编程来实现电子游戏中的逻辑的方法,包括渲染,物理,交互等。
编程语言的选择,如C编程语言、C++、Java,JavaScript,Lua等,编写计算机、手机或游戏机上的游戏。目 前流行的游戏编程语言为C++和JavaScript编程语言,游戏编程底层接口为DirectX、OpenGL和SDL(Simple DirectMedia Layer)等。多媒体编程接口主要作用是让游戏或多媒体程序获得更高的执行效率,加强3D图形和声音效果,并提供设计人员一个共同的硬件驱动标准,让游戏开发者不必为每一品牌的硬件来写不同的驱动程序,也降低用户安装及设置硬件的复杂度
现在手机上玩的游戏分为Android与IOS两种平台,分别是用java和objectc(或swift),当然时下也流行一些跨平台的编程引擎,例如cocos creator、unity 3D等。
游戏引擎是什么
游戏引擎是指一些已编写好的可编辑电脑游戏系统或者一些交互式实时图像应用程序的核心组件。这些系统为游戏设计者提供各种编写游戏所需的各种工具,其目的在于让游戏设计者能容易和快速地做出游戏程式而不用由零开始,大部分都支持多种操作平台,如Linux,Mac OSX,微软Windows,游戏引擎包含以下系统:渲染引擎(即“渲染器”,含二维图像引擎和三维图像引擎)、物理引擎、碰撞检测系统、音效、脚本引擎、电脑动画、人工智能、网络引擎以及场景管理。
简单来说,引擎可以理解为一个开发游戏用的基本框架,对于一些游戏开发上通用的功能,不用再重复造轮子了,拿来就用。
-mد_
Unity 3D
ue虚幻引擎
Cry Engine 3
白鹭(Egret
Cocos 2D
_
02_整体课程安排概述
03_开发前的编程语言准备
3.3 微信环境对ES6的支持JavaScript 支持情况运行限制
基于安全考虑,小程序中不支持动态执行JS 代码,即:
不支持使用 eval 执行 JS 代码不支持使用 new Function 创建函数安白牌ESGADI古は快口
_
04_变量声明关键字-let的使用
05_变量声明关键字-const和暂时性死区
06_Symbol的基本用法
07_应用场景1:使用Symbol来作为对象属性名
08_应用场景2:使用Symbol来替代常量
09_解构赋值:数组模型的解构
10_解构赋值:对象模型的解构
11_原生函数常见写法
12_箭头函数:基本使用
13_箭头函数返回对象写法
14_箭头函数的this
15_Math函数:随机数-取整(单声道)
15_Math函数:随机数-取整
16_Math函数:绝对值-圆周率和三角函数-开方
17_Map对象的使用
18_Set对象基本使用-与Array之间互相转换
19_Set 对象作用
20_面向对象编程
01_简介
02_组件化开发&安装Cocos Creator
1.2 组件化开发
传统开发模式:代码 驱动 数据、资源组件开发的好处
先有数据节点
给数据节点添加组件,赋予节点对象不同的功能组件重用,开发模式比较统一
2019.12.27
V2.2.2版本
03_Hello World 初体验
04_编辑器界面介绍
05编辑器常用设置
06_项目目录结构解析
资源文件夹(assets)
assets将会用来放置游戏中所有的本地资源、脚本和第三方库文件。只有在assets目录下的内容才能显示在资源管理器 中,assets 中的每个文件在导入项目后都会生成一个相同名字的.meta 文件,用于存储对应的资源配置和索引信息。.meta 文件需要一并提交到版本控制系统。
一些第三方工具生成的工程或设计原文件,如TexturePacker的,tps文件,或Photoshop的.psd文件,可以选择放在 assets 里面来管理。
资源库(library)
library 是将 assets 中的资源导入后生成的,在这里文件的结构和资源的格式将被处理成最终游戏发布时需要的形式。
当library丢失或损坏的时候,只要删除整个library文件夹再打开项目,就会重新生成资源库。
本地设置(local)
local文件夹中包含该项目的本机上的配置信息,包括编辑器面板布局,窗口大小,位置等信息。开发者不需要关心这里的内容。
本地设置(local)
local 文件夹中包含该项目的本机上的配置信息,包括编辑器面板布局,窗口大小,位置等信息。开发者不需要关心这里的内容。
扩展插件文件夹(packages)
packages文件夹用于放置此项目的自定义扩展插件。如需手动安装扩展插件,可以手动创建此文件夹。如需卸载扩展插件,在packages中删除对应的文件夹即可。
项目设置(settings)settings 里保存项目相关的设置,如 构建发布 菜单里的包名、场景和平台选择等。
临时文件夹(temp)
临时文件夹(temp)
temp 是临时文件夹,用于缓存一些 Cocos Creator 在本地的临时文件。这个文件夹可以在关闭 Cocos Creator 后手动删除,开发者不需要关心这里面的内容。
project.json project.json文件和assets文件夹一起,作为验证Cocos Creator项目合法性的标志,只有包括了这两个内容的文件夹才能作为Cocos Creator 项目打开,开发者不需要关心里面的内容。
构建目标(build)
在使用主菜单中的项目->构建发布….使用默认发布路径发布项目后,编辑器会在项目路径下创建bui1d目录,并存放所有目标平台的构建工程。
07_场景&节点和组件_
1.8 基本概念1.8.1 场景
I Cocos Creator是由一个一个的游戏场景组成,场景是一个树形结构,场景是由有各种层级关系的节点 组成;一场景编辑器 是内容创作的核心工作区域,您将使用它选择和摆放场景图像、角色、特效、UI等各类游戏元素。在这个工作区域里,您可以选中并通过 变换工具 修改节点的位置、旋转、缩放、尺寸等属性,并可以获得所见即所得的场景效果预览。
1.8.2 节点和组件
Cocos Creator 的工作流程是以组件式开发为核心的,组件式架构也称作 组件-实体系统(或Entity-Component System),简单的说,就是以组合而非继承的方式进行实体的构建。
在 Cocos Creator 中,节点(Node)是承载组件的实体,我们通过将具有各种功能的 组件(Component)挂载到节点上,来让节点具有各式各样的表现和功能。接下来我们看看如何在场景中创建节点和添加组件。
每个视觉元素都是一个节点,通常我们不会把所有节点平铺在场景上,而是会按照一定的分类和次序组织成如下图所示的节点树:_
08_场景&节点&组件简单使用解析
09_坐标和事件响应-触摸事件
1.触摸事件
(1)this.node.on TOUCH_START 当手指触摸到屏幕时。
TOUCH_MOVE 当手指在屏幕上移动时
TOUCH_END 当手指在目标节点区域内离开屏幕时。
TOUCH_CANCEL 当手指在目标节点区域外离开屏幕时。
(2)事件的三个阶段和事件冒泡
鼠标或触摸事件会被系统调用 dispatchEvent 方法触发,触发的过程包含三个阶段:捕获阶段:派发事件给捕获目标(通过-getCapturingTargets获取),比如,节点树中注册了捕获阶段的父节点,从根节点开始派发直到目标节点。
目标阶段:派发给目标节点的监听器。
冒泡阶段:派发事件给置泡目标(通过-getBubblingTargets获取),比如,节点树中注册了冒泡阶段的父节点,从目标节点开始派发直到根节点。
同时您可以将事件派发到父节点或者通过调用 stopPropagation拦截它.
推荐使用这种方式来监听节点E的触摸或鼠标事件,请不要在节点上直接使用cc.eventManager.
你也可以注册自定义事件到节点上,并通过emit 方法触发此类事件,对于这类事件,不会发生捕获冒泡阶段,只会直接派发给注册在该节点上的监听器
你可以通过在 emit 方法调用时在 type 之后传递额外的参数作为事件回调的参数列表
2.键盘事件
10_键盘事件
SystemEvent 类型
继承于 EventTarget模块:cc系统事件,它目前支持按键事件和重力感应事件。
你可以通过 cc.systemEvent 获取到 SystemEvent的实例.
示例
11_响应自定义事件
3.响应自定义事件
(1)监听事件
//自定义事件类型
this.node.on("fire",function(msg){
cc.log("自定义事件:","fire",msg)
},this);(2)发射事件
两种方式 emit 和 dispatchEvent
_12_单张图片管理
13_图集资源的制作和导入
14_声音资源的管理
2.2.1 WebAudio方式加载音频
在Cocos Creator中加载音频的方式和图片一样,在资源管理器的路径下添加音频文件即可,从属性检查器中可以设置加载模式,目前支持的加载模式有两种,一种是Web Audio方式,一种是Dom Audio方式,默认的是前者,当浏览器不支持第一种的时候才使用第二种方式,在属性检查器页面,可以选择加载方式,如图所示。
通过 Web Audio 方式加载的声音资源,在引擎内是以一个 buffer 的形式缓存的。
这种方式的优点是兼容性好,问题比较少,缺点是占用的内存资源过多。
2.2.2 DomAudio方式加载音频
通过生成一个标准的 audio 元素来播放声音资源,缓存的就是这个 audio 元素。
使用标准的audio元素播放声音资源的时候,在某些浏览器上可能会遇到一些限制。比如:每次播放必须是用户操作事件内才允许播放(Web Audio 只要求第一次),且只允许播放一个声音资源等。
如果是比较大的音频如背景音乐,建议使用 DOM Audio
15_预制体的创建和使用
2.3 预制体的创建和使用
预制体(Prefabs)这个概念是自Unity引擎的,它是一种可以被重复使用的游戏对象,例如射击游戏中的子弹都来自于同一个子弹模型,当发射子弹时,就创建一个子弹预制体。也就是说,如果创建一个可以重复使用的对象,那么就该用到预制体了。
2.3.1 什么是预制体
在一般的游戏开发中,并没有预制体这个概念,它曾经是Unity的专用术语,它可以简单解释成"用于创建大量相同的物件而使用的模板",也就是说它可以被用于创建重复的对象,虽说它是从Unity才有的概念,但是预制体的设计思想类似设计模式中的原型模式,是用于创建重复的对象,同时又能保证性能,这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。当直接创建对象的代价比较大时,则采用这种模式。Cocos Creator中的预制体的用法和Unity类似,当制作好了游戏组件,也就是场景中的任意一个对象时,我们可将它制作成一个组件模板,用于批量的套用工作。例如,场景中本质上要重复使用的东西,像敌人、士兵、子弹或者一个砖块完全相同的墙体。这里说本质是因为默认生成的预制体其实和模板是一模一样的,就像是克隆体,但生成的位置、角度和一些属性可以不同
_16_字体资源的管理
2.4.1 系统字体
系統字体就是调用游戏运行平台上自带的系统字体渲染文字,不需要使用任何资源,只需要设置"Use System Font"属性。
2.4.2 动态字体
目前Cocos Creator支持TTF格式的动态字体,只要将扩展名为TTF的字体文件拖拽到资源管理器中,即可完成字体资源的导入。
2.4.3 位图字体
17_粒子系统的特点和构成
2.5 粒子资源管理
作为游戏开发者,不得不承认的事实是再优秀的游戏玩法也要用绚丽的游戏画面来吸引玩家眼球。普通动画并不能完全满足我们的要求,或者说如果用普通动画实现足够绚丽的效果需要更高的代价(更占内存等),尤其对于手机游戏来说,这往往是致命的。如何才能使用很少的内存和计算效率就获得绚丽的动画效果呢?粒子系统是个不错的选择。动画粒子系统会发射大量细小的粒子并且非常高效地渲染这些粒子,比渲染单个精灵要高效得多,它可以模拟随机的,栩栩如生的烟雾、闪电、风雨、雪花掉落的效果。
2.5.1 粒子系统
粒子系统最早出现于20世纪80年代,主要用于解决由大量按一定规则运动(变化)的微小物质在计算机上的生成和显示问题,是计算机图形学中模拟一些特定的模糊现象的技术,而这些现象用其他传统的渲染技术是难以实现真实感的。粒子系统通常模拟的现象有火、爆炸、烟、水流、火花、落叶、云、雾、雪、尘、流星尾迹或者发光轨迹这样的抽象视觉效果等。通过很多属性来驱动运行,这些属性不止模拟单个粒子的运动,更是影响着整个粒子体系的运行效果,粒子系统是通过所有粒子共同创造的整体效果,需要说明的是,粒子系统虽然在处理大量单独粒子的变化的运动上很有用处,但是一旦涉及需要考虑粒子间相互作用的场合(这时的计算量呈粒子数量的指数级增长),它就会有些力不从心,比如模拟在相互引力作用下的大量星体的运动、大量粒子的相互碰撞等,简而言之就是无论多么易用的技术也有它的瓶颈,我们需要做的就是扬长避短,发挥这个技术的优势。粒子系统可以使游戏元素更加真实并且富有生命感。通过对自然现象的分析,现实中的这些效果是由很多细小的微粒的变化叠加形成的,因此很难用确定的对象来描述大量随机混乱的粒子效果。
粒子系统可通过Particle Designer软件进行制作,也可以通过网页在线制作http://www.effecthub.com/part icle2dx.
导入粒子资源到资源管理器
18_Cocos Creator中的粒子资源
19_通过层级管理器管理粒子节点
20_Tiled地图集资源管理和Tiled地图编辑器简单使用
2.6 Tiled地图集资源管理
在很多游戏中,整个游戏场景中除了主角精灵之外,游戏的地图背景也是一块"重头戏"。在手机游戏的开发中,为了节约内存空间,一般使用图素拼接的方法组成整个地图。也就是说,首先定下图素块(一般为正方形)的大小,然后美术绘制图素块,最后由策划和美术根据不同项目的需求使用地图编辑器将图素拼接成大地图,并将生成的数据文件和图素交给程序处理。
2.6.1 Tiled地图编辑器
thorbjorn.itch.io/tiled
地图资源文件的导入(课件资源已经提供做好的瓦片图)
地图所需资源有:
tmx 地图数据
d.png 图集纹理
。.tsx tileset数据配置文件(部分tmx文件需要)
在cocos creator中使田地图资酒
21_使用cocos creator 加载地图资源
22_骨骼动画的介绍 Spine
2.7 骨骼动画
I骨骼动画资源是由Spine所导出的数据格式(Creator v2.0.7及以下支持Spine v2.5,Creator v2.0.8 ~ v2.1支持Spine v3.6,Creator v2.2 支持 Spine v3.7,Creator v2.3 及以上支持 Spine v3.8).
2.7.1 骨骼动画介绍
年月家1メマち日を日か912を分期月和と国光
好处有以下几点:
1、骨骼动画是影响到顶点级别的动画,而且可以多根骨骼根据权重影响同一个顶点,不论是2D或者3D使用,都可以让动画做得更丰富。
2、做到了对象和动画分离,我们只需要记录了物体对于骨骼的蒙皮权重,就可以单独的去制作骨骼的动画,在保证蒙皮信息和骨骼信息一致的情况下,还可以多个物体之间共享动画。
3、相对于2D的逐帧动画大大的节省资源容量。
2.7.2 导入骨骼动画资源
骨骼动画所需资源有:
.json/.skel 骨骼数据
.png 图集纹理
.txt/.atlas 图集数据
23_骨骼动画资源介绍
24_创建骨骼动画
01_脚本编程介绍
02_创建和使用脚本组件
03_使用 cc.Class 声明类型
04_实例方法和集成的使用
05_声明自定义属性-简单声明
06_声明自定义属性-完整声明
07_脚本生命周期onLoad&onEnable&start
ا
目前提供给用户的生命周期回调函数主要有:
onLoad
onEnable
start
update
lateUpdate
onDisable
onDestroy
1.4.5 lateUpdate update会在所有动画更新前执行,但如果我们要在动效(如动画、粒子、物理等)更新之后才进行一些额外操作,或者希望在所有组件的update都执行完之后才进行其它操作,那就需要用到1ateUpdate回调。
I
08_脚本生命周期update
09_脚本生命周期lateUpdate
10_脚本生命周期onDisable&onDestroy
11_获得当前节点下的其它组件
12_获得其它节点
13_使用属性检查器设置组件
14_查找子节点&全局查找
15_激活&关闭节点
16_更改节点的父节点&索引子节点
17_结点的位置&旋转&缩放
18_修改节点尺寸&锚点
19_颜色和不透明度
20_创建&克隆节点
21_创建预制节点&销毁节点
2加载和切换场景
在Cocos Creator的脚本中,可以使用导演类的loadScene方法加载场景,loadScene可以传递一个或两个参数,第一个参数是场景名称,第二个参数是场景加载完毕后的回调函数,场景加载完毕后的回调函数可以进行必要的初始化或数据传递操作,代码如下所示。
cc.diFector.loadScene("MyScene");有些场景的加载时间过长,会造成游戏的卡顿,这时我们可以使用预加载的方式,在时间充裕的时候加载场景数据,将这些数据缓存在内存中,这种方式本质上是一种"空间换时间"的方式。预加载的操作代码如下所示。
cc.director.preloadScene("table",function Of cc.log("Next scene preloaded");
});通过常驻节点进行场暴资源管理和参数传递
22_ 加载和切换场景
23_如何在属性检查器里设置资源
24_动态加载资源&资源的释放
25_动作系统基本使用API
Cocos Creator 提供的动作系统可以在一定时间内对节点完成位移,缩放,旋转等各种动作。
Cocos引擎的Action动作类并不是一个在屏幕中显示的对象,动作必须要依托于Node节点类及它的子类的实例才能发挥它的作用,Cocos中的动作不仅包括位置移动等,还包括跳跃、旋转,甚至是对象透明度的变化和颜色的渐变。这些基本动作可以构成各种复杂的动作,也可以通过sequence形成一个完整的动作序列。
4.1基本使用API动作系统的使用方式也很简单,在 cc.Node 中支持如下 API:创建一个移动动作
let action = cc.moveTo(2,100,100);
//执行动作
this.node.runAction(action);停止一个动作
this.node.stopAction(action);
//停止所有动作
this.node.stopAllActions();
4.2.1 基础动作
基础动作就是实现各种形变,位移动画的动作,比如cc.moveTo用来移动节点到某个位置;cc.rotateBy用来旋转节点一定的角度;cc.scaleTo用来缩放节点.
基础动作中分为时间间隔动作和即时动作,前者是在一定时间间隔内完成的渐变动作,前面提到的都是时间间隔动作,它们全部继承自cc.ActionInterval,后者则是立即发生的,比如用来调用回调函数的cc.callFunc;用来隐藏节点的 cc.hide,它们全部继承自 cc.Actioninstant
4.2.2 容器动作
spawn tween cc.sequence
26_基础动作&容器动作
27_动作回调
01_UI系统简介
02_创建一个简单的精灵组件
03_Sprite属性简单介绍
04_渲染模式 普通模式&九宫格模式
05_渲染模式 平铺模式&填充模式
06_Label组件的简单使用
07_Label组件属性(1)
08_Label组件属性(2)&排版方式
09_Label组件属性(3)&位图文字
10_文本缓存类型
1.2.3 文本缓存类型(Cache Mode)
11_Button组件基本使用
12_Button属性&Trasition
13_Button 点击事件通过脚本添加回调
14_Button 点击事件通过属性检查器添加回调
15_动画系统简介
16_认识动画编辑器&Clip动画剪辑
17_认画编辑器常用操作(1)
18_认画编辑器常用操作(2)
19_基本操作
20_快捷键
21_剪辑内的数据&节点数据
22_让牛儿跑起来
23_让牛儿移动起来
24_让牛儿循环移动起来
01_游戏展示
02_开发思路剖析
03_主界面UI搭建
04_奔跑的牛(1)
05_奔跑的牛(2)
06_奔跑的牛(3)
07_将整个cow节点作为预制体
08_套绳动作准备工作
09_套绳动画(1)
10_套绳动画(2)
11_套绳判定结果(1)
12_套绳判定结果(2)
13_套绳判定结果(3)
14_计分器的开发
15_倒计时功能的开发
16_倒计时可调整参数
17_最终成就系统界面绘制
18_显示得分
19_根据得分显示文案
20_关闭按钮重新继续游戏
01_微信公众平台账号注册
游戏也属小程序 只是类目改休闲小游戏
02_构建发布-微信小游戏
03_微信开发者工具协同操作
04_微信开发者工具简单介绍
05_微信开发者工具-编译
06_微信开发者工具-预览
07_微信开发者工具-真机调试&切后台&清缓存
08_微信开发者工具-上传
09_获取用户信息 显示按钮的方式
10_获取用户信息 隐藏按钮的方式
11_获取微信用户信息并显示用户头像
12_已经授权的情况下直接获取用户信息
13_微信分享功能
14_微信banner广告
流量主
15_后台开发准备工作
16_微信后台登录逻辑说明
17_微信后台登录java代码
18_前端获取code发送request请求到后台
19_微信后台登录功能完成
20_保存最高得分(后台代码)
21_保存最高得分(前台代码)
22_使用原始的XMLHttpRequest替代wx.request
23_微信小游戏发布注意事项
wxapi同小程序一样
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 清华大学推出第四讲使用 DeepSeek + DeepResearch 让科研像聊天一样简单!
· 推荐几款开源且免费的 .NET MAUI 组件库
· 实操Deepseek接入个人知识库
· 易语言 —— 开山篇
· 【全网最全教程】使用最强DeepSeekR1+联网的火山引擎,没有生成长度限制,DeepSeek本体