Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2024-11-23 13:13:43 +00:00
Code Issues Projects Releases Packages Wiki Activity

SetTransform is a new Canvas Renderer function that consolidates the process of preparing a Game Object for rendering, without actually rendering it. This is used internally by the Graphics and Bitmap Text classes.

Browse source
This commit is contained in:
Richard Davey 2018-08-03 19:02:43 +01:00
parent 8ed749bcb1
commit 708a857a26
6 changed files with 112 additions and 83 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
src/gameobjects/bitmaptext/dynamic/DynamicBitmapTextCanvasRenderer.js
View file

@ -4,6 +4,8 @@
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
var SetTransform = require('../../../renderer/canvas/utils/SetTransform');
/**
* Renders this Game Object with the Canvas Renderer to the given Camera.
* The object will not render if any of its renderFlags are set or it is being actively filtered out by the Camera.
@ -24,7 +26,9 @@ var DynamicBitmapTextCanvasRenderer = function (renderer, src, interpolationPerc
var text = src.text;
var textLength = text.length;
if (textLength === 0)
var ctx = renderer.currentContext;
if (textLength === 0 || !SetTransform(renderer, ctx, src, camera, parentMatrix))
{
return;
}
@ -57,7 +61,7 @@ var DynamicBitmapTextCanvasRenderer = function (renderer, src, interpolationPerc
var lastGlyph = null;
var lastCharCode = 0;
var ctx = renderer.currentContext;
// var ctx = renderer.currentContext;
var image = src.frame.source.image;
var textureX = textureFrame.cutX;
@ -66,35 +70,6 @@ var DynamicBitmapTextCanvasRenderer = function (renderer, src, interpolationPerc
var rotation = 0;
var scale = (src.fontSize / src.fontData.size);
var alpha = camera.alpha * src.alpha;
if (alpha === 0)
{
// Nothing to see, so abort early
return;
}
// Blend Mode
ctx.globalCompositeOperation = renderer.blendModes[src.blendMode];
// Alpha
ctx.globalAlpha = alpha;
ctx.save();
if (parentMatrix)
{
parentMatrix.copyToContext(ctx);
}
ctx.translate(src.x, src.y);
ctx.rotate(src.rotation);
ctx.translate(-src.displayOriginX, -src.displayOriginY);
ctx.scale(src.scaleX, src.scaleY);
if (src.cropWidth > 0 && src.cropHeight > 0)
{
ctx.save();

13
src/gameobjects/bitmaptext/static/BitmapTextCanvasRenderer.js
View file

@ -4,6 +4,8 @@
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
var SetTransform = require('../../../renderer/canvas/utils/SetTransform');
/**
* Renders this Game Object with the Canvas Renderer to the given Camera.
* The object will not render if any of its renderFlags are set or it is being actively filtered out by the Camera.
@ -24,7 +26,9 @@ var BitmapTextCanvasRenderer = function (renderer, src, interpolationPercentage,
var text = src._text;
var textLength = text.length;
if (textLength === 0)
var ctx = renderer.currentContext;
if (textLength === 0 || !SetTransform(renderer, ctx, src, camera, parentMatrix))
{
return;
}
@ -52,7 +56,6 @@ var BitmapTextCanvasRenderer = function (renderer, src, interpolationPercentage,
var lastGlyph = null;
var lastCharCode = 0;
var ctx = renderer.currentContext;
var image = src.frame.source.image;
var textureX = textureFrame.cutX;
@ -78,6 +81,7 @@ var BitmapTextCanvasRenderer = function (renderer, src, interpolationPercentage,
lineOffsetX = (lineData.longest - lineData.lengths[0]);
}
/*
// Alpha
var alpha = camera.alpha * src.alpha;
@ -119,6 +123,11 @@ var BitmapTextCanvasRenderer = function (renderer, src, interpolationPercentage,
ctx.translate(-src.displayOriginX, -src.displayOriginY);
ctx.scale(src.scaleX, src.scaleY);
*/
ctx.translate(-src.displayOriginX, -src.displayOriginY);
var roundPixels = camera.roundPixels;
for (var i = 0; i < textLength; i++)
{

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

@ -5,6 +5,7 @@
*/
var Commands = require('./Commands');
var SetTransform = require('../../renderer/canvas/utils/SetTransform');
/**
* Renders this Game Object with the Canvas Renderer to the given Camera.
@ -28,12 +29,13 @@ var GraphicsCanvasRenderer = function (renderer, src, interpolationPercentage, c
var commandBuffer = src.commandBuffer;
var commandBufferLength = commandBuffer.length;
if (commandBufferLength === 0)
var ctx = renderTargetCtx || renderer.currentContext;
if (commandBufferLength === 0 || !SetTransform(renderer, ctx, src, camera, parentMatrix))
{
return;
}
var ctx = renderTargetCtx || renderer.currentContext;
var lineAlpha = 1;
var fillAlpha = 1;
var lineColor = 0;
@ -43,53 +45,6 @@ var GraphicsCanvasRenderer = function (renderer, src, interpolationPercentage, c
var green = 0;
var blue = 0;
var alpha = camera.alpha * src.alpha;
if (alpha === 0)
{
// Nothing to see, so abort early
return;
}
// Blend Mode
ctx.globalCompositeOperation = renderer.blendModes[src.blendMode];
// Alpha
ctx.globalAlpha = alpha;
ctx.save();
var camMatrix = renderer._tempMatrix1;
var graphicsMatrix = renderer._tempMatrix2;
var calcMatrix = renderer._tempMatrix3;
graphicsMatrix.applyITRS(src.x, src.y, src.rotation, src.scaleX, src.scaleY);
camMatrix.copyFrom(camera.matrix);
if (parentMatrix)
{
// Multiply the camera by the parent matrix
camMatrix.multiplyWithOffset(parentMatrix, -camera.scrollX * src.scrollFactorX, -camera.scrollY * src.scrollFactorY);
// Undo the camera scroll
graphicsMatrix.e = src.x;
graphicsMatrix.f = src.y;
// Multiply by the Sprite matrix, store result in calcMatrix
camMatrix.multiply(graphicsMatrix, calcMatrix);
}
else
{
graphicsMatrix.e -= camera.scrollX * src.scrollFactorX;
graphicsMatrix.f -= camera.scrollY * src.scrollFactorY;
// Multiply by the Sprite matrix, store result in calcMatrix
camMatrix.multiply(graphicsMatrix, calcMatrix);
}
calcMatrix.copyToContext(ctx);
ctx.fillStyle = '#fff';
for (var index = 0; index < commandBufferLength; ++index)

11
src/renderer/canvas/CanvasRenderer.js
View file

@ -522,6 +522,17 @@ var CanvasRenderer = new Class({
this.snapshotEncoder = encoderOptions;
},
/**
* Takes a Sprite Game Object, or any object that extends it, and draws it to the current context.
*
* @method Phaser.Renderer.Canvas.CanvasRenderer#batchSprite
* @since 3.12.0
*
* @param {Phaser.GameObjects.GameObject} sprite - The texture based Game Object to draw.
* @param {Phaser.Textures.Frame} frame - The frame to draw, doesn't have to be that owned by the Game Object.
* @param {Phaser.Cameras.Scene2D.Camera} camera - The Camera to use for the rendering transform.
* @param {Phaser.GameObjects.Components.TransformMatrix} [parentTransformMatrix] - The transform matrix of the parent container, if set.
*/
batchSprite: function (sprite, frame, camera, parentTransformMatrix)
{
var alpha = camera.alpha * sprite.alpha;

3
src/renderer/canvas/index.js
View file

@ -13,6 +13,7 @@ module.exports = {
BlitImage: require('./utils/BlitImage'),
CanvasRenderer: require('./CanvasRenderer'),
DrawImage: require('./utils/DrawImage'),
GetBlendModes: require('./utils/GetBlendModes')
GetBlendModes: require('./utils/GetBlendModes'),
SetTransform: require('./utils/SetTransform')
};

78
src/renderer/canvas/utils/SetTransform.js Normal file
View file

@ -0,0 +1,78 @@
/**
* @author Richard Davey <rich@photonstorm.com>
* @copyright 2018 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
/**
* Takes a reference to the Canvas Renderer, a Canvas Rendering Context, a Game Object, a Camera and a parent matrix
* and then performs the following steps:
*
* 1) Checks the alpha of the source combined with the Camera alpha. If 0 or less it aborts.
* 2) Takes the Camera and Game Object matrix and multiplies them, combined with the parent matrix if given.
* 3) Sets the blend mode of the context to be that used by the Game Object.
* 4) Sets the alpha value of the context to be that used by the Game Object combined with the Camera.
* 5) Saves the context state.
* 6) Sets the final matrix values into the context via setTransform.
*
* This function is only meant to be used internally. Most of the Canvas Renderer classes use it.
*
* @function Phaser.Renderer.Canvas.SetTransform
* @since 3.12.0
*
* @param {Phaser.Renderer.Canvas.CanvasRenderer} renderer - A reference to the current active Canvas renderer.
* @param {Phaser.GameObjects.GameObject} src - The Game Object being rendered. Can be any type that extends the base class.
* @param {Phaser.Cameras.Scene2D.Camera} camera - The Camera that is rendering the Game Object.
* @param {Phaser.GameObjects.Components.TransformMatrix} [parentMatrix] - A parent transform matrix to apply to the Game Object before rendering.
*
* @return {boolean} `true` if the Game Object context was set, otherwise `false`.
*/
var SetTransform = function (renderer, ctx, src, camera, parentMatrix)
{
var alpha = camera.alpha * src.alpha;
if (alpha <= 0)
{
// Nothing to see, so don't waste time calculating stuff
return false;
}
var camMatrix = renderer._tempMatrix1.copyFromArray(camera.matrix.matrix);
var gameObjectMatrix = renderer._tempMatrix2.applyITRS(src.x, src.y, src.rotation, src.scaleX, src.scaleY);
var calcMatrix = renderer._tempMatrix3;
if (parentMatrix)
{
// Multiply the camera by the parent matrix
camMatrix.multiplyWithOffset(parentMatrix, -camera.scrollX * src.scrollFactorX, -camera.scrollY * src.scrollFactorY);
// Undo the camera scroll
gameObjectMatrix.e = src.x;
gameObjectMatrix.f = src.y;
// Multiply by the Sprite matrix, store result in calcMatrix
camMatrix.multiply(gameObjectMatrix, calcMatrix);
}
else
{
gameObjectMatrix.e -= camera.scrollX * src.scrollFactorX;
gameObjectMatrix.f -= camera.scrollY * src.scrollFactorY;
// Multiply by the Sprite matrix, store result in calcMatrix
camMatrix.multiply(gameObjectMatrix, calcMatrix);
}
// Blend Mode
ctx.globalCompositeOperation = renderer.blendModes[src.blendMode];
// Alpha
ctx.globalAlpha = alpha;
ctx.save();
calcMatrix.setToContext(ctx);
return true;
};
module.exports = SetTransform;