# Test for collision between a rectangle and an image

**URL:** <https://discourse.processing.org/t/test-for-collision-between-a-rectangle-and-an-image/19173>\
**Category:** Processing.py\
**Tags:** homework\
**Created:** [March 30, 2020, 9:01am UTC](https://discourse.processing.org/t/test-for-collision-between-a-rectangle-and-an-image/19173 "2020-03-30T09:01:03Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Lake\_Panzer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/lake_panzer/32/8574_2.png) [@Lake\_Panzer](https://discourse.processing.org/u/Lake_Panzer)\
**Post date:** [March 30, 2020, 9:01am UTC](https://discourse.processing.org/t/test-for-collision-between-a-rectangle-and-an-image/19173/1 "2020-03-30T09:01:03Z")

</div>

Hello there! In class, I have been learning how to use python in processing. However, I have learned barely anything in processing, and I now have a project to complete. I am trying to make a simple game where you control a spaceship and have to shoot this big alien, but I have absolutely no idea how to test for collisions between a rectangle and an image. And Google hasn’t really helped either, because it seems like almost no one uses processing.py. Can someone please help me? I have put my code below (very bad code lol, I really have no idea what I’m doing) along with two images (the player and the enemy). Thank you!

```auto
x = 750
y = 900
xspeed = 0
bossx = 500
bossy = 100
bxspeed = 10
bosshealth = 200
gunx = x + 50
guny = 900
velocity = 100
xxspeed = 0
liney = bossy
bgunx = bossx + 50
bguny = 100

def setup():
    global ship, alien
    ship = loadImage("ship.png")
    alien = loadImage("alien.png")
    imageMode(CORNERS)
    size(1500, 1000)
    frameRate(60)
    
def draw():
    global x, y, bgunx, bguny, xspeed, ship, alien, bossx, bxspeed, gunx, guny, xxspeed, linex, bossy
    background(0)
    textSize(32)
    text(bosshealth, 750, 30)
    fill(255)
    image(ship, x, y)
    bullet = rect(gunx, guny, 15, 15)
    danger = rect(bgunx, bguny, 30, 30)
    if keyPressed:
        if key == "d":
            xspeed = 10
            xxspeed = 10
        if key == "a":
            xspeed = -10
            xxspeed = -10
    else:
        xspeed = 0
    if keyPressed:
        if key == "d":
            xxspeed = 10
        if key == "a":
            xxspeed = -10
        if key == "w":
            guny = guny - velocity
    else:
        xxspeed = 0
    x = x + xspeed
    gunx = gunx + xxspeed
    if x > 1500:
        x = 0
        gunx = 50
    if x < 0:
        x = 1500
        gunx = 1450
    image(alien, bossx, 100)
    bossx = bossx + bxspeed
    bgunx = bgunx + bxspeed
    if bossx == 1000:
        bxspeed = -10
    if bossx == 0:
        bxspeed = 10
    guny = guny - 50
    if guny < 0:
        guny=900
    bguny = bguny + 10
    if bguny > 1000:
        bguny=200
    

```

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [March 30, 2020, 9:24am UTC](https://discourse.processing.org/t/test-for-collision-between-a-rectangle-and-an-image/19173/2 "2020-03-30T09:24:54Z")

</div>

> [@Lake\_Panzer](#):
>
> , because it seems like almost no one uses processing.py.

Processing’s default mode is “Java Mode”; so Java is indeed the main language here.

After that, we’ve got a Processing JavaScript flavor called [p5js.org](http://p5js.org).

> [@Lake\_Panzer](#):
>
> … how to test for collisions between a rectangle and an image.

A Processing [PImage](https://py.processing.org/reference/PImage.html) is also a rectangle form. So it’s basically rect-to-rect collision too.

I’ve got this article about rect-to-rect collision check, both in Java & JS:

1. [Collision Detection](http://JeffreyThompson.org/collision-detection/rect-rect.php)
2. [Collision Detection](http://CrHallberg.com/CollisionDetection/Website/rect-rect.html)

Just try to understand the concept, and then translate it to Python syntax.

Or I can try finding some sketch of mine w/ rect-to-rect collision and convert it to Python syntax.

---

<div class="post-metadata">

**Author:** ![tabreturn](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tabreturn/32/3697_2.png) [@tabreturn](https://discourse.processing.org/u/tabreturn)\
**Post date:** [March 30, 2020, 9:37am UTC](https://discourse.processing.org/t/test-for-collision-between-a-rectangle-and-an-image/19173/3 "2020-03-30T09:37:07Z")

</div>

As @GoToLoop has suggested, this is a language independent concept. Here’s a basic implementation of [AABB](http://www.jeffreythompson.org/collision-detection/rect-rect.php) collision in Python:

```auto
def setup():
    size(500, 500)

def draw():
    background('#0000FF')
    # target
    targetx, targety, targetsize = 200, 200, 100 
    # player
    playerx, playery, playersize = mouseX, mouseY, 60 
    
    if (playerx+playersize >= targetx and # player right-edge over target left-edge?
        playerx <= targetx+targetsize and # player left-edge over target right-edge?
        playery+playersize >= targety and # player bottom-edge over target top-edge?
        playery <= targety+targetsize # player top-edge over target bottom-edge?
        ):
        fill('#FF0000')
    else:
        fill('#FFFFFF')
    
    square(targetx, targety, targetsize)
    square(playerx, playery, playersize)

```

This is possibly the easiest method. But there are other methods for greater accuracy.
