agamemnus Posted September 17, 2014 Share Posted September 17, 2014 I have a loading animation of a circle of jewels rotating around an elephant. It's only a few lines in Canvas but about 20 lines in pixi and I am struggling to get the alpha correct. With Canvas I draw the rotated circle and then the elephant into a separate container, then draw that container with a specific opacity onto the canvas. With pixi, I keep running into the problem of cumulative opacities. (the elephant has a higher opacity than it should) At the moment I'm putting them both into a DisplayObjectContainer and then setting the DisplayObjectContainer's opacity, but nope. Any thoughts on this? Edit: I have resorted to cutting out the blue background circle from my elephant for the moment. It's not perfect but it'll do until I have a real solution. Quote Link to comment Share on other sites More sharing options...
zarstar Posted September 17, 2014 Share Posted September 17, 2014 The only thing that comes into my mind is to use cacheAsBitmap = true; and then apply the opacity. Quote Link to comment Share on other sites More sharing options...
Sebi Posted September 17, 2014 Share Posted September 17, 2014 The DisplayObjectContainer alpha is applied to all its children. parent.alpha * child.alpha Instead of setting the alpha for the DisplayObjectContainer, set the alpha for your Sprite. Quote Link to comment Share on other sites More sharing options...
agamemnus Posted September 17, 2014 Author Share Posted September 17, 2014 SebastianNette, thanks.. getting a clearer picture now.zarstar: that should theoretically work but the behavior of the alpha (such as SebastianNette explained) doesn't change if I cache the display object container as a bitmap. (The caching itself is definitely working, as the ring no longer spins around the elephant, which is a mechanism of the sprites)SebastianNette, thanks.. getting a clearer picture now.zarstar: that should theoretically work but the behavior of the alpha doesn't change even if I cache it as a bitmap. (The caching itself is definitely working, as the ring no longer spins around the elephant, which is a mechanism of the sprites) Quote Link to comment Share on other sites More sharing options...
agamemnus Posted September 24, 2014 Author Share Posted September 24, 2014 Ok. I found the solution. I can set WebGL to blend alpha and color separately... not sure yet what the exact command is or how to best modify pixi.js to do this, but here is a post from StackOverflow for reference, for me and others:http://stackoverflow.com/a/11533416/1136569: Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.