search

airbnb / lottie-web

Render After Effects animations natively on Web, Android and iOS, and React Native. http://airbnb.io/lottie/
MIT License
30.58k stars 2.88k forks source link

Simple alpha track Matte masking issue #1734

Open itsanthonymeric opened 5 years ago

itsanthonymeric commented 5 years ago

Hi,

Browser Version: Google Chrome (Version 75.0.3770.142) After Effects Version: CC 2019 16.1.1

I have a simple path animation in AE and I'm trying to mask it with an alpha track matte. I created a .json file with bodymovin and I found that the mask doesn't work correctly in the browser. It's a very simple animation, no effect, only shapes and alpha track matte.

Thanks a lot for your help!

Anthony

itsanthonymeric commented 5 years ago

I finally found the workaround by adding a rectangle inside the shapes (not the masks) with a fill and its opacity turned to 0%. All the masks work perfecly fine now!

ision-industries commented 4 years ago

@itsanthonymeric I might be struggling with the same issue. So from my understanding for this project you had one shape layer and another layer that is the track matte mask?

Where did you add the rectangle? The animated path layer or the track matte mask layer?

itsanthonymeric commented 4 years ago

@ision-industries basically, no track mask, instead I precomposed the shape layer, then used a regular mask animated on the comp and it worked just fine.

ision-industries commented 4 years ago

@itsanthonymeric would you happen to have the AE project file with the fixed workaround by chance? I am still struggling with this problem and maybe your workaround might help, I just want to see how your project is structured.

mattspieg commented 2 years ago

@ision-industries they are referring to this: https://youtu.be/E0ruESAnQ7s?t=138