
يحتوي كلاس TransitionManager في مكتبة الاكشن سكريبت على
عدد 10 تأثيرات حركية جاهزة يمكن تطبيقها مباشرة على اي موفي كليب وهاته التاثيرات هي عبارة عن ظهور أو خروج للكائن
in أو out وفي ما يلي اسماء العشر انواع من التاثيرات الحركية
Blinds
Fade
Fly
Iris
Photo
PixelDissolve
Rotate
Squeeze
Wipe
Zoom
ولاحظ ان كل نوع تأثير Type يمكن أن نغير حركته من خلال خصائص معينة وهي
direction اتجاه التاثير
duration: الوقت بالثواني
easing: نوع التسارع
وهاته الخصائص اختيارية يمكن اضافتها على حسب احتياجات التاثير الذي يخصك ونمر الان مباشرة الى الشرح
افتح اخي الكريم مشروع جديد لنتابع معا اضغط Ctrl+R واضف صورة الى مسرح العمل اضغط عليها بيمين الماوس
وحولها الى موفي كليب وفي خانة الانستنس نايم اعطها اسم my_mc
اضف طبقة جديدة خاصة بالاكشن اضغط بيمين الماوس عليها ثم Action أو اضغط F9 سنقوم اولا باستيراد مكتبة الترازيشن لانه بدونها لايمكن استعمال هذا الكلاس لذلك سيكون اول سطر الكود التالي
كود:
import fl.transitions.*; import fl.transitions.easing.*;
start() ولاحظ على سبيل المثال الكود التالي انسخه عوض الاول
كود:
import fl.transitions.*; import fl.transitions.easing.*; TransitionManager.start(my_mc,{type:Zoom})
بأحد التاثيرات التسعة الباقية وتجرب العمل في كل مرة .
طيب هاته التاثيرات هي افتراضية واذا اردنا ان نغير بعض القيم لهذا النوع من التأثير سنضيف طبعا أحد هاته الخصائص:
direction: اتجاه التاثير
duration: الوقت بالثواني
easing: نوع التسارع
سنتحكم فيه بالوقت على سبيل المثال اذن بعد النوع سنضيف وقت له بالثواني ونغيره كيف ما نشاء
كود:
import fl.transitions.*; import fl.transitions.easing.*; TransitionManager.start(my_mc,{type:Zoom,duration:6})
نشير في هذه الجزئية انه يمكن أن نقوم بتخزين أي تاثير Transition في متغير ونطبقه لاحقا على الموفي كليب المعين بين القوسين
الكود التالي يوضح الامر يمكن ان تجربه مباشرة افسخ السابق وانسخ التالي
كود:
import fl.transitions.*; import fl.transitions.easing.*; var myTM:TransitionManager = new TransitionManager(my_mc); myTM.startTransition({type:Fly, direction:Transition.IN, duration:2, easing:Strong.easeOut})
1/ Direction هاته الخاصية تحدد اتجاه الموفي كليب وتستقبل فقط قيمتين اما Transition.IN
وتعني الانتقال الى المسرح أو Transition.OUT وتعني الانتقال خارج المسرح حاول هنا في هذا الكود التغيير بين IN وOUT ولاحظ النتيجة
كود:
import fl.transitions.*; import fl.transitions.easing.*; var myTM:TransitionManager = new TransitionManager(my_mc); myTM.startTransition({type:Fade, direction:Transition.IN})
في الثواني براحتك على حسب ما يناسب الحركة الي تريدها حاول هنا غير في وقت الدوران ولاحظ
كود:
import fl.transitions.*; import fl.transitions.easing.*; var myTM:TransitionManager = new TransitionManager(my_mc); myTM.startTransition({type:Rotate, duration:6})
None
Regular
Strong
Back
Elastic
لتشهاد وتعرف تاثير كل خاصية انسخ الواحد تلو الاخر وعوضها مكان كلمة Elastic في الكود التالي وجرب المشروع كل مرة
كود:
import fl.transitions.*; import fl.transitions.easing.*; var myTM:TransitionManager = new TransitionManager(my_mc); myTM.startTransition({type:Rotate, easing:Elastic.easeOut})
في كل مرة القيم وتعاين المشروع لتعرف كل انواعه
كود:
import fl.transitions.*; import fl.transitions.easing.*; var myTM:TransitionManager = new TransitionManager(my_mc); myTM.startTransition({type:Fly, direction:Transition.IN, duration:3 , easing:Back.easeOut})
أنت الان على سبيل المثال أضفت تأثير حركي لموفي كليب في شكل صورة وتريد بعد الانتهاء مباشرة من الحركة
أن ينفذ أمر أو حدث معين كالانتقال الى فريم او صفحة أو اضهار موفي اخر أو فتح رابط أو ملف صوتي أو فيدو الخ ...
كلاس TransitionManagerيحتوي عدد 2 احداث Events وهما
allTransitionsInDone
allTransitionsOutDone
الاول يمكن ان ننفذ من خلاله حدث معين في حالة استعمالنا للخاصة Transition.IN
ونفس الشىء بالنسبة للثاني في حالة استعمالنا لخاصية Transition.OUT
الكود التالي يوضح الأمر بعد انتهاء التاثير سنلاحظ في نافذة المخرجات عبارة انتهى هذا التاثير
كود:
import fl.transitions.*; import fl.transitions.easing.*; var myTM:TransitionManager = new TransitionManager(my_mc); myTM.startTransition({type:Fly, direction:Transition.IN, duration: 3, easing:Back.easeOut}) myTM.addEventListener("allTransitionsInDone", doneTrans); function doneTrans(e:Event):void{ trace("انتهى هذا التأثير"); }
Blinds
Fade
Fly
Iris
Photo
PixelDissolve
Rotate
Squeeze
Wipe
Zoom
الجزء الثاني من الشرح
أرجو أن أكون قد حققت الفائدة

تعليق