# Phaser: collisions and screen boundaries

> Learn how to detect collisions in Phaser with collider and overlap, and keep objects on screen using setCollideWorldBounds and setBounce.

Author: [Flavio Copes](https://flaviocopes.com/about/) | Published: 2021-04-26 | Topics: [Phaser](https://flaviocopes.com/tags/phaser/) | Canonical: https://flaviocopes.com/phaser-collisions-boundaries/

> This post is part of a Phaser series. [Click here](https://flaviocopes.com/phaser-setup/) to see the first post of the series.

You can detect a collision between physics-enabled items.

Phaser offers us 2 handy methods, to start with.

We have `collider` and `overlap`. Both let us detect when objects get one near the other, but with a difference: `collider` automatically makes object bounce when they meet. `overlap` lets objects overlap with each other.

This is how we add a collider:

```js
const collisionHappened = (dog, cat) => {
  projectile.destroy()
}

this.physics.add.collider(dogs, cats, collisionHappened, null, this)
```

and this is how we add an overlap:

```js
const overlapHappened = (dog, cat) => {
  projectile.destroy()
}

this.physics.add.overlap(dogs, cats, collisionHappened, null, this)
```

You can also set screen boundaries so physics objects will not disappear when they reach the end of the screen.

Call the `setCollideWorldBounds()` on the object, and pass it the `true` value:

```js
const dog = this.physics.add.sprite(20, 20, 'dog')
dog.setCollideWorldBounds(true)
```

If you also want it to bounce when it reaches the screen limit, call

```js
dog.setBounce(1)
```

The number you pass will determine how fast it will bounce back. Try setting 0.5 or 1.5 and you'll see it bouncing with less or more energy.