Leaderboard


Popular Content

Showing content with the highest reputation on 03/21/2019 in all areas

  1. 1 point
    jonforum

    Fading trail

    Masks is to be avoided as far as possible. I use 1 or two only in some context, and my cpu get sick very fast. So for me , no i dont think masks will be more performance friendly than the demo mouse trail . but I suppose it can vary in many contexts. The best and most painful solution will be to test the 2 and check the cpu performance with a debugger SDK or web tools. but in my personals tests, result told me to avoid as much as possible the use of mask in my project. wihout i get ~ 10 to 12% work
  2. 1 point
    ivan.popelyshev

    Fading trail

    Here's the second one, super-v5 stuff: https://pixijs.io/examples/?v=v5.0.0-rc.2#/textures/gradient-resource.js Yes, you can use it as an alphamask. Why do you need though? Your trail is simple rectangle, right? In fact, that's one of common mask use-cases in Flash: alpha gradients. Its shame we cant replicate all that Flash stuff even after several years of coding.
  3. 1 point
    ivan.popelyshev

    Fading trail

    First demo will be here in 5 minutes or so : https://pixijs.io/examples/#/textures/gradient-basic.js It took me only one cup of soothing tea.
  4. 1 point
    jonforum

    Fading trail

    I will interest by this later, because I remember that I will need to look this at it in depth. In fact I wanted to be able to generate texture guardian to apply this on a text box to generate a fadding mask text when scrolling the box. And the box are dynamic size, so i can not use photoshop in this context!, scaling the image will also scale the linear mask picture and give weird result. it's an old test with a filter for fake linear, but the subject is interesting. But am not energized to test it now . 😴
  5. 1 point
    jonforum

    Fading trail

    What about create you gradient in other canvas. https://www.w3schools.com/graphics/canvas_gradients.asp var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); // Create gradient var grd = ctx.createLinearGradient(0, 0, 200, 0); grd.addColorStop(0, "red"); grd.addColorStop(1, "white"); // Fill with gradient ctx.fillStyle = grd; ctx.fillRect(10, 10, 150, 80); and than, create `generate` a texture from this canvas context ? Am sure it can work ... but at the expense of performance. I do not remember which one, but there is a rpgmaker plugin that used this process with pixijs.
  6. 1 point
    ivan.popelyshev

    Fading trail

    Basically what do I want: I create gradient for Canvas2d or make it manually, and then upload that canvas with fromCanvas() or from() or more sophisticated method. Alternatively: there is difficult implementation of meshes with colored shaders in https://github.com/gameofbombs/pixi-heaven : https://gameofbombs.github.io/examples-heaven/#/mesh/rope-colored.js . Modify it to affect sprites-only and make it simple if you think you have enough time to learn it. Here, I gave you ALL the code I have regarding gradients. You can wait for other guys but as far as I know no one else cares about gradients except you and I. Maybe there's a lurker Again, PHOTOSHOP is your best friend. I still dont understand why dont you like "make a texture in photoshop" approach.
  7. 1 point
    ivan.popelyshev

    Fading trail

    Better to ask third time in same subforum Make a png in photoshop and make a sprite or wait when I fix that code to work in v5: https://gist.github.com/ivanpopelyshev/6128a6b31f1a7f51d536b369a3812ecf
  8. 1 point