Skip to main content
New Participant
November 29, 2019
Answered

Help! In Animate the color fill disappears between two keyframes with tweening

  • November 29, 2019
  • 2 replies
  • 4087 views

Hai Everybody! I recently started exploring Adobe Animate. I'm following tutorials, and have fun with it. If I happen to make something work correctly, I´m happy as a clapping seal, but there are these little obstacles I somehow just can´t get passed, and after days of trying, I must admit frustration takes over...:-S

 

Here's my current problem:

I created a simple image, using the pen-tool, and next I created several Key-frames based on that image, just in several extreme oposite positions (e.g. on frame 1,9,18,27 and 36 in a 24 frames per second document). Between these keyframes, I used tweeing, using the regular procedure: 'create shape tween', and I tweeked out the irregularities using Shape Hints.

So far, so good.

If I play my animation on a loop, all looks good.

The problem started after I decided I wanted to fill my shape using the bucket tool.

I did so, on every keyframe, all still looking good.

But if I play my animation in a loop now, the tween between keyframes 18 and 27 does something unexpected(to me): the color fill disappears at this point in my timeline.

If I select keyframe 18, the color fill looks O.K., If I select keyframe 27, the colorfill looks OK, but somehow on te tweenframes 19-26, the colorfill disappears. 

And despite trying everything I could imagine, including starting all over again, with the entire keyframes, I just can't get a colour-fill in this shape tween. And the weirdest thing to me is: it DOES work perfectly fine on all the other tweens, although I did the exact same thing there...?!

 

Can anyone help me out here, and tell me what rooky-mistake I'm making here? It's no-doubt too simple to get wrong, but some-how, I can't get it right..

 

Thanks!

This topic has been closed for replies.
Correct answer n. tilcheff

Hi mate,

 

Separate the line from the fill onto two separate layers. Then deal with each one as a separate object if you need with Shape Hints.

 

Hope this helps!

 

2 replies

New Participant
December 1, 2022

After duplicating a shape in Adobe Animate, why is there no different color in both shapes, what is the solution

n. tilcheff
n. tilcheffCorrect answer
Brainiac
November 29, 2019

Hi mate,

 

Separate the line from the fill onto two separate layers. Then deal with each one as a separate object if you need with Shape Hints.

 

Hope this helps!

 

Nick - Character Designer and Animator, Flash user since 1998 | Member of the Flanimate Power Tools team - extensions for character animation
New Participant
November 29, 2019

Hai Nick,

Thanks for your quick response!

I've been trying your tip, at first I thought I made it; throughout the entire loop I had a color fill for all my tweens,.. except now when I played the loop I had a wonky shape Hint in one of my tweens. So I fixed that, but after I did, I had the same problem all over again. So I started from scratch, -again- the outline and the fill on two separate layers, but no matter how I try, I cannot get...

 

Ohw! Wait 🙂  bashful me!!!

I had one of the layers hidden, because I clicked on the Eye-symbol next to my layer on the timeline, since that was easier during the editing-stage.. Now that I clicked on the Eye-symbol again, and both layers are shown, if I play the loop: miraculously the fill is indeed showing exactly as it should!! Wow!

Could have saved myself a few hours of bungling there, if only I had both layers showing 🙂  Oh well.. at least I won't ever make that mistake again 😉

 

I still don't understand Adobe's logic behind having to split-up the outline and the fill onto two separate layers in order for it to work, but I'm glad I know that THAT's the fix! 

Thanks ever so much, I would never have figured that out without your help!

 

 

But wait.. If I now hide one of the layers again, just to see if the fill disappears again in the tween, the color fill remains perfectly fine.. 

? It scrambles me big-time, but it seems to work for now. I hope that I can reproduce that somehow on my next little project, because it feels a little like it was more sheer luck that it all ended up just fine now, instead of me actually propperly knowing what I'm doing here 🙂

Anyway: I'll definitely use your advice from now on, since that was the change after which it all turned out O.K., So thanks so much!

 

 

 

n. tilcheff
Brainiac
November 30, 2019

Hi again, mate!

 

I'm glad you got it working!

 

Shape Tweens are a bit temperamental. 

They only work well with single objects in a layer and fairly simple shapes.

So often you may end up splitting your drawings into multiple layers to have them Shape Tween without issues.

Also: only use hints when you need to and try to use as few as possible. Sometimes they can be placed between points, but in most cases should be on the point.

They are supposed to be read in counter clockwise direction from top-right, so this is the best way to place them.

 

For best control you should nest shape tweens inside Graphic containers, so that you can move, scale, flip and so on on the outside.

A combination of techniques can produce optimal results.

 

I use Shape Tweens all the time, but in the case of these jellyfish that come at about 10 sec in the video - they are nearly 100% Shape Tweened.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Since you seem to be keen to learn and improve, here are two of articles that I wrote which may be helpful to get you going.

http://flash-powertools.com/character-rigging-for-flash-animation/

http://flash-powertools.com/workflow/

 

Good luck!

 

 

Nick - Character Designer and Animator, Flash user since 1998 | Member of the Flanimate Power Tools team - extensions for character animation