本想按照PHASER的Canvas来创建HTML DOM元素，但this.add.dom 一直提示错误，无奈直接用HTML5的语法来创建DOM元素，然后在Phaser内获取该DOM元素，也不用再使用第三方的Phaser Html Input插件Plugin，还是挺方便快捷的。
(三)NINJA PIGGY 无敌忍者小猪让飞镖进行旋转Projectile rotate
无敌忍者小猪让飞镖进行旋转Projectile rotate
Continue reading »
(二)SKYNINJA 天猪之城 — 新增炸弹特效
SKEmitter Particle 粒子特效
Continue reading »
SpriteKit手机游戏摇杆JoyStick的使用 — Space Battle 宇宙大战番外篇
有时候学习如何应用第三方库是非常重要的，因为我们不用再自己重复造轮子，在这里，我们就把原先利用重力感应来操控飞机改为用游戏摇杆joystick来操控，具体的操作如下:
Continue reading »
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时7、Physics+SKEmitter 学习物理特性与粒子特效
一、精灵的反弹力physicsBody?.restitution = 1
二、精灵加入粒子特效SKEmitterNode
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时6、AVFoundation 学习如何调节背景音乐的大小
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时5、SoundManager 学习设置单例类管理所有音乐
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时4 TouchesBegan 学习在精灵内创建触碰移动事件
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时2.3 应用GameplayKit的GKStateMachine切换游戏状态 代码篇
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时2.2 应用GameplayKit的GKStateMachine切换游戏状态 原理篇
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时3.Velocity 三角函数求向量并修正精灵节点运动时的BUG
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时2.1 创建独立的SpriteNode精灵节点
Phaser游戏框架与HTML Dom元素之间的通信交互
本想按照PHASER的Canvas来创建HTML DOM元素，但this.add.dom 一直提示错误，无奈直接用HTML5的语法来创建DOM元素，然后在Phaser内获取该DOM元素，也不用再使用第三方的Phaser Html Input插件Plugin，还是挺方便快捷的。
Continue reading »
Phaser Matter Collision Plugin 物理引擎碰撞插件
Phaser 自带的Arcade虽然易用，但复杂的物理碰撞明显就不够用了，于是Matter等物理引擎还是不得不学的，以下是Matter物理体碰撞的一个插件，它省去了我们判别两个物理体相撞后哪个是gameObjectA和gameObjectB，实在是好用又省心 …
Continue reading »
Phaser3跟随自定义路径移动的赛车
// 创建racing car
var lemming = this.add.follower(curve, 50, 300, ‘racecar’).setScale(0.3);
// 让 racing car 跟随path
lemming.startFollow({
duration: 10000,
yoyo: false,
repeat: 0,
rotateToPath: true,
verticalAdjust: true
});
用EC5/EC6自定义class的区别及用法 — Phaser3网页游戏框架
EC6:class Brain extends Phaser.GameObjects.Sprite {}
EC5:var Bunny = new Phaser.Class({Extends:Phaser.GameObjects.Sprite,})
Phaser3让超级玛丽实现轻跳、高跳及加上对应的跳跃声音
空格键：轻按：跳低 ，长按：跳高
键盘：–> 向右 , <-- 向左
Phaser3 设置场景Scene Sleeping休眠和Wake唤醒
Phaser3游戏三角学应用–一只跟随屏幕点击位置游动的鱼
三角函数 得出鱼要旋转的角度
this.fish.rotation = Math.atan2(pointer.y – this.fish.y, pointer.x – this.fish.x);
判断鱼是否需要反转:点击的位置和鱼头相同=>不反转
this.fish.flipY = false;
判断鱼是否需要反转:点击的位置和鱼头相反=>反转
this.fish.flipY = true;
Phaser3 应用对象池随机产生炸弹并销毁 — HTML5网页游戏开发
使用对象池 Object Pool产生炸弹,首先创建一个对象组 this.exploadGroup = this.add.group();
然后用对象组的.get重复应用对象池而不是用.create,this.exploadGroup.get(x,y,’explode’);
最后销毁的时候不是用.destory()，而是用 this.exploadGroup.killAndHide(singleExplode);
RECOMMAND -- 教程推荐
Phaser游戏框架与HTML Dom元素之间的通信交互
本想按照PHASER的Canvas来创建HTML DOM元素，但this.add.dom 一直提示错误，无奈直接用HTML5的语法来创建DOM元素，然后在Phaser内获取该DOM元素，也不用再使用第三方的Phaser Html Input插件Plugin，还是挺方便快捷的。
Phaser Matter Collision Plugin 物理引擎碰撞插件
Phaser 自带的Arcade虽然易用，但复杂的物理碰撞明显就不够用了，于是Matter等物理引擎还是不得不学的，以下是Matter物理体碰撞的一个插件，它省去了我们判别两个物理体相撞后哪个是gameObjectA和gameObjectB，实在是好用又省心 …
Phaser3跟随自定义路径移动的赛车
// 创建racing car
var lemming = this.add.follower(curve, 50, 300, ‘racecar’).setScale(0.3);
// 让 racing car 跟随path
lemming.startFollow({
duration: 10000,
yoyo: false,
repeat: 0,
rotateToPath: true,
verticalAdjust: true
});
用EC5/EC6自定义class的区别及用法 — Phaser3网页游戏框架
EC6:class Brain extends Phaser.GameObjects.Sprite {}
EC5:var Bunny = new Phaser.Class({Extends:Phaser.GameObjects.Sprite,})
Phaser3让超级玛丽实现轻跳、高跳及加上对应的跳跃声音
空格键：轻按：跳低 ，长按：跳高
键盘：–> 向右 , <-- 向左
Phaser3 设置场景Scene Sleeping休眠和Wake唤醒
使用sleep和wake方法的好处：
1.可以彻底让scene场景彻底休眠
2.update function不会再运行
3.同时会暂停场景内的Timer事件
Phaser3游戏三角学应用–一只跟随屏幕点击位置游动的鱼
三角函数 得出鱼要旋转的角度
this.fish.rotation = Math.atan2(pointer.y – this.fish.y, pointer.x – this.fish.x);
判断鱼是否需要反转:点击的位置和鱼头相同=>不反转
this.fish.flipY = false;
判断鱼是否需要反转:点击的位置和鱼头相反=>反转
this.fish.flipY = true;
Phaser3 应用对象池随机产生炸弹并销毁 — HTML5网页游戏开发
使用对象池 Object Pool产生炸弹,首先创建一个对象组 this.exploadGroup = this.add.group();
然后用对象组的.get重复应用对象池而不是用.create,this.exploadGroup.get(x,y,’explode’);
最后销毁的时候不是用.destory()，而是用 this.exploadGroup.killAndHide(singleExplode);
Phaser3 场景Scene之间的传值 — HTML5网页游戏开发
从sceneA通过 ths.events.emit时传值到sceneB时有个需要特别注的事项就是，得把sceneB的 active设为 ture,否则因为 sceneB还未激活，是监听不到 events.on事件的!!!
Phaser3 屏幕适配iPhoneX、iPhoneXs时的坑 — HTML5网页游戏开发
坑：
在config内不要把 width 设为 window.innnerWidth
在config内不要把 width 设为 window.innnerWidth
在config内不要把 width 设为 window.innnerWidth
重要的事情得说三遍…
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时7、Physics+SKEmitter 学习物理特性与粒子特效
一、精灵的反弹力physicsBody?.restitution = 1
二、精灵加入粒子特效SKEmitterNode
[视频课程] BREAKOUT GAME 弹潮VANS!V — 课时6、AVFoundation 学习如何调节背景音乐的大小
一、SKAudioNode无法调用背景音乐的大小;
二、Bundle.main.path 取得音乐文件
三、引入AVFoundation通过AVAudioPlayer进行调节声音大小