پشم سنگ عایق الاستومری
یکشنبه 6 اردیبهشت‌ماه سال 1388
توسط: آلفا پک

شعله آتش حساس به ماوس

این شعله به ماوس شما حساس و شما می تونید بوسیله فلاش ۸ به بالا این افکت رو برای کاراتون ایجاد کنید خیلی جالبه حتما این تورتیال رو مطالعه کنید به نظر خودم که ارزشش رو داره در ضمن می تونید کمپوننت آتش رو هم دانلود کنید. 



Step 1 - Install the effect component

Download the Fire Flame Effect here. Please follow the installation instructions and drag the component from the component panel into the libary of your .fla file.

Drag the component into the library

Step 2 - Create a shape Movieclip

Create a shape with the shape tool. The shape should be 30px x 312px. The color of the shape doesn’t mater since only the size of the shape will be taken for the calculations of the flame effect and the user will therefor never see this shape.

Select rectangle tool

Draw shape

Check size

Convert the shape into a Movieclip [press F8] or right click on the Movieclip -> “Convert to Symbol…”. Give the Movieclip the name “shape”.

Convert into Movieclip

Set the instance name of the Movieclip. Use “shape_mc”. Its important to set an instance name here, because otherwise the component will not find the Movieclip. BTW, the naming is up to you, just make sure, that the instance name is unique projectwide.

Set instance name

Step 3 - Apply the component to the Movieclip

Drag the component onto the Movieclip. The component snapps automatically.

Drag component onto Movieclip

Open the component inspector panel Windows -> “Component Inspector”. Set the parameter to the ones in the screenshot. All Movieclip (with proper instance names) are listed in the “Target Shape” select list.

Component parameter

Note: These settings are only applied to this one instance of the effect component. If you draw the component on another Movieclip (somewhere else inside the .fla or in a new project) you have to set the settings again.

Step 4 - Set the instance name of the effect

Give the effect the instance name “fire_effect”.

Set instance name of component

Step 5 - Add mouse script

Create a new layer, name it “script”, open the ActionScript window with [press F9], Window -> “Actions” or right click on the just created layer and then “Actions”.

Open ActionScript panel

Add the following code:

01.defaultAmount = 5;
02.defaultInterval = 6;
04.fire_effect.onMouseMove = function()
06.    var a:Number = 15 - fire_effect._xmouse;
07.    var b:Number = 312 - fire_effect._ymouse;
09.    var d:Number = Math.sqrt(a*a+b*b);
10.    var f:Number = Math.round(d/80);
12.    fire_effect.amount = defaultAmount - f;
13.    fire_effect.interval = defaultInterval - f;

In line 1 and 2 you define the dafault values to be applied. The onMouseMove function in line 4 will be executed every time the mouse is moved inside the flash movie.

Line 6 and 7 calculates the distance from to bottom middle point of the flame to the position of the mouse. The distance from the mouse point to the flame is calculated in line 9. The variable f in line 10 is the number you will subtract from the default vars set earlier. Finally in line 12 and 13 the new parameter are passed to the component.

Step 6 - Export

Export the Movie Command -> “Test Movie” or [press Ctrl-ENTER] and see the result. If you’re not satisfied, go back and play around both with the parameter in the component inspector panel and the calculations in the ActionScript code.


Click here to download the fla of this tutorial. Note: The .fla includes the trial version of the effect component, which will only work in the Flash IDE (Flash 8, Flash CS3 or Flash CS4) but not inside the browser.

You can also download the Fire Flame Effect Component here.