Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2024-11-26 14:40:38 +00:00
Code Issues Projects Releases Packages Wiki Activity

Fixed the way the arc overshoot works.

Browse source
This commit is contained in:
Richard Davey 2018-08-23 12:31:55 +01:00
parent 57758942d1
commit 5443f9cf5a
4 changed files with 39 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
CHANGELOG.md
View file

@ -230,12 +230,13 @@ Setting the `resolution` property in the Game Config to a value other than 1 wou
* The `getPixelAlpha` method in the Texture Manager wasn't using the correct frame name. This is now passed in correctly. Fix #3937 (thanks @goldfire)
* The `getPixelAlpha` and `getPixel` methods in the Texture Manager would allow x/y coordinates from outside the cut area of a frame. It now tests to ensure they're within the frame. Fix #3937 (thanks @goldfire)
* A Game Object couldn't have a blend mode of `SKIP_TEST` set by using the getter or the `setBlendMode` method.
* In Arcade Physics the `World.disable` call was passing the wrong argument, so never disabling the actual body (thanks @samme)
### Examples, Documentation and TypeScript
My thanks to the following for helping with the Phaser 3 Examples, Docs and TypeScript definitions, either by reporting errors, fixing them or helping author the docs:
@SBCGames @rgk @rook2pawn @robbintt @bguyl @halilcakarr @PhaserEditor2D @Edwin222 @tfelix @Yudikubota @hexus @guzmonne @ampled @thanh-taro @dcbriccetti @Dreaded-Gnu @padme-amidala @rootasjey @ampled @thejonanshow @polarstoat @jdjoshuadavison @alexeymolchan
@SBCGames @rgk @rook2pawn @robbintt @bguyl @halilcakarr @PhaserEditor2D @Edwin222 @tfelix @Yudikubota @hexus @guzmonne @ampled @thanh-taro @dcbriccetti @Dreaded-Gnu @padme-amidala @rootasjey @ampled @thejonanshow @polarstoat @jdjoshuadavison @alexeymolchan @samme
Thanks to @khaleb85 for fixing the super-annoying lag on the API Docs pages when it hung the browser while indexing the search field.

72
src/gameobjects/graphics/Graphics.js
View file

@ -1213,8 +1213,12 @@ var Graphics = new Class({
*
* This method can be used to create circles, or parts of circles.
*
* Use the optional `overshoot` argument to allow the arc to extend beyond 360 degrees. This is useful if you're drawing
* an arc with an especially thick line, as it will allow the arc to fully join-up. Try small values at first, i.e. 0.01.
* Make sure you call `beginPath` before starting the arc unless you wish for the arc to automatically
* close when filled or stroked.
*
* Use the optional `overshoot` argument increase the number of iterations that take place when
* the arc is rendered in WebGL. This is useful if you're drawing an arc with an especially thick line,
* as it will allow the arc to fully join-up. Try small values at first, i.e. 0.01.
*
* Call {@link Phaser.GameObjects.Graphics#fillPath} or {@link Phaser.GameObjects.Graphics#strokePath} after calling
* this method to draw the arc.
@ -1228,7 +1232,7 @@ var Graphics = new Class({
* @param {number} startAngle - The starting angle, in radians.
* @param {number} endAngle - The ending angle, in radians.
* @param {boolean} [anticlockwise=false] - Whether the drawing should be anticlockwise or clockwise.
* @param {number} [overshoot=0] - This value allows you to overshoot the endAngle by this amount. Useful if the arc has a thick stroke and needs to overshoot to join-up cleanly.
* @param {number} [overshoot=0] - This value allows you to increase the segment iterations in WebGL rendering. Useful if the arc has a thick stroke and needs to overshoot to join-up cleanly. Use small numbers such as 0.01 to start with and increase as needed.
*
* @return {Phaser.GameObjects.Graphics} This Game Object.
*/
@ -1237,38 +1241,9 @@ var Graphics = new Class({
if (anticlockwise === undefined) { anticlockwise = false; }
if (overshoot === undefined) { overshoot = 0; }
var PI2 = Math.PI * 2;
if (anticlockwise)
{
if (endAngle < -PI2)
{
endAngle = -PI2 - overshoot;
}
else if (endAngle >= 0)
{
endAngle = -PI2 + endAngle % PI2 - overshoot;
}
}
else
{
endAngle -= startAngle;
endAngle += overshoot;
if (endAngle > PI2 + overshoot)
{
endAngle = PI2 + overshoot;
}
else if (endAngle < -overshoot)
{
endAngle = PI2 + endAngle % PI2 - overshoot;
}
}
this.commandBuffer.push(
Commands.ARC,
x, y, radius, startAngle, endAngle, anticlockwise
x, y, radius, startAngle, endAngle, anticlockwise, overshoot
);
return this;
@ -1302,40 +1277,11 @@ var Graphics = new Class({
if (anticlockwise === undefined) { anticlockwise = false; }
if (overshoot === undefined) { overshoot = 0; }
var PI2 = Math.PI * 2;
if (anticlockwise)
{
if (endAngle < -PI2)
{
endAngle = -PI2 - overshoot;
}
else if (endAngle >= 0)
{
endAngle = -PI2 + endAngle % PI2 - overshoot;
}
}
else
{
endAngle -= startAngle;
endAngle += overshoot;
if (endAngle > PI2 + overshoot)
{
endAngle = PI2 + overshoot;
}
else if (endAngle <= -overshoot)
{
endAngle = PI2 + endAngle % PI2 - overshoot;
}
}
this.commandBuffer.push(Commands.BEGIN_PATH);
this.commandBuffer.push(Commands.MOVE_TO, x, y);
this.commandBuffer.push(Commands.ARC, x, y, radius, startAngle, endAngle, anticlockwise);
this.commandBuffer.push(Commands.ARC, x, y, radius, startAngle, endAngle, anticlockwise, overshoot);
this.commandBuffer.push(Commands.CLOSE_PATH);

4
src/gameobjects/graphics/GraphicsCanvasRenderer.js
View file

@ -62,7 +62,9 @@ var GraphicsCanvasRenderer = function (renderer, src, interpolationPercentage, c
commandBuffer[index + 5],
commandBuffer[index + 6]
);
index += 6;
// +7 because overshoot is the 7th value, not used in Canvas
index += 7;
break;
case Commands.LINE_STYLE:

27
src/gameobjects/graphics/GraphicsWebGLRenderer.js
View file

@ -93,6 +93,7 @@ var GraphicsWebGLRenderer = function (renderer, src, interpolationPercentage, ca
var ty = 0;
var ta = 0;
var iterStep = 0.01;
var PI2 = Math.PI * 2;
var cmd;
@ -195,8 +196,30 @@ var GraphicsWebGLRenderer = function (renderer, src, interpolationPercentage, ca
var radius = commands[++cmdIndex];
var startAngle = commands[++cmdIndex];
var endAngle = commands[++cmdIndex];
var anticlockwise = commands[++cmdIndex];
var overshoot = commands[++cmdIndex];
cmdIndex++; // anticlockwise (canvas only)
endAngle -= startAngle;
if (anticlockwise)
{
if (endAngle < -PI2)
{
endAngle = -PI2;
}
else if (endAngle > 0)
{
endAngle = -PI2 + endAngle % PI2;
}
}
else if (endAngle > PI2)
{
endAngle = PI2;
}
else if (endAngle < 0)
{
endAngle = PI2 + endAngle % PI2;
}
if (lastPath === null)
{
@ -205,7 +228,7 @@ var GraphicsWebGLRenderer = function (renderer, src, interpolationPercentage, ca
iteration += iterStep;
}
while (iteration < 1)
while (iteration < 1 + overshoot)
{
ta = endAngle * iteration + startAngle;
tx = x + Math.cos(ta) * radius;