7 Replies Latest reply on Feb 14, 2010 6:35 PM by Harry Kunz

    Trouble creating smooth transitions from one gradient to another

    Saedalama Level 1

      I am trying to make the background gradient change colors. I put my first gradient in one keyframe, then created another keyframe at the end with a different gradient, but when I converted it to symbol then added the tween, the transition jumps from one color to another, it is not gradual transition I wanted, it just jumps. Can anyone help me out? I can't seem to figure this out for the life of me.

       

      Thanks

        • 1. Re: Trouble creating smooth transitions from one gradient to another
          waterdad568 Level 3

          You need to convert to symbol prior to the gradient, when you tween, not only would you create your motion tween, but also at that point add your gradient at your start point, and then add other gradient at end point of tween, basically creating two tweens in one, the motion and the gradient.

          • 2. Re: Trouble creating smooth transitions from one gradient to another
            Harry Kunz Level 4

            You can use the shape tween (uses vector not symbols) for both motion and gradient tweens. Make sure that the gradient type (linear or radial) is the same for both start and end keyframes or else it will also abruptly jump from one type to the other.

            • 3. Re: Trouble creating smooth transitions from one gradient to another
              Ned Murphy Adobe Community Professional & MVP

              Create your background as a movieclip and in its timeline just draw the raw background shape with the gradients and use shape tweens to go from one gradient to another and back again.  Then place that movieclip in the main timeline and extend it as many frames as needed for your swf.

              • 4. Re: Trouble creating smooth transitions from one gradient to another
                Saedalama Level 1

                Convert what to symbol before gradient? I don't quite understand what you are talking about here. For the background, I basically just drew a rectangle that fits the size of the file, then added a gradient on top of it. So now I have my starting keyframe, then I converted it to symbol, then added classic tween, then I went to the end of the timeline then created another keyframe, now whenever I go to the first keyframe to change my gradient color, it changes the color of the entire timeline.  Before I created a second keyframe at the end of the timeline, then converted to symbol, added tween, that's when the jumping started to happen. Now I added the tween before I added the second keyframe, but the gradient does not change...I am so frustrated at this point.

                • 5. Re: Trouble creating smooth transitions from one gradient to another
                  Ned Murphy Adobe Community Professional & MVP

                  Do not convert it to a symbol or use a classic tween, leave it as a raw drawn graphic with your fill.  Copy it and paste it in another frame down the timeline and change the gradient as desired,  paste the same first copy in a frame further down the timeline.  Select the first frame and apply a shape tween to it.  Same for the second keyframe.

                   

                  The alternate approach.... When you do symbol tweening, you have to use the same symbol at both ends of the tween.  So if you wanted to use that approach, you would have to first create the graphic symbol of the gradient and then copy that further down the timeline and apply some color change to it using the Tint filter or some other effect available in the Properties panel for it.  Then you could add your classic tween between them and have it work.  But you cannot have one symbol at one end and another different symbol at the other end.

                  • 6. Re: Trouble creating smooth transitions from one gradient to another
                    waterdad568 Level 3

                    Not sure if this will help you or not, but is a very simple way to create the effect your looking for. It also seems the smallest file size when complete, it seems changing gradients in the same tween appears more cpu consumptive for some reason. Anyway this is simply a gradient mc alpha tweened to zero and 100, over another static gradient image layer within the mc timeline.

                    • 7. Re: Trouble creating smooth transitions from one gradient to another
                      Harry Kunz Level 4

                      Draw a linear or radial gradient vector graphic on frame one. Do not convert it to a symbol (i.e. MovieClip). Then insert a blank keyframe in frame say frame 10 and draw another gradient vector of the same gradient type (linear or radial) with different color. Right click frame 1 and pick Shape Tween (green timeline background). You're done. Here is a sample attached that has two tweens: one linear and the other radial.