Masking with gradien linear alpha

hi everybody. it’s pretty simple to create a mask with a sprite with a gradient effect on top and bottom (in photoshop). but i would like to know how to make a mask with gradient effect (top,bottom) with PIXI.Graphics for make mask blured or gradient effect.

how i can do this ?

var thing = new PIXI.Graphics();
thing.beginFill(0x8bc5ff,0.4);
thing.lineStyle(0);
thing.drawRect(0, 0, 200, 200);
        mtc.mask = thing;
        console.log('mtc: ', mtc);
    return mtc;

good example here http://www.webdesignerwall.com/demo/css-gradient-text/

would like to add a mask with gradient on my text box to allow the wheel of the mouse to descend or mount the text, but with a small gradient alpha++ effect at the end of the boxes. thank a lot

here the context in video https://youtu.be/VKMYn1fqOq4

[ivanpopelyshev]

Btw, you can use sprite with PIXI.Texture.WHITE and width=200; height=200 instead of graphics.

Even more, Graphics that you created in this examples uses inner mechanism called “fast rectangles”, it creates a sprite with PIXI.Texture.WHITE inside.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.