0

I am wondering how I would be able to use animated shapes inside a movieclip that would be acting as a mask?

In my Animate CC canvas file I have an instance (stripeMask) that should mask the below instance called mapAnim.

stripeMask contains shapes that are animating in.

So when the function maskIn is called, the playhead should move to the first frame inside the stripeMask clip (the one after frame 0) and animate the mask like so:

 function maskIn(){
 //maskAnimation to reveal image below
 stripeMask.gotoAndPlay(1);
 }

I love AnimateCC and it works great, but the need for creating more complex and animated masks is there and it's not easy to achieve unless I am missing something here.

Thanks!

user2163224
  • 131
  • 2
  • 3
  • 12

1 Answers1

1

Currently you can only use a Shape as a mask, not a Container or MovieClip.

If you want to do something more complex, you can use something like AlphaMaskFilter, but it has to be cached, and then updated every time the mask OR the content updates:

something.filters = [new createjs.AlphaMaskFilter(stripeMask)];
something cache(0,0,w,h);
// On Change
something.updateCache(); // Re-caches

The source of the AlphaMaskFilter must be an image, so you can either point to a Bitmap image, or a cacheCanvas of a mask clip you have also cached. Note that if the mask changes, the cache has to be updated as well.

This is admittedly not a fantastic solution, and we are working on other options.

Lanny
  • 11,244
  • 1
  • 22
  • 30