alexzchen

Members
  • Content Count

    34
  • Joined

  • Last visited

  • Days Won

    2

alexzchen last won the day on October 28

alexzchen had the most liked content!

About alexzchen

  • Rank
    Advanced Member

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Thanks very much, I will try it later
  2. hi, in recent days, I am following the website demo to learn the projection plugin, when I convert a TilingSprite to Sprite2D, it will cause an error(uvs is null), but Sprite is ok, is it a bug? const app = new PIXI.Application({ backgroundColor: 0x1099bb }); document.body.appendChild(app.view); const w = app.screen.width / 2; const h = app.screen.height / 2; function createSquare(x, y) { const square = new PIXI.Sprite(PIXI.Texture.WHITE); square.position.set(x, y); square.anchor.set(0.5); return square; } const squares = [ createSquare(w - 150, h - 150), createSquare(w + 150, h - 150), createSquare(w + 150, h + 150), createSquare(w - 150, h + 150), ]; const quad = squares.map((s) => s.position); const tilingSprite = PIXI.TilingSprite.from("examples/assets/flowerTop.png",200,200); tilingSprite.anchor.set(0.5) tilingSprite.convertTo2d(); //convertTo2d,tilingSpite throw an error, Spite is ok app.stage.addChild(tilingSprite); squares.forEach((s) => { app.stage.addChild(s); }); tilingSprite.proj.mapSprite(tilingSprite, quad);
  3. I tried again with your suggestion, but still have a gray border, and the color looks a little wrong, it seems darker than it used to be use sprite as a mask: https://www.pixiplayground.com/#/edit/QLaZYeWHqrVkkrj-ZRL9h use container https://www.pixiplayground.com/#/edit/DPZGFIoYSgTtkkXSAmPTm
  4. Actually, I remember that I have tried the mask solution a week ago, it will cause gray border, as long as there is a certain transparency on the edge of the picture, so I will try the custom filter first tonight, even though I don't know how to write a filter, hope to succeed
  5. Thanks, I will have a try follow your suggesion
  6. Thanks for reply, I guess the implementation of this 'SpriteMaskFilter' is very similar to the DisplacementFilter, it will give a texture parameter as a sampler and use its pixel information to do multiply, and remove the transparent part at the same time
  7. I come up with a simple idea. Since TillingSprite can handle all the effects of the upper picture that I need, including movement, rotation, displacement, etc., and then I will add a separate custom filter for multiply with lower layer pictures and cut the transparent part, it works like a mask, is my idea feasible? the shader code some like: vec4 sample = texture2D(uSampler, coord); if (gl_FragColor.a != 0.0) { gl_FragColor.rgb = (sample * uColor).rgb * gl_FragColor.rgb; }
  8. I think I already know some reasons, the edge of the picture has some transparency, but the mask does not, so when the picture cut by mask multiply with the lower sprite, the edge will turn black, does it mean that the mask solution is inappropriate in my scene, I should look for other ways?
  9. I think I already know some reasons, the edge of the picture has some transparency, but the mask does not, so when the picture cut by mask multiply with the lower sprite, the edge will turn black, how to solve this problem? In addition, why is the transparent part black , rather than transparent or white when calculating multiply, can I change it?
  10. Hi, I asked a question in an old post yestorday, no one replied, so I recreated a post, the old one is https://www.html5gamedevs.com/topic/44883-using-mask-with-blendmodel-will-result-in-black/?tab=comments#comment-249483 Thanks for your solution again, but I hava another problem, when the lower sprite and mask use the same picture, it will cause a gray border, I'm trying to zoom in the mask picture, and it's going to be obvious, I guess it's because the edge of picture are not clear enough, is there anyway to solve it? here is my code: https://www.pixiplayground.com/#/edit/DPZGFIoYSgTtkkXSAmPTm tks
  11. In principle, if I use the same picture, the cut part by the mask should be exactly the same as the lower picture, there should be no gray border...
  12. Thanks for your solution again, now I hava another problem, when the lower sprite and mask use the same picture, it will cause a gray border, I'm trying to zoom in the mask picture, and it's going to be obvious, I guess it's because the edge of picture are not clear enough, is there anyway to solve it? here is my code: https://www.pixiplayground.com/#/edit/DPZGFIoYSgTtkkXSAmPTm tks
  13. it does works when I set the position 200, thanks