# New to processing, I need some help with classes

**URL:** <https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156>\
**Category:** Coding Questions\
**Created:** [January 18, 2020, 12:48pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156 "2020-01-18T12:48:12Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![bugotc14](https://avatars.discourse-cdn.com/v4/letter/b/35a633/32.png) [@bugotc14](https://discourse.processing.org/u/bugotc14)\
**Post date:** [January 18, 2020, 12:48pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/1 "2020-01-18T12:48:12Z")

</div>

yesterday I tried to make a program that displays a cool ellipse with ellipses around it and I made it and everything worked fine,

I made a class named DotsArray and made the ellipse array an object, I even added a feature that lets you position the object according to the mouse and everything worked great, and its steal works but then I decided to make every ellipse an object so I can have more flexibility in the colors and alphas.  
so I wrote the ellipse object in a separate sketch and it worked fine but then when I tried to add it to the main code and nothing worked.  
The code is not broken and will run without the class but if I change one of the ellipses to the ellipse object they just won’t be displayed.

someone can please help me with the code? I’m new to coding (1 week since I started  
doing things) and I have beginner knowledge but I’m a fast learner so don’t be afraid to use more advanced level code.  
**the code -**  
MAIN FOLDER -  
DotsArray ar1 = new DotsArray(50,50,0,0);  
void setup()  
{  
fill(random(0,255),random(0,255),random(0,255));  
size(1000,800);  
background(0);  
strokeWeight(2.5 );  
ellipseMode(RADIUS);  
}

void draw()  
{  
ar1.display();  
ar1.DAMove();  
}  
void mousePressed()  
{  
fill(random(0,255),random(0,255),random(0,255));  
}  
**The Folder With The Object**  
class DotsArray  
{

//The variables  
float Xpos; //the Middle X  
float Ypos; //the Middle Y  
float Xsize;//the ellipse X size  
float Ysize;//the ellipse Y size  
float XposDelta; //delta from Xmouse position for multi objects array.  
float YposDelta; //delta from Xmouse position for multi objects array.  
//end of the variables

//start of the elipse construction  
Ellipse ellipse0 = new Ellipse(Xpos,Ypos,Xsize,Ysize);  
//end of the elipse construction

//start of the Variable setup  
DotsArray (float IXsize, float IYsize, float IXposDelta, float IYposDelta)  
{  
Ysize = IYsize;  
Xsize = IXsize;  
XposDelta = IXposDelta;  
YposDelta = IYposDelta;  
//end of the Variable setup  
}

/_**/  
/ THE ELLIPSE OBJECT /  
/**_/  
class Ellipse  
{  
float XEpos,YEpos;  
float XEsize,YEsize;  
Ellipse (float IXEpos, float IYEpos,float IXEsize, float IYEsize)  
{  
XEpos = IXEpos; //The Chain - Dots Array XPos\>ELlipse IXEpos\>ellipse XPos\>ellipse setup  
YEpos = IYEpos; //The Chain - Dots Array YPos\>ELlipse IYEpos\>ellipse YPos\>ellipse setup  
XEsize = IXEsize; //The Chain - Dots Array Xsize\>ELlipse IXEsize\>Ellipse Xsize\>ellipse setup  
YEsize = IYEsize; //The Chain - Dots Array Ysize\>ELlipse IYEsize\>Ellipse YEsize\>ellipse setup  
}

```
void display() //draws the ellipse
{
  ellipse(XEpos,YEpos,XEsize,YEsize);
}

```

}  
/_**/  
/ END OF THE ELLIPSE OBJECT /  
/**_/

void display() {  
ellipse(Xpos,Ypos,Xsize,Ysize); //middle  
ellipse(Xpos - Xsize_1.7,Ypos,Xsize/1.5,Ysize/1.5); //left  
ellipse(Xpos + Xsize_1.7,Ypos,Xsize/1.5,Ysize/1.5); //right  
ellipse(Xpos ,Ypos - Ysize_2 ,Xsize/1.5 ,Ysize/1.5); // high  
ellipse(Xpos ,Ypos + Ysize_2,Xsize/1.5 ,Ysize/1.5); // low  
ellipse(Xpos - Xsize_1.7,Ypos - Ysize_1.7,Xsize/1.5,Ysize/1.5); // top left  
ellipse(Xpos + Xsize_1.7,Ypos - Ysize_1.7 ,Xsize/1.5 ,Ysize/1.5); // top right  
ellipse(Xpos + Xsize_1.7 ,Ypos + Ysize_1.7 ,Xsize/1.5 ,Ysize/1.5); // low right  
ellipse(Xpos - Xsize_1.7 ,Ypos + Ysize_1.7,Xsize/1.5 ,Ysize/1.5); // low left  
}  
void DAMove()  
{  
Xpos = mouseX + XposDelta;  
Ypos = mouseY + YposDelta;  
}  
}

---

<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:** [January 18, 2020, 1:45pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/2 "2020-01-18T13:45:30Z")

</div>

Hello,

and welcome to the forum!

Good to have you here!

Hm.

I looked at your code and made a working code.

You had the class Ellipse INSIDE the class DotsArray.

This is possible but unusual.

I put class Ellipse BEHIND the class DotsArray now.

Also, because you posted your code not as code some `*` got lost. I corrected this.

Anyway, at the moment, DotsArray ar1 is not an array and class DotsArray doesn’t use the class Ellipse really (it’s not used).

Depending from what you want to achieve you want to make an array of ellipses (objects of the class Ellipse) inside class DotsArray. Then you would store the ellipses data and draw from the array; then you would also use `background()` at the start of draw() to have a fresh canvas every frame and just draw what is stored. Without background you see on the screen everything that has been drawn accumulated (and you don’t see the data you stored).  
I haven’t started this yet.

I welcome your feedback.

Regards, Chrisir

```auto

// MAIN TAB 
DotsArray ar1 = new DotsArray(50, 50, 0, 0);

void setup() {
  size(1000, 800);
  background(0);
  strokeWeight(2.5 );
  ellipseMode(RADIUS);
  fill(random(0, 255), random(0, 255), random(0, 255));
}

void draw() {
  ar1.DADisplay();
  ar1.DAMove();
}

void mousePressed() {
  fill(random(0, 255), random(0, 255), random(0, 255));
}

// ================================================================================
// The TAB With The CLASS DotsArray

class DotsArray {

  //The variables
  float Xpos; //the Middle X
  float Ypos; //the Middle Y
  float Xsize;//the ellipse X size
  float Ysize;//the ellipse Y size
  float XposDelta; //delta from Xmouse position for multi objects array.
  float YposDelta; //delta from Xmouse position for multi objects array.
  //end of the variables

  //start of the elipse construction
  // Ellipse ellipse0 = new Ellipse(Xpos, Ypos, Xsize, Ysize);
  //end of the elipse construction

  //start of the Variable setup
  DotsArray (float IXsize, float IYsize, 
    float IXposDelta, float IYposDelta) {

    Ysize = IYsize;
    Xsize = IXsize;
    XposDelta = IXposDelta;
    YposDelta = IYposDelta;
    //end of the Variable setup
  }

  void DADisplay() {
    ellipse(Xpos, Ypos, Xsize, Ysize); //middle
    ellipse(Xpos - Xsize*1.7, Ypos, Xsize/1.5, Ysize/1.5); //left
    ellipse(Xpos + Xsize*1.7, Ypos, Xsize/1.5, Ysize/1.5); //right
    ellipse(Xpos, Ypos - Ysize*2, Xsize/1.5, Ysize/1.5); // high
    ellipse(Xpos, Ypos + Ysize*2, Xsize/1.5, Ysize/1.5); // low
    ellipse(Xpos - Xsize*1.7, Ypos - Ysize*1.7, Xsize/1.5, Ysize/1.5); // top left
    ellipse(Xpos + Xsize*1.7, Ypos - Ysize*1.7, Xsize/1.5, Ysize/1.5); // top right
    ellipse(Xpos + Xsize*1.7, Ypos + Ysize*1.7, Xsize/1.5, Ysize/1.5); // low right
    ellipse(Xpos - Xsize*1.7, Ypos + Ysize*1.7, Xsize/1.5, Ysize/1.5); // low left
  }

  void DAMove() {
    Xpos = mouseX + XposDelta;
    Ypos = mouseY + YposDelta;
  }
}// class 

// ========================================================================================================================
// THE ELLIPSE CLASS /
//
class Ellipse22222222222222222222222222 { // ???????????????????????????????????????

  float XEpos, YEpos;
  float XEsize, YEsize;

  Ellipse22222222222222222222222222 (float IXEpos, float IYEpos, float IXEsize, float IYEsize) {
    XEpos = IXEpos; //The Chain - Dots Array XPos>ELlipse IXEpos>ellipse XPos>ellipse setup
    YEpos = IYEpos; //The Chain - Dots Array YPos>ELlipse IYEpos>ellipse YPos>ellipse setup
    XEsize = IXEsize; //The Chain - Dots Array Xsize>ELlipse IXEsize>Ellipse Xsize>ellipse setup
    YEsize = IYEsize; //The Chain - Dots Array Ysize>ELlipse IYEsize>Ellipse YEsize>ellipse setup
  }

  void display() //draws the ellipse
  {
    //ellipse(XEpos, YEpos, XEsize, YEsize);
  }
  //
} // END OF THE ELLIPSE CLASS /
//

```

---

<div class="post-metadata">

**Author:** ![bugotc14](https://avatars.discourse-cdn.com/v4/letter/b/35a633/32.png) [@bugotc14](https://discourse.processing.org/u/bugotc14)\
**Post date:** [January 18, 2020, 4:39pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/3 "2020-01-18T16:39:16Z")

</div>

thanks a lot for the attention and the help, but it hasn’t really what I meant, my goal is to be able to change

> void DADisplay(){  
> ellipse(Xpos, Ypos, Xsize, Ysize); //middle  
> ellipse(Xpos - Xsize_1.7, Ypos, Xsize/1.5, Ysize/1.5); //left  
> ellipse(Xpos + Xsize_1.7, Ypos, Xsize/1.5, Ysize/1.5); //right  
> ellipse(Xpos, Ypos - Ysize_2, Xsize/1.5, Ysize/1.5); // high  
> ellipse(Xpos, Ypos + Ysize_2, Xsize/1.5, Ysize/1.5); // low  
> ellipse(Xpos - Xsize_1.7, Ypos - Ysize_1.7, Xsize/1.5, Ysize/1.5); // top left  
> ellipse(Xpos + Xsize_1.7, Ypos - Ysize_1.7, Xsize/1.5, Ysize/1.5); // top right  
> ellipse(Xpos + Xsize_1.7, Ypos + Ysize_1.7, Xsize/1.5, Ysize/1.5); // low right  
> ellipse(Xpos - Xsize_1.7, Ypos + Ysize_1.7, Xsize/1.5, Ysize/1.5); // low left  
> }

**to**

> Ellipse ellipse0 = new Ellipse(Xpos, Ypos, Xsize, Ysize); //middle  
> Ellipse ellipse1 = new Ellipse(Xpos - Xsize_1.7, Ypos, Xsize/1.5, Ysize/1.5); //left  
> Ellipse ellipse2 = new Ellipse(Xpos + Xsize_1.7, Ypos, Xsize/1.5, Ysize/1.5); //right  
> Ellipse ellipse3 = new Ellipse(Xpos, Ypos - Ysize_2, Xsize/1.5, Ysize/1.5); // high  
> Ellipse ellipse4 = new Ellipse(Xpos, Ypos + Ysize_2, Xsize/1.5, Ysize/1.5); // low  
> Ellipse ellipse5 = new Ellipse(Xpos - Xsize_1.7, Ypos - Ysize_1.7, Xsize/1.5, Ysize/1.5); // top left  
> Ellipse ellipse6 = new Ellipse(Xpos + Xsize_1.7, Ypos - Ysize_1.7, Xsize/1.5, Ysize/1.5); // top right  
> Ellipse ellipse7 = new EllipseXpos + Xsize_1.7, Ypos + Ysize_1.7, Xsize/1.5, Ysize/1.5); // low right  
> Ellipse ellipse8 = new Ellipse(Xpos - Xsize_1.7, Ypos + Ysize_1.7, Xsize/1.5, Ysize/1.5); // low left
> 
> void DADisplay(){  
> ellipse0.display;  
> ellipse1.display;  
> ellipse2.display;  
> ellipse3.display;  
> ellipse4.display;  
> ellipse5.display;  
> ellipse6.display;  
> ellipse7.display;  
> ellipse8.display;  
> }

---

<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:** [January 18, 2020, 7:09pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/4 "2020-01-18T19:09:36Z")

</div>

before you end up with variables like

```auto

ellipse0 
ellipse1 
ellipse2

```

you really should look into arrays (list, like a shopping list).

It would look like `ellipse[0], ellipse[1], ellipse[2] ....`

**Further Readings**

See [https://github.com/Kango/Processing-snippets/wiki/Variables,-Arrays-and-object-oriented-programming](https://github.com/Kango/Processing-snippets/wiki/Variables,-Arrays-and-object-oriented-programming)

Also, there is a tutorial about arrays: [https://www.processing.org/tutorials/arrays/](https://www.processing.org/tutorials/arrays/).

You can have arrays which elements are int, but the elements can also be objects, instantiated from a class

---

<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:** [January 18, 2020, 7:30pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/5 "2020-01-18T19:30:21Z")

</div>

P.S.

In your last posts, your `*` vanished again.

When you post code, please select the entire code section and click on `</>` in the small command bar.

Thank you!

Regards,

Chrisir

---

<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:** [January 18, 2020, 7:48pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/6 "2020-01-18T19:48:50Z")

</div>

I made a new version and I can lead you through

---

<div class="post-metadata">

**Author:** ![bugotc14](https://avatars.discourse-cdn.com/v4/letter/b/35a633/32.png) [@bugotc14](https://discourse.processing.org/u/bugotc14)\
**Post date:** [January 20, 2020, 9:12am UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/7 "2020-01-20T09:12:19Z")

</div>

you made a new version of the code?

---

<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:** [January 20, 2020, 9:17am UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/8 "2020-01-20T09:17:32Z")

</div>

Yes, just for my own entertainment.

But I don’t want to spoil the fun for you so soon

---

<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:** [January 20, 2020, 9:22am UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/9 "2020-01-20T09:22:44Z")

</div>

I suggested to go for arrays. Let me correct this.

Inside the class you might as well use what you‘ve said:

Ellipse ellipse0 = new Ellipse(Xpos, Ypos, Xsize, Ysize); //middle  
Ellipse ellipse1 = new Ellipse(Xpos - Xsize _1.7, Ypos, Xsize/1.5, Ysize/1.5); //left  
Ellipse ellipse2 = new E_…  
…  
but note that you can pass the mouseX, mouseY from the function mousePressed to the class. Since the figure doesn’t move you can use the initial position to make the ellipses in the constructor of the class DAarray

And…

DADisplay(){  
ellipse0.display;  
ellipse1.display;  
ellipse2.display;  
ellipse3.display;  
ellipse4.display;  
…

But on sketch level / before setup() I‘d suggest you use an array.

Then background (0); at the start of draw() and a for loop over the array, displaying its content (the stamps with 9 ellipses each)

---

<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:** [January 28, 2020, 9:15am UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/10 "2020-01-28T09:15:05Z")

</div>

progress here?

Wanna see my version?

---

<div class="post-metadata">

**Author:** ![bugotc14](https://avatars.discourse-cdn.com/v4/letter/b/35a633/32.png) [@bugotc14](https://discourse.processing.org/u/bugotc14)\
**Post date:** [January 28, 2020, 2:27pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/11 "2020-01-28T14:27:40Z")

</div>

I decided to left it untill I have enough knowladge to do it, but I would love to see your code, maybe I can learn from it

---

<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:** [January 28, 2020, 3:03pm UTC](https://discourse.processing.org/t/new-to-processing-i-need-some-help-with-classes/17156/12 "2020-01-28T15:03:16Z")

</div>

I hope so!

```auto
// MAIN TAB 

// array / list of stamps
OneStamp[] ar1 = new OneStamp[0];

void setup() {
  size(1000, 800);

  background(0);
  ellipseMode(RADIUS);
}

void draw() {
  background(0);

  fill(255); // white 
  text ("Click mouse to place a stamp", 18, 18);

  for (OneStamp currentStamp : ar1) {
    currentStamp.DADisplay();
  }//for
}

//-------------------------------------------------------------------------------

void mousePressed() {

  // make stamp at mouse position 
  OneStamp newDA = new OneStamp(mouseX, mouseY, 
    50, 50, 
    color (random(0, 255), random(0, 255), random(0, 255)) );

  // add to array 
  ar1 = (OneStamp[]) append (ar1, newDA);
}

// ================================================================================
// The TAB With The CLASS OneStamp

class OneStamp {

  // ONE stamp 

  // VARS
  color col; 

  // make this another array !!! 
  Ellipse ellipse0 ;
  Ellipse ellipse1 ;
  Ellipse ellipse2 ;
  Ellipse ellipse3 ;
  Ellipse ellipse4 ;
  Ellipse ellipse5 ;
  Ellipse ellipse6 ;
  Ellipse ellipse7 ;
  Ellipse ellipse8 ;
  //end of the variables

  //start of the constructor
  OneStamp (float IXpos, float IYpos, 
    float IXsize, float IYsize, 
    color IColor) {

    //The variables
    float Xpos; //the Middle X
    float Ypos; //the Middle Y
    float Xsize;//the ellipse X size
    float Ysize;//the ellipse Y size

    Xpos=IXpos; //the Middle X
    Ypos=IYpos;

    Ysize = IYsize;
    Xsize = IXsize;

    col=IColor;

    ellipse0 = new Ellipse(Xpos, Ypos, Xsize, Ysize); //middle
    ellipse1 = new Ellipse(Xpos - Xsize*1.7, Ypos, Xsize/1.5, Ysize/1.5); // left
    ellipse2 = new Ellipse(Xpos + Xsize*1.7, Ypos, Xsize/1.5, Ysize/1.5); // right
    ellipse3 = new Ellipse(Xpos, Ypos - Ysize*2, Xsize/1.5, Ysize/1.5); // high
    ellipse4 = new Ellipse(Xpos, Ypos + Ysize*2, Xsize/1.5, Ysize/1.5); // low
    ellipse5 = new Ellipse(Xpos - Xsize*1.7, Ypos - Ysize*1.7, Xsize/1.5, Ysize/1.5); // top left
    ellipse6 = new Ellipse(Xpos + Xsize*1.7, Ypos - Ysize*1.7, Xsize/1.5, Ysize/1.5); // top right
    ellipse7 = new Ellipse(Xpos + Xsize*1.7, Ypos + Ysize*1.7, Xsize/1.5, Ysize/1.5); // low right
    ellipse8 = new Ellipse(Xpos - Xsize*1.7, Ypos + Ysize*1.7, Xsize/1.5, Ysize/1.5); // low left
  } //end of the constructor

  void DADisplay() {

    fill(col); 

    ellipse0.display();
    ellipse1.display();
    ellipse2.display();
    ellipse3.display();
    ellipse4.display();
    ellipse5.display();
    ellipse6.display();
    ellipse7.display();
    ellipse8.display();
  }
}// class 

// ========================================================================================================================
// THE ELLIPSE CLASS 
//
class Ellipse {

  // ONE ellipse 

  float XEpos, YEpos;
  float XEsize, YEsize;

  //start of the constructor
  Ellipse (float IXEpos, float IYEpos, 
    float IXEsize, float IYEsize) {

    XEpos = IXEpos; //The Chain - Dots Array XPos>ELlipse IXEpos>ellipse XPos>ellipse setup
    YEpos = IYEpos; //The Chain - Dots Array YPos>ELlipse IYEpos>ellipse YPos>ellipse setup

    XEsize = IXEsize; //The Chain - Dots Array Xsize>ELlipse IXEsize>Ellipse Xsize>ellipse setup
    YEsize = IYEsize; //The Chain - Dots Array Ysize>ELlipse IYEsize>Ellipse YEsize>ellipse setup
  } //end of the constructor

  void display() {
    //draws the ellipse
    ellipse(XEpos, YEpos, 
      XEsize, YEsize);
  }
  //
} // END OF THE ELLIPSE CLASS
//

```