Flash Tutorials: Learn how to animate the Displacement Map Filters with ActionScript.

Home • Members Tutorials Forum iSnapChat Contact Us 


Flash Tutorials


Flash Tutorial - Displacement Map Filter & Animation


Free Flash Tutorial


Intro   <<      Intro   1   2   3   4   5   6   7   8     Next   >>      



Flash 8 Pro introduces many graphic filters including the Displacement Map Filter which allows you to distort a Movie Clip based on a bitmap's color values. The Displacement Map Filter distorts the colors in one object based on the color of another object. This gives you a distorted effect.

The DisplacementMapFilter class uses the pixel values from the specified BitmapData object (called the displacement map image) to perform a displacement of another object on the Stage, such as a Movie Clip instance. You can use this filter to achieve a warped or mottled effect on a BitmapData or Movie Clip instance.

Here is how the DisplacementMapFilter class works. The Displacement Map Filter is applied with the use of ActionScript. For each pixel in the destination bitmap, the DisplacementMapFilter class does the following:

In this tutorials you will create the Flash Movie below, learn how to swap the images and learn how to edit the code so that the animation is triggered on different type of events like mouse roll over. Here is one of the Movies that you will be creating using the Displacement Map filter:

Note: If the Movie below is not animating - refresh your web page: Ctrl F5


Example: Download the Flash file Draw 221a

Flash Movie which uses the Displacement Map Filter. (If not animating refresh - Ctrl F5)


Important Cross Ref: If you are new to filters I suggest that you return here after first reading the tutorial: Creating Filters with ActionScript


Quick Link: Setting up the Document

Quick Link: Importing the Images

Quick Link: Preparing the Movie Clip Symbols
Quick Link: Preparing the Main Stage

Quick Link: The ActionScript

Quick Link: Understanding the ActionScript

Quick Link: Swapping the Images
Quick Link: Animating On Roll Over


Click by Click: If you would like to view this tutorial without all the notes: Click by Click


Important Note: These Filters only work in Flash Professional 8. The filters are not available in Flash 8 Basic or any of the earlier versions of Flash such as Flash MX04/MX/5.


If you don't know what version you are using go to: Help > About Flash and you will see the logo:



Intro   <<      Intro   1   2   3   4   5   6   7   8     Next   >>      

48697 visitors to this page since 18 April 07 •

Phil Schulz's Facebook Profile
Webwasp is Phil Schulz's baby. You are welcome to contact me or become my Facebook friend: Click here

 Top of Page HomeMembers Tutorials Forum iSnapChat Contact Us 
 All material on this site is protected under international copyright © law. DO NOT reproduce any material from this site without written permission. Please ask as permission is often granted.