# ArrayList of Arrays for Interactive Shapes

**URL:** <https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336>\
**Category:** Beginners\
**Created:** [April 2, 2020, 1:59pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336 "2020-04-02T13:59:23Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![jaschag](https://avatars.discourse-cdn.com/v4/letter/j/6a8cbe/32.png) [@jaschag](https://discourse.processing.org/u/jaschag)\
**Post date:** [April 2, 2020, 1:59pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336/1 "2020-04-02T13:59:23Z")

</div>

I have created an ArrayList of arrays. Each array in the ArrayList should contain the mouseX and mouseY positions for one drawing frame. The ArrayList is to be expanded by one element(array) each frame.

However, when accessing the ArrayList with a for-loop, all the elements in the list have the same value. What am I missing?

```auto
int[] pos = new int[2]; // mouseX and mouseY position
ArrayList<int[]> polygon = new ArrayList<int[]>(); // List containing many points with mouseX/mouseY positions

void setup() {
  size(500, 500, P2D);
  background(255);
  strokeWeight(1);
  stroke(1);
  fill(255,0,0);
}

void draw() {
  if (mousePressed) {
    pos[0] = mouseX;
    pos[1] = mouseY;
    // Add current mouseX/mouseY-Array to Array-List
    polygon.add(pos);
 
    // Show contents of shape
    for(int i = 0; i < polygon.size(); i++) {
      println("POLYGON "+ i + " : " + polygon.get(i)[0], polygon.get(i)[1]);
    }
  }
}

void mouseReleased(){
  polygon.clear();
}

```

Here’s the output from the console:

[processing01|344x324](https://discourse.processing.org/uploads/short-url/gYH6Xzvn1ZNZPv2n12CW7inrSq8.png)

Thanks a lot!  
-Jascha!

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [April 2, 2020, 2:05pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336/2 "2020-04-02T14:05:16Z")

</div>

it seems you have to re-new pos

```auto
 if (mousePressed) {
    pos = new int[2];
    pos[0] = mouseX;
    pos[1] = mouseY;

```

**Full code:**

```auto

int[] pos = new int[2]; // mouseX and mouseY position
ArrayList<int[]> polygon = new ArrayList<int[]>(); // List containing many points with mouseX/mouseY positions

void setup() {
  size(500, 500, P2D);
  background(255);
  strokeWeight(1);
  stroke(1);
  fill(255, 0, 0);
}

void draw() {
  if (mousePressed) {
    pos = new int[2];
    pos[0] = mouseX;
    pos[1] = mouseY;
    // Add current mouseX/mouseY-Array to Array-List
    polygon.add(pos);
  }
}

void mouseReleased() {
  // polygon.clear();
}

void keyPressed() {
  // Show contents of shape

  for (int i = 0; i < polygon.size(); i++) {
    println("POLYGON "+ i + " : " + polygon.get(i)[0], polygon.get(i)[1]);
  }
}

```

---

<div class="post-metadata">

**Author:** ![jaschag](https://avatars.discourse-cdn.com/v4/letter/j/6a8cbe/32.png) [@jaschag](https://discourse.processing.org/u/jaschag)\
**Post date:** [April 2, 2020, 3:24pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336/3 "2020-04-02T15:24:06Z")

</div>

Wow, that was fast, thanks a lot Chrisir!

Do you have any clue as to why that is the case? Shouldn’t overwriting elements of an array work without redeclaring the array?

For example:

```auto
int[] array = new int[2];

void draw() {
  array[0] = -1;
  array[1] = -2;
  println(array);

  array[0] = 5;
  array[1] = 6;
  println(array);
  print("\n ____________ \n\n");
}

```

The code above outputs:

> [0] -1  
> [1] -2  
> [0] 5  
> [1]
> 
> * * *
> 
> [0] -1  
> [1] -2  
> [0] 5  
> [1] 6
> 
> * * *
> 
> [0] -1  
> [1] -2  
> [0] 5  
> [1] 6

etc.

---

<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:** [April 2, 2020, 3:41pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336/4 "2020-04-02T15:41:44Z")

</div>

An array is also an object and has a reference.

If you **add()** the same array to your ArrayList, you’ll end up w/ an ArrayList filled w/ 1 object only!

---

<div class="post-metadata">

**Author:** ![jaschag](https://avatars.discourse-cdn.com/v4/letter/j/6a8cbe/32.png) [@jaschag](https://discourse.processing.org/u/jaschag)\
**Post date:** [April 2, 2020, 3:50pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336/5 "2020-04-02T15:50:47Z")

</div>

> ```
> pos[0] = mouseX;
> pos[1] = mouseY;
> // Add current mouseX/mouseY-Array to Array-List
> polygon.add(pos);
> 
> ```

But doesn’t the above code replace the array’s content so that the same array but with different numbers inside (the mouse position in each frame) is added every frame?

---

<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:** [April 2, 2020, 4:39pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336/6 "2020-04-02T16:39:27Z")

</div>

> [@jaschag](#):
>
> … so that the same array but with different numbers inside (the mouse position in each frame) is added every frame?

The key here is “same array”. If you’re adding the same array (`polygon.add(pos);`), changing its content will reflect everywhere within _polygon_.

Containers don’t store whole objects, but just their references (memory address).

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [April 2, 2020, 4:46pm UTC](https://discourse.processing.org/t/arraylist-of-arrays-for-interactive-shapes/19336/7 "2020-04-02T16:46:18Z")

</div>

Hello,

I added some points and a print to explore your code.  
You can draw to the screen while mouse is pressed.

Your code with my few modifications:

```auto
int[] pos = new int[2]; // mouseX and mouseY position
ArrayList<int[]> polygon = new ArrayList<int[]>(); // List containing many points with mouseX/mouseY positions

void setup() 
  {
  size(500, 500, P2D);
  background(0);
  strokeWeight(1);
  stroke(1);
  fill(255,0,0);
  }

void draw() 
  {
  if (mousePressed) 
    {
    pos[0] = mouseX;
    pos[1] = mouseY;
    // Add current mouseX/mouseY-Array to Array-List
    polygon.add(pos);
    println(polygon.size());
 
    // Show contents of shape
    for(int i = 0; i < polygon.size(); i++) 
      {
      //println("POLYGON "+ i + " : " + polygon.get(i)[0], polygon.get(i)[1]);
      }
  
// GLV added this to plot points:
    for(int i=0; i < polygon.size(); i++)
      {
      stroke(255, 255, 0);
      strokeWeight(3);
      point(polygon.get(i)[0], polygon.get(i)[1]);
      }
    }
  }

void mouseReleased()
  {
  polygon.clear();
  background(0);
  }

```

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/362734d63faf07337c8d35da3251ce445761ee78.png)

`:)`