الحركة في اكشن سكريبت بواسطة كلاس توين Animation withTween in As3 جزء 3

[azizsoft]

بسم الله الرحمن الرحيم
الحمدلله والصلاة والسلام على رسول الله وعلى آله وصحبه أجمعين
السلام عليكم ورحمة الله وبركاته




وظائف أو دوال كلاس توين Tween Mehods


وظائف أو دوال كلاس التوين تمكنك من التحكم الكامل في مراحل حركة الكائن بالمسرح البداية والنهاية الايقاف
تنفيذ امر معين عند انتهاء الحركة عكس الحركة الخ .. وكل الدوال المبينة أسفله تطبق مباشرة على الكائن يعني هي أوامر تنفيذ وهي 9


Tween.start() هذا الأمر لبداية الحركة .
Tween.stop() هذا الأمر لايقاف الحركة .
Tween.resume() هذا الأمر لاستئناف الحركة من نقطة الايقاف لا من البداية.
Tween.continueTo(arg0 , arg1) هذا الأمر لاضافة حركة جديدة تبدأ من نقطة الانتهاء يعني
تضع قيمة ثانية مثلا وتحدد لها زمن بالثواني . نفترض ان الحركة انتهت في النقطة 400 تضيف انت نقطة أخرى
مثلا النقطة 300 في 2 ثواني.
Tween.fforward() هذا الأمر لايقاف الحركة في نقطة النهاية
Tween.rewind() هذا الأمر لارجاع حركة الكائن وايقافه الى نقطة البداية
Tween.nextFrame() هذا الأمر للانتقال الى الفريم التالي
Tween.preFrame() هذا الأمر للانتقال الى الفريم السابق
Tween.yoyo() هذا الأمر لعكس الحركة بعد نهايتها.
نفتح برنامج الفلاش لنطبق ويفترض ان لدينا موفي كليب باسم mc1 وزر باسم btn
في طبقة الاكشن نلصق هذا الكود


var myTween:Tween = new Tween(mc1, "x", Strong.easeOut, 50, 300, 3, true);
myTween.stop();

btn.addEventListener(MouseEvent.CLICK, onClick);
function onClick(e:MouseEvent){
myTween.start();
}




لاحظ أنه عند المعاينة لايتم تنفيذ الحركة باعتبار أننا أضفنا الأمر myTween.stop() وعند الضغط على الز
ر سيتم تنفيذ الحركة بواسطة الآمر myTween.start() وبنفس هاته الطريقة ننفذ بقية الاوامر على سبيل المثال
تنجز موفي كليب به حركة معينة مع صوت مثلا وتربطه تفاعليا مع اختيار المستخدم ... مسابقة مثلا ..او لعبة.. الخ ....

أحداث كلاس التوين Tween Evens

يمكن أن نضيف حدث استماع بسهولة تامة للتوين Tween من خلال جميع هاته الاحداث 6 عن طري
الدالة addEventListener() وهذا جميل يعني نستطيع تنفيذ أي امر مثلا عند بداية الحركة أو عند ايقافها
أو خلال الحركة أو نهايتها هذه هي أحداث التوين وسنوضح الأمر.


TweenEvent.MOTION_START تنفيذ أمر عند بداية الحركة
TweenEvent.MOTION_STOP تنفيذ أمر عند نهاية الحركة
TweenEvent.MOTION_RESUME تنفيذ أمر عند استئناف الحركة.
TweenEvent.MOTION_FINISH تنفيذ أمرعند انتهاء الحركة
TweenEvent.MOTION_CHANGE تنفيذ أمر خلال مراحل الحركة
TweenEvent.MOTION_LOOP تنفيذ أمر طيلة تكرار الحركة

للمعاينة أضف حقل نصي باسم dt وانسخ الكود التالي عوضا عن الأول



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

btn.addEventListener(MouseEvent.CLICK, onClick);
function onClick(e:MouseEvent): void {
var myTween = new Tween(mc1, "x", Bounce.easeOut,50, 300, 2, true);
myTween.addEventListener(TweenEvent.MOTION_FINISH, onFinish);

}
function onFinish(e: TweenEvent): void {
dt.text = "twenn finished";
}



لاحظ أنه عند انتهاء الحركة يظهر التكست وكذلك ننفذ أي أوامر أخرى .
يمكن أن نجعل الحركة مستمرة باستخدام الدالة yoyo() التي ذكرناها ولاحظ المثال التالي
حيث هناك حدث استماع لعكس الحركة عند الانتهاء :


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

var myTween = new Tween(my_mc, "x", Strong.easeInOut, 100,300, 1, true);

myTween.addEventListener(TweenEvent.MOTION_FINISH, onFinish);
function onFinish(e:TweenEvent):void {
e.target.yoyo();
}



ويمكن طبعا أن نضيف أكثر من حدث استماع لتنفيذ اكثر من أمر في نفس الوقت .

الحركة باستعمال التايمر Tweens with Timer



يمكن أن نضيف على أي كائن حركة Tween عن طريق الوقت أو التايمر بلغة اكشن سكريبت يفترض
أنك لديك موفي كليب باسم mc1 في طبقة الاكشن انسخ الكود
التالي ولاحظ ان الحركة تنفذ بعد كل 3 ثواني .



//استدعاء كلاسات التوين ضروري
import fl.transitions.Tween;
import fl.transitions.easing.*;

//انشاء نسخة من كلاس تايمر
var timer:Timer = new Timer(3000);

//أمر بدا الوقت
timer.start();

//انشاء التوين المراد تطبيقه على الموفي كليب
var tween:Tween = new Tween(mc1, "x", Elastic.easeOut, 50, 300, 2, true);

//اضافة أمر لايقاف الحركة على الموفي
tween.stop();

//اضافة حدث استماع للوقت
timer.addEventListener(TimerEvent.TIMER, startTween);

//انشاء الوظيفة المطلوب تنفيذهاعند نهايةالوقت
function startTween(event:TimerEvent):void {
//أمر بداية الحركة
tween.start();
}



بهاته الطريقة تستطيع اخي الكريم تنفيذ عدة حركات جميلة باستعمال التايمر

أرجو أن أكون قد حققت الفائدة من خلال هاته السلسلة لشرح خصائص ودوال وأحداث كلاس التوين




أستودعكم الله

[فلاح العودة]

:abc_138::abc_023::abc_052:

[abohmam]

جزاك الله خيرا أخى عزيز على متابعة الدروس

ماشاء الله جهد مبارك ان شاء الله

:abc_152:

[azizsoft]

بسم الله الرحمن الرحيم

وفقكم الله جميعا :abc_022:

[أبو يوسف]

جزاك الله خيرا اخانا عزيز :abc_152::abc_152: وبارك الله فيك

[الهمام]

شـكــ وبارك الله فيك ـــرا لك ... لك مني أجمل تحية . موفق بإذن الله ... لك مني أجمل تحية .