crop cannot work with tint in canvas mode #2688

Closed
phoenixyjll opened this Issue Aug 10, 2016 · 4 comments

Projects

None yet

3 participants

@phoenixyjll

This Issue is about (delete as applicable)

  • A bug in the API

For example:

    pic = game.add.sprite(0, 0, 'trsi');
    pic.tint = 0x8CA7E9;
    cropRect = new Phaser.Rectangle(100, 100, 128, 128);
    pic.crop(cropRect);

The code has different behaviors under CANVAS mode and WEBGL mode. In CANVAS mode, the rectangle's (x, y) doesn't work, and pic is always cropped from its top-left.

As for the Phaser source code,
renderSession.context.drawImage(this.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);
(https://github.com/photonstorm/phaser/blob/dev/src/pixi/display/Sprite.js#L495)

it seems that the crop's cx, cy are always 0.

So should I always not use a tint when I need to crop in canvas mode, or it can be fixed so that it has the same behavior as the WEBGL mode?

Thank you.

@AleBles
Contributor
AleBles commented Aug 10, 2016

Using your example I'm not getting the results you're seeing.

the following code:

var sprite = game.add.sprite(20, 20, 'phaser-dude');
sprite.tint = 0x33cc00;
var rect = new Phaser.Rectangle(8, 10, 11, 30);
sprite.crop(rect);

Gives me this for WebGL:
crop_webgl

And this for Canvas:
crop_canvas

@phoenixyjll

Using the Phaser Examples: http://phaser.io/examples/v2/sprites/dynamic-crop#gv, and adding a tint to pic:

function create() {

    pic = game.add.sprite(0, 0, 'trsi');

    w = pic.width;
    h = pic.height;

    pic.tint = 0x33cc00;

    cropRect = new Phaser.Rectangle(0, 0, 128, 128);

    pic.crop(cropRect);

}

Under CANVAS mode:

image

And under WEBGL mode:

image

@phoenixyjll
phoenixyjll commented Aug 12, 2016 edited

BTW, I'm using Google Chrome 49.0.2623.110 m.

And the result is the same after I updated it to 52.0.2743.116 m.

@photonstorm photonstorm added a commit that referenced this issue Aug 18, 2016
@photonstorm A tinted Texture in Canvas mode wouldn't be updated properly if it wa…
…s also cropped, beyond the initial crop. Now a cropped texture will re-tint itself every time the crop is updated, and has changed (thanks @phoenixyjll #2688)
4382944
@photonstorm
Owner

Thanks for submitting this issue. We have fixed this, and the fix has been pushed to the dev branch.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment