# Drag and Drop an Object

**URL:** <https://discourse.processing.org/t/drag-and-drop-an-object/34609>\
**Category:** Coding Questions\
**Created:** [January 13, 2022, 3:31pm UTC](https://discourse.processing.org/t/drag-and-drop-an-object/34609 "2022-01-13T15:31:09Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kristina](https://avatars.discourse-cdn.com/v4/letter/k/2acd7d/32.png) [@Kristina](https://discourse.processing.org/u/Kristina)\
**Post date:** [January 13, 2022, 3:31pm UTC](https://discourse.processing.org/t/drag-and-drop-an-object/34609/1 "2022-01-13T15:31:10Z")

</div>

Hello, I was wondering if someone could explain how I can drag and drop an object if its part of an arrayList. I know how to look if the mouse is inside or how to remove it but for a drag and drop function I really have no idea.

Thank you for the help!

---

<div class="post-metadata">

**Author:** ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)\
**Post date:** [January 13, 2022, 5:20pm UTC](https://discourse.processing.org/t/drag-and-drop-an-object/34609/2 "2022-01-13T17:20:00Z")

</div>

Hey,

On way to do this is to have a boolean in you object to keep track if it is selected or not.  
Then you move the object that are selected to your mouse position.

https://openprocessing.org/sketch/1440169/embed/

---

<div class="post-metadata">

**Author:** ![svan](https://avatars.discourse-cdn.com/v4/letter/s/82dd89/32.png) [@svan](https://discourse.processing.org/u/svan)\
**Post date:** [January 13, 2022, 6:53pm UTC](https://discourse.processing.org/t/drag-and-drop-an-object/34609/3 "2022-01-13T18:53:53Z")

</div>

A slight variation of what was posted above using a Rectangle class:

```auto
Rect[] r;

float xOffset = 0.0;
float yOffset = 0.0;

Rect rect;

class Rect {
  float x, y, w, h;
  boolean selected;
  // Constructor
  Rect(float xpos, float ypos, float wide, float ht) {
    x = xpos;
    y = ypos;
    w = wide;
    h = ht;
  }

  void display() {
    rect(x, y, w, h);
  }
}

void setup() {
  size(800, 700);
  background(209);
  r = new Rect[10]; // initialize array
  for (int i = 0; i < r.length; i++) {
    r[i] = new Rect(random(width - 200), random(height - 150), random(200), random(150));
    r[i].selected = false;
  }
}

void draw() {
  background(209);
  for (int i = 0; i < r.length; i++) {
    r[i].display();
  }
}

void mousePressed() {
  for (int i = 0; i < r.length; i++) {
    if ((mouseX >= r[i].x) && (mouseX <= r[i].x + r[i].w) && (mouseY >= r[i].y) && (mouseY <= r[i].y + r[i].h)) {
      r[i].selected = true;
      xOffset = mouseX-r[i].x;
      yOffset = mouseY-r[i].y;
    } else {
      r[i].selected = false;
    }
  }
}

void mouseDragged() {
  for (int i = 0; i < r.length; i++) {
    if (r[i].selected == true) {
      cursor(HAND);
      r[i].x = mouseX - xOffset;
      r[i].y = mouseY - yOffset;
    }
  }
}

void mouseReleased() {
  cursor(ARROW);
}

```

---

<div class="post-metadata">

**Author:** ![Kristina](https://avatars.discourse-cdn.com/v4/letter/k/2acd7d/32.png) [@Kristina](https://discourse.processing.org/u/Kristina)\
**Post date:** [January 16, 2022, 1:06pm UTC](https://discourse.processing.org/t/drag-and-drop-an-object/34609/4 "2022-01-16T13:06:31Z")

</div>

Okay I think I understood it a bit better, but how would I do this if I have two classes of Objects that inherit from the same base Class? And they are all part of one ArrayList.