如何检测矩形和圆形的碰撞?
1.画一个黄色矩形和一个蓝色圆形,再放置一个旋转的按钮。
2.拖动黄色矩形,当矩形碰到圆形时,圆形会变为绿色。
3.通过旋转按钮,改变矩形旋转角度,再次碰撞,亦可变为绿色。
Laya的实现代码,如下:
export default class HitRect extends Laya.Sprite {
public w:number = 100;
public h:number = 50;
public r:number = 40;
public spRect:Laya.Sprite;
public spCircle:Laya.Sprite;
constructor() {
super();
public draw():void{
this.spRect = new Laya.Sprite();
this.spRect.width = this.w;
this.spRect.height = this.h;
this.spRect.graphics.drawRect(0,0,this.w,this.h,0xffff00);
this.addChild(this.spRect);
this.spRect.mouseEnabled = true;
this.spRect.on(Laya.Event.MOUSE_DOWN,this,this.mouseDown);
this.spRect.rotation= 0;
this.spRect.x =0;this.spRect.y=200;
this.spRect.pivotX= this.w/2;
this.spRect.pivotY= this.h/2;
this.spRect.graphics.drawCircle(this.spRect.pivotX,this.spRect.pivotY,6,0xff0000);
this.spCircle = new Laya.Sprite();
this.spCircle.graphics.drawCircle(0,0,this.r,0x00ffff);
this.spCircle.x = 150;
this.spCircle.y = 200;
this.addChild(this.spCircle);
let button = new Laya.Button();
button.width = 80;
button.skin = "comp/button.png";
button.label = "旋转1";
this.addChild(button);
button.on(Laya.Event.MOUSE_DOWN, this, this.onButtonClick);
let button5 = new Laya.Button();
button5.skin = "comp/button.png";
button5.x = 100;
button5.label = "旋转5";
this.addChild(button5);
button5.on(Laya.Event.MOUSE_DOWN, this, this.onButtonClick5);
private onButtonClick(e: Laya.Event) {
this.spRect.rotation+=1;
private onButtonClick5(e: Laya.Event) {
this.spRect.rotation+=5;
private mouseDown():void{
this.spRect.on(Laya.Event.MOUSE_MOVE,this,this.mouseMove);
this.spRect.stage.on(Laya.Event.MOUSE_UP,this,this.mouseUp);
private mouseUp():void{
this.spRect.off(Laya.Event.MOUSE_MOVE,this,this.mouseMove);
this.spRect.stage.off(Laya.Event.MOUSE_UP,this,this.mouseUp);
private mouseMove(evt:Laya.Event):void{
this.spRect.x = evt.stageX;
this.spRect.y = evt.stageY;
let pos:any = this.getNewPos(this.spRect.x,this.spRect.y,this.spCircle.x,this.spCircle.y,this.spRect.rotation);
let boool = this.ComputeCollision(this.w,this.h, this.r, pos.x, pos.y);
if(boool){
this.spCircle.graphics.drawCircle(0,0,this.r,0x00ff00);
}else{
this.spCircle.graphics.drawCircle(0,0,this.r,0x00ffff);
* 计算碰撞
* @param w 宽度
* @param h 高度
* @param rx 圆形x
* @param ry 圆形y
private ComputeCollision(w, h, r, rx, ry):boolean{
var dx = Math.min(rx, w * 0.5);
var dx1 = Math.max(dx, -w * 0.5);
var dy = Math.min(ry, h * 0.5);
var dy1 = Math.max(dy, -h * 0.5);
return (dx1 - rx) * (dx1 - rx) + (dy1 - ry) * (dy1 - ry) <= r * r;
private getNewPos(x1,y1,x2,y2,rotation):any{
var pos:any = {};
var distance = Math.pow((Math.pow((x1 - x2), 2) + Math.pow((y1 - y2), 2)), 0.5);
var angle:number = Math.atan((y1-y2)/(x1-x2))*180/Math.PI;
var newAngle = angle - rotation;
pos.x = Math.cos(newAngle/180*Math.PI) * distance;
pos.y = Math.sin(newAngle/180*Math.PI) * distance;
return pos;
本文初探LayaAir2.0引擎,记录学习历程
其实学习Laya引擎是很早之前定下的目标。但有一些事情耽搁了就晚了一些时间。这两天初窥门径,当然期间也踩过不少的坑。我的想法是先从Laya的2D游戏下手,老项目——先使用Laya完成水管鸟实操再说。
1:循环滚动的背景图
在CocosCreator的学习日志里,我也写过这个功能,但在creator中我是在update中直接缩减节点的x来实现节点向左移动的效果,在Laya中我使用的是刚体通过设置linearVelocity来设置刚体的线性速度来控制
前言本文是使用laya实现的flappy bird。先来看下整个游戏过程: 本文从2个方面介绍,首先介绍下涉及到的Laya重点知识,然后再简单介绍下实现flappybird的要点。Laya基础知识游戏中的常用术语刚接触游戏,时常一脸懵逼里面的各种词汇:预制体、刚体。当然物理好的童鞋例外。下面我来介绍下几个常用术语:首先认识碰撞器什么是碰撞器?在游戏中比如 一架飞机发射了子弹,那么当这个子弹和敌人,...
发生物理碰撞时,也就是碰撞生命周期内的第一次进入碰撞,自动执行的生命周期虚方法。
onTriggerEnter
发生持续的物理碰撞时,也就是碰撞生命周期内的第二次碰撞到碰撞离开前,自动执行的生命周期虚方法。
onTriggerExit
物理碰撞结束时,自动执行的生命周期虚方法。
常用的功能和常见问题,一般官方文档或网上可以直接搜到,但仍有一些问题,官方文档里是没提到的,然后网上搜到同样问题的帖子,却没人回答。作为一个开源免费的引擎,不是每个问题,官方都能准时解答的,甚至你发个帖子,很长一段时间都没有一个答案,这时只能自己慢慢摸索一下了。这里我就把自己遇到的一些小问题及解决思路记录下来,希望对那些遇到同样问题的人有帮助。这些问题并不大,却有点烦人,你明知道实现某个功能可能就...
北京掌趣科技股份有限公司(简称“掌趣科技”)与北京蓝亚盒子科技有限公司(简称“蓝亚盒子”,英文名 LAYABOX)达成战略合作协议后,双方共同致力于打造一款具有创新意义的AI 游戏引擎,为广大游戏开发者提供更加智能、自动化的解决方案,推动游戏产业技术革新,共建高质量的 AIGC 开发生态体系。经过几个月的努力, 我们终于在今天推出了具有AIGC开发生态的LayaAir3.1的测试版本:3.1.0...
这种的 够蛋疼了吧。 本来想通过 点击位置的坐标链接成向量,然后 计算向量的 角度 来判断点击的到底是哪个位置。
后来返现Layaari 对向量的封装 没有像Unity3D那么友好。 角度计算有点费劲
后来看见一片文章:Layaari 不规则热区的实现
发现其实 Layaair 已经为我们提供好了 不规则形状 的点击 ...
图片一般是正方形,x、y坐标一般都是左上角,所以碰撞公式一般为
// hitRange 碰撞距离
if(Math.abs(shootball.x-ball.x) < hitRange && Math.abs(shootball.y-ball.y)<hitRange)
trace("碰撞了");
if(MathUtils.distance(s...