[E.NaWaR]

ActionScript 3.0 - مستوى مبتدئ - Flash CS3 و ما أعلى - شرح نصي

لماذا قد تستخدم الـ ActionScript فى التحريك ؟
اذا كنت تستخدم الـ Time Line او الـ Tweens او الـ Frame by frame Animation فى التحريك ،
فسوف يكون من المحدود جدا تنفيذ تفاعل على هذه الحركة

اما اذا استخدمت الـ ActionScript فسوف يمكنك انشاء حركة اكثر تفاعلية و ديناميكية ..
يستطيع المستخدم التفاعل معها و تغييرها

ما سيتم شرحه ؟
الطرق الأساسية للتحريك بالـ ActionScript 3.0
و هناك ثلاث طرق:

1. ENTER_FRAME Event
2. Timer Class
3. Tween Class

و بأذن الله سوف يتم الحاق هذا الموضوع ، بمواضيع متقدمة لهذه الطرق


متطلبات مشاهدة الدرس
يجب ان يكون لديك دراية بأساسيات الـ AS3

فهرس

1. ENTER_FRAME Event
2. Timer Class
3. Tween Class

[E.NaWaR]

ENTER_FRAME Event

ENTER_FRAME Event

ما هو ENTER_FRAME ؟
هو حدث يجعل دالة تتنفذ باستمرار
( مثلا اذا رسمت دائرة و وضعت اوامر لتحريك الاحداثى X لها مسافة معينة مثلا 5 ،
فسوف تظل تتحرك 5 بيكسل ثم 5 بيكسل ثم 5 بيكسل ... إلا ما لا نهاية )
طبقا لسرعة العمل للملف Frame Rate (FPS)

--------------------------------------

مثال

--------------------------------------

Actions

addEventListener(Event.ENTER_FRAME, animation);
function animation(event:Event):void
{
    w_mc.x += 5;
}

و لكي يعود الـ MovieClip للظهور مجددا ، اضفت جملة شرط

addEventListener(Event.ENTER_FRAME, animation);
function animation(event:Event):void
{
    w_mc.x += 5;
    if(w_mc.x>stage.stageWidth)
    {
       w_mc.x = 0 - w_mc.width;
    }
}

[E.NaWaR]

Timer Class

Timer Class

ما هو Timer ؟
هو class يسمح لك بتنفيذ دالة باستمرار مثل حدث ENTER_FRAME
لكن ليس طبقا لسرعة العمل للملف Frame Rate (FPS)،
انما حسب المدة التى تحددها على عكس ENTER_FRAME

--------------------------------------

مثال

--------------------------------------

Actions

import flash.utils.Timer;
import flash.events.TimerEvent;

var timer:Timer = new Timer(30);
timer.addEventListener(TimerEvent.TIMER, animation);
timer.start();
function animation(event:TimerEvent):void
{
    w_mc.y += 5;
}

لا تنس أمر بدأ الـ Timer
timer.start()

* قيمة Timer تحسب بالملى ثانية ، اى 1000 تساوي ثانية واحدة

و لكي يعود الـ MovieClip للظهور مجددا ، اضفت جملة شرط

import flash.utils.Timer;
import flash.events.TimerEvent;

var timer:Timer = new Timer(30);
timer.addEventListener(TimerEvent.TIMER, animation);
timer.start();
function animation(event:TimerEvent):void
{
    w_mc.y += 5;
    if(w_mc.y>stage.stageHeight)
    {
        w_mc.y = 0-w_mc.height;
    }
}

[E.NaWaR]

Tween Class

Tween Class

الفرق هنا انك تحدد نقطة بداية التحريك و نقطة نهاية التحريك ،
ثم تخبر البرنامج ان يقوم بالحركة بين تلك النقطتين

--------------------------------------

مثال

--------------------------------------

Actions

import fl.transitions.Tween;
import fl.transitions.easing.*;

new Tween(w_mc,"x",Bounce.easeOut,0,stage.stageWidth - w_mc.width,3,true);

هناك 6 عوامل تقوم بكتابتها داخل الـ Tween

1. الـ object الذي تريد تنفيذ الـ Tween عليه
2. الدالة التى تريد تغييرها فى الـ object مثال الاحداثي x ، و هي تكون من نوع sting اى علي شكل نص بين علامتي تنصيص
3. دالة التحريك و هي المسؤلة عن شكل الحركة ( هل مثل تبدأ الحركة بطئية ثم تزيد سرعة ، او يكون هناك ارتداد كما بالمثال ، و غير ذلك )
4. بداية الحركة
5. نهاية الحركة
6. مدة الحركة

و العامل 7 هو من نوع boolean اى اختيار منطقي يقبل true او false
فالعامل 6 يكون فى الوضع الافتراضي مدة الحركة محسوب بعدد الـ frames فى الثانية

لكن اذا اردته ان يكون محسوب بالثانية
فسوف تختار true فى العامل 7


و لاضافة زر لبدأ الحركة عند الضغط عليه ، اضفت بعض الأوامر

import fl.transitions.Tween;
import fl.transitions.easing.*;
import flash.events.Event;

play_btn.addEventListener(MouseEvent.CLICK, animation);
function animation(evnet:Event)
{
    new Tween(w_mc,"x",Bounce.easeOut,0,stage.stageWidth - w_mc.width,3,true);
}

[omar.mo]

ما شاء الله عليــك أخي/ E.NaWaR

يبدو درس رائــــع ،، ومعلومات قيــــمة

لكني معلوماتي تكاد تكون منعدمة في مجال الفلاش عامةً


جزاك الله خيراً
بالتـــوفيق

[قائل الحق]

بارك الله فيك اخي الكريم
نفع الله بك وجعل هذه الدروس فى ميزان حسناتك

[aboadres]

مشكور ورائع نتمنى الاستمرار

[speed99]

وجبة فاخرة أستاذ E.NaWaR في AS3

أحييك على طريقة العرض المميزة

فجزيت خيرًا أخي الكريم

[مـؤمن]

السلام عليكم ورحمة الله وبركاته

ممتاز كالعاده يا اسلام
بس ليا تعليق بسيط وهو عن العامل الثالث فى Tween Class

”

دالة التحريك و هي المسؤلة عن شكل الحركة ( هل مثل تبدأ الحركة بطئية ثم تزيد سرعة ، او يكون هناك ارتداد كما بالمثال ، و غير ذلك )

“

العامل الثالث من وجهة نظرى ينقسم لجزئيين الاول شكل الحركه والثانى يتحكم فى سرعة بداية ونهاية الحركه

”

Bounce.easeOut

“

Bounce هو شكل الحركه ويمكن ان يكون غير ذلك مثل Strong او Elastic او غيرها
فلو قررنا مثلا ان نستخدم Bounce اى الشكل المرتد الذى قمت بتطبيقه بعد نقوم بتحديد سرعة بدايته ونهايته
.easeOut
.easeIn
.easeInOut


بالتوفيق

[E.NaWaR]

أهلا بكم جميعا

----------------------

مـؤمن
و عليكم السلام و رحمة الله و بركاته

بالفعل يمنك اعتبارها كجزئين
الجزء الأول هو نوع الـ class
و يشمل Back Bounce Elastic None Regular Strong

و لكل class من هذه الـ classes السابقة لديه ثلاث methods
و هما easeIn easeOut easeInOut
بالاضافة إلى ان الـ None Class لديه method اضافي و هو easeNone

و هناك محركات آخرى Tween Engines لديها Classes آخرى

و ان شاء الله نتعرف على هذه التفاصيل فى دروس قادمة

----------------------

شكرا لمروركم