Setter/getter usage in PIXI

[Freckles]

class Image extends PIXI.Graphics {

    radius;
    constructor(points, myHeight, myWidth, myRadius, buttonColor, imagePath) {
        super();

        this.imagePath = imagePath;
        let image = new PIXI.Sprite.from(imagePath);
        
        let w = this.myWidth = myWidth || image.width + 40;
        let h = this.myHeight = myHeight|| image.height + 20;
        let r = this.myRadius = myRadius || 5;
        let bc = this.buttonColor = buttonColor || '0x0000FF';      

        this.points = points;
        this.position.set(points[0], points[1]);
        let myButton = new PIXI.Graphics();
        myButton.beginFill(bc);
        myButton.drawRoundedRect(points[0], points[1], w, h, r);
        myButton.endFill();

        this.addChild(myButton);
        let buttonTopPadding = (w - image.width) / 2;
        let buttonLeftPadding = (h - image.height) / 2;
        image.position.set(points[0] + buttonTopPadding, points[1] + buttonLeftPadding);
        image.anchor.set(0.5, 0.5);
        myButton.addChild(image);
    }

    set radius(radius){
        this.radius = radius;
    }

    get radius(){
        return this.radius;
    }
}

export { Image };

I wrote this code to understand the usage of setters and getters. It creats a button that has icon in the middle. I want to change the radius via setter. I do so and it doesn't work, but console.log(img.radius) results 25. 

let img = new Image([200, 150], 50, 50, null, '0x034687', './images/close.png');
app.stage.addChild(img);
img.radius = 25;
console.log(img.radius);

I generally want to understand the usage of setters. And if I've added text to a stage how can I update that via setter?

[ivan.popelyshev]

small stuff:

1. no need to extend Graphics, simple Container is enough in your case

2. PIXI.Sprite.from is not a constructor, you can omit "new".

big stuff:

your setters and getter are recursions. use `myRadius` inside, and in setter you have to check - if it was changed - "myButton.clear()" and make drawRoundedRect in it again.

Edited May 13, 2020 by ivan.popelyshev

[Freckles]

Your answer was helpful as always))

thank you!