Merge pull request #3755 from TadejZupancic/patch-8

Add rounded rectangle to Graphics
This commit is contained in:
Richard Davey 2018-06-19 12:47:58 +01:00 committed by GitHub
commit cc5f1bb91e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -548,6 +548,108 @@ var Graphics = new Class({
return this;
},
/**
* Fill a rounded rectangle with the given position, size and radius.
*
* @method Phaser.GameObjects.Graphics#fillRoundedRect
* @since 3.11.0
*
* @param {number} x - The x coordinate of the top-left of the rectangle.
* @param {number} y - The y coordinate of the top-left of the rectangle.
* @param {number} width - The width of the rectangle.
* @param {number} height - The height of the rectangle.
* @param {number} [radius = 20] - The corner radius; It can also be an object to specify different radii for corners
* @param {number} [radius.tl = 0] Top left
* @param {number} [radius.tr = 0] Top right
* @param {number} [radius.br = 0] Bottom right
* @param {number} [radius.bl = 0] Bottom left
*
* @return {Phaser.GameObjects.Graphics} This Game Object.
*/
fillRoundedRect: function (x, y, width, height, radius)
{
if (typeof radius === 'number')
{
radius = {tl: radius, tr: radius, br: radius, bl: radius};
}
else if (typeof radius === 'object')
{
radius.tl = radius.tl || 0;
radius.tr = radius.tr || 0;
radius.br = radius.br || 0;
radius.bl = radius.bl || 0;
}
else
{
radius = {tl: 20, tr: 20, br: 20, bl: 20};
}
this.beginPath();
this.moveTo(x + radius.tl, y);
this.lineTo(x + width - radius.tr, y);
this.arc(x + width - radius.tr, y + radius.tr, radius.tr, -MATH_CONST.TAU, 0);
this.lineTo(x + width, y + height - radius.br);
this.arc(x + width - radius.br, y + height - radius.br, radius.br, 0, MATH_CONST.TAU);
this.lineTo(x + radius.bl, y + height);
this.arc(x + radius.bl, y + height - radius.bl, radius.bl, MATH_CONST.TAU, Math.PI);
this.lineTo(x, y + radius.tl);
this.arc(x + radius.tl, y + radius.tl, radius.tl, -Math.PI, -MATH_CONST.TAU);
this.fillPath();
return this;
},
/**
* Stroke a rounded rectangle with the given position, size and radius.
*
* @method Phaser.GameObjects.Graphics#strokeRoundedRect
* @since 3.11.0
*
* @param {number} x - The x coordinate of the top-left of the rectangle.
* @param {number} y - The y coordinate of the top-left of the rectangle.
* @param {number} width - The width of the rectangle.
* @param {number} height - The height of the rectangle.
* @param {number} [radius = 20] - The corner radius; It can also be an object to specify different radii for corners
* @param {number} [radius.tl = 0] Top left
* @param {number} [radius.tr = 0] Top right
* @param {number} [radius.br = 0] Bottom right
* @param {number} [radius.bl = 0] Bottom left
*
* @return {Phaser.GameObjects.Graphics} This Game Object.
*/
strokeRoundedRect: function (x, y, width, height, radius)
{
if (typeof radius === 'number')
{
radius = {tl: radius, tr: radius, br: radius, bl: radius};
}
else if (typeof radius === 'object')
{
radius.tl = radius.tl || 0;
radius.tr = radius.tr || 0;
radius.br = radius.br || 0;
radius.bl = radius.bl || 0;
}
else
{
radius = {tl: 20, tr: 20, br: 20, bl: 20};
}
this.beginPath();
this.moveTo(x + radius.tl, y);
this.lineTo(x + width - radius.tr, y);
this.arc(x + width - radius.tr, y + radius.tr, radius.tr, -MATH_CONST.TAU, 0);
this.lineTo(x + width, y + height - radius.br);
this.arc(x + width - radius.br, y + height - radius.br, radius.br, 0, MATH_CONST.TAU);
this.lineTo(x + radius.bl, y + height);
this.arc(x + radius.bl, y + height - radius.bl, radius.bl, MATH_CONST.TAU, Math.PI);
this.lineTo(x, y + radius.tl);
this.arc(x + radius.tl, y + radius.tl, radius.tl, -Math.PI, -MATH_CONST.TAU);
this.strokePath();
return this;
},
/**
* Fill the given point.
*