Home » Technology » FLASH Programming » TWEENED ANIMATION - Tweening color | Shape tweening

TWEENED ANIMATION - Tweening color | Shape tweening

© Umais Ahmad

Tweening color

In tweening color, one color changes into another over a time. We use Effect Panel for color tweening. Above is a movie shown with tweening color effect, we shall create so follow steps one by one.

STEP 1:

Create a picture as shown in the figure. Select it all and choose Insert > Convert to Symbol. Tick Graphic from behavior and finally click OK. Remember image must be a symbol for color tweening effect.

STEP 2:

Click frame number 10 and press F6 to insert keyframe. Open Effect Panel by choosing Window > Panels > Effect. Choose Tint from pull-down menu. Choose blue color from Tint Color box.

STEP 3:

Click frame number 20 and press F6. Choose green color from Tint Color box.

STEP 4:

Click frame number 30 and press F6. Choose red color from Tint Color box.

STEP 5:

Click frame number 5 and choose Insert > Create Motion Tween. Similarly click frame number 15 and 25 and choose Insert > Create Motion Tween. In the last the timeline should look like as shown.

Click frame number 1 and press ENTER to test the movie.

Shape tweening

In shape tweening, an object changes its shape over a time. Unlike motion tweening where we use grouped objects, in shape tweening the object must not be a grouped object or symbol. Above is a movie shown with shape tweening effect, we shall create so follow steps one by one.

STEP 1:

Click frame number 1 and draw a rectangle on stage. Align it center to stage.

STEP 2:

Click frame number 10 and press F7 to insert Blank Keyframe. Draw a circle and align it center to stage.

STEP 3:

Click frame number 20 and press F7 to insert Blank Keyframe. Draw a triangle and align it center to stage.

STEP 4:

Click frame number 30 and press F7 to insert Blank Keyframe. Copy rectangle from frame 1 and paste it in frame 30. Align it center to stage.

STEP 5:

Click frame number 1 and open Frame Panel by choosing Window > Panels > Frame. Choose Shape from Tweening pull-down menu.

STEP 6:

Similarly click frame number 10 and 20 and choose Shape from Tweening pull-down menu. In the last the timeline should look like as shown. The light green color is a specific indication of shape tweening.

Click frame number 1 and press ENTER to test the movie.

Using Shape Hints

Button States

The copyright of the article TWEENED ANIMATION - Tweening color | Shape tweening in FLASH Programming is owned by . Permission to republish TWEENED ANIMATION - Tweening color | Shape tweening in print or online must be granted by the author in writing.