# Extend PShape (again)

**URL:** <https://discourse.processing.org/t/extend-pshape-again/14609>\
**Category:** Coding Questions\
**Created:** [October 11, 2019, 1:16pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609 "2019-10-11T13:16:39Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Protos](https://avatars.discourse-cdn.com/v4/letter/p/91b2a8/32.png) [@Protos](https://discourse.processing.org/u/Protos)\
**Post date:** [October 11, 2019, 1:16pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/1 "2019-10-11T13:16:39Z")

</div>

Hi,  
For educational purpose I want to write a cleanly structured Pong game in processing.  
For the Ball I’d liked to use PShape inside a class and still have access to all the PShape methods such as setVisibility() etc. Why do I want a wrapper? Because I’d like the Ball to behave like all the other objects in my game, with \*.update() and \*.display() methods etc.  
I looked a [the solution from GoToLoop](https://forum.processing.org/two/discussion/6884/question-about-pgraphics#Item_3). This is very smart, however, I’d like to stay in processing and rather don’t extend with \*.java. Is there another pattern I can use?

Here are snippets from my main file:

```auto
void setup() {
  size(1600, 1200, P2D);
  paddle = new Paddle(width, height);
  ball = new Ball(width, height);
}
...

void draw() {
  background(255);
  paddle.update(deltaTime());  
  paddle.display();
  ball.update(deltaTime());
}

```

Here as example my Paddle class

```auto
class Paddle{
  int objWidth;
  int objHeight;
  color objColor;
  int screenWidth;
  int screenHeight;
  int speed;
  int maxSpeed;
  PVector position = new PVector();
 
 Paddle(int sW, int sH){
   objWidth = 300;
   objHeight = 60;
   objColor = color(100,100,50);
   screenWidth = sW;
   screenHeight = sH;
   speed = 0;
   maxSpeed = 50;
   position.x = 200;
   position.y = screenHeight - 100;
 }
 
 void display(){
   rectMode(CENTER);
   fill(objColor);
   rect(position.x, position.y, objWidth, objHeight);
 }
 
 void moveLeft(){
   speed = -maxSpeed;
 }
 
 void moveRight(){
   speed = maxSpeed;
 }
 
 void stop(){
   speed = 0; 
 } 
 

 void update(float deltaTime){
   int halfObjWidth = objWidth/2;
   position.x += speed;
   //keep in screen
   if(position.x < 0 + halfObjWidth){ position.x = 0 + halfObjWidth; }
   if(position.x > screenWidth - halfObjWidth ){ position.x = screenWidth - halfObjWidth;}
 } 
}

```

So, as stated above, my goal is to structure the Ball class in a similar way, but still using PShape methods.

---

<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:** [October 11, 2019, 1:47pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/2 "2019-10-11T13:47:20Z")

</div>

You could have a PSHape inside the ball class

---

<div class="post-metadata">

**Author:** ![Protos](https://avatars.discourse-cdn.com/v4/letter/p/91b2a8/32.png) [@Protos](https://discourse.processing.org/u/Protos)\
**Post date:** [October 11, 2019, 2:07pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/3 "2019-10-11T14:07:43Z")

</div>

Here is the solution, as provided by KII  
Relevant code snippets:

My main file:

```auto
Paddle paddle;
Ball ball; // the class is in a separate tab

void setup() {
  size(1600, 1200, P2D);
  paddle = new Paddle(width, height);
   ball = new Ball(width, height, 100); // 3rd param is ball diameter
}
...
void draw() {
  background(255);
  paddle.update(deltaTime());  
  paddle.display();
  ball.update(deltaTime());  
  ball.display();
}
...

```

Here my Ball class (abridged version)

```auto
class Ball{
  int diam, screenWidth, screenHeight;
  color objColor;
  PVector speed = new PVector();
  PVector position = new PVector();
  PShape ballshape;
  
  Ball(int _w, int _h, int _diam){
   diam = _diam;
   screenWidth = _w;
   screenHeight = _h;
   speed.set(0, 0);
   position.set(100, 100);
   objColor = color(255, 0, 0);
   ballshape = createShape(ELLIPSE, position.x, position.y, diam, diam);
   ballshape.setStrokeWeight(5.0);
   ballshape.setStroke(color(0,150,55));
   ballshape.setFill(objColor);
  }
  
  void display(){
   shape(ballshape);
  }
  
  void update(){
    // make it move
  }
}

```

I haven’t included the update method yet. I just will reply to my own post, in case someone follows.

---

<div class="post-metadata">

**Author:** ![Protos](https://avatars.discourse-cdn.com/v4/letter/p/91b2a8/32.png) [@Protos](https://discourse.processing.org/u/Protos)\
**Post date:** [October 11, 2019, 2:08pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/4 "2019-10-11T14:08:36Z")

</div>

for some reason I can’t use createShape() in my class.

---

<div class="post-metadata">

**Author:** ![kll](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kll/32/964_2.png) [@kll](https://discourse.processing.org/u/kll)\
**Post date:** [October 11, 2019, 2:19pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/5 "2019-10-11T14:19:03Z")

</div>

> [@Protos](#):
>
> I can’t use createShape() in my class.

```auto

class Ball {
  PShape ballshape;
  int x, y, diam;
  Ball(int _x, int _y, int _diam ) {
    x=_x;
    y=_y;
    diam=_diam;
    ballshape = createShape(ELLIPSE, x, y, diam, diam);
  }
  
  void display() {
    shape(ballshape);
  }
}

Ball ball;
void setup() {
  size(300, 300);
  ball = new Ball(width/2, height/2, 100);
  ball.ballshape.setFill(color(200,0,0));
}
void draw() {
  background(200, 200, 0);
  ball.display();
}

```

works here, can you try?

---

<div class="post-metadata">

**Author:** ![Protos](https://avatars.discourse-cdn.com/v4/letter/p/91b2a8/32.png) [@Protos](https://discourse.processing.org/u/Protos)\
**Post date:** [October 11, 2019, 2:45pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/6 "2019-10-11T14:45:25Z")

</div>

Great, that works! I will update my code for reference. Chapeau

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [October 13, 2019, 5:27pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/7 "2019-10-13T17:27:07Z")

</div>

Thanks for sharing these solutions!

Just a note for others in the future – the thread is called “Extend PShape”, but the solution(s) were to _encapsulate_ PShape (put it inside a class) rather than _extend_ it ([https://processing.org/reference/extends.html](https://processing.org/reference/extends.html)). Encapsulating is _usually_ the better way to go.

---

<div class="post-metadata">

**Author:** ![obidori](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/obidori/32/18493_2.png) [@obidori](https://discourse.processing.org/u/obidori)\
**Post date:** [June 24, 2023, 10:32pm UTC](https://discourse.processing.org/t/extend-pshape-again/14609/8 "2023-06-24T22:32:14Z")

</div>

I encountered the same problem and could not immediately find a solution. I had to look into it, and this is what I came up with.

You can easily extend a **PShape** , but you shall provide a **PGraphics** instance of your **PApplet** to constructor and then pass it to the superclass. So you have to call PShape(PGraphics g, int family) superclass constructor. A quick example:

```auto
Shape myshape;

void setup(){        
    size(400, 400);
    // here is the fun: 'this' is actual PApplet, 
    // and 'g' is a field with PGraphics instance
    myshape = new Shape(this.g);          
    myshape.beginShape();
    myshape.vertex(0, 0);
    myshape.vertex(100,0);
    myshape.vertex(100,100);
    myshape.vertex(0, 100);
    myshape.fill(200, 20, 20);
    myshape.endShape(CLOSE);
}

void draw(){
    shape(myshape, 10,10);
}

class Shape extends PShape{
    Shape(PGraphics g){        
        super(g, GEOMETRY);        
    }
    
    // and here comes all your weird stuff you want to add 
}

```

**UPDATE** : This will work for the standard renderer. But if you want to use something else, you’ll have to create your Shape objects in a completely different way.