إعـــــــلان

تقليص
لا يوجد إعلان حتى الآن.

الدرس الثامن دالة staggerTo في مكتبة GreenSock

تقليص
هذا الموضوع مغلق.
X
X
 
  • تصفية - فلترة
  • الوقت
  • عرض
إلغاء تحديد الكل
مشاركات جديدة

  • الدرس الثامن دالة staggerTo في مكتبة GreenSock



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


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

    ()staggerTo
    ()staggerFrom
    ()staggerFromTo
    هاته الدوال الثلاثة تمكنك أخي الكريم من انشاء حركات احترافية والتحكم الكامل فيها والجميل في هاته الدوال أنها تتعامل مع المصفوفة
    مذا يعني ذلك ؟ = يعني فقط ضع ازرار أو موفيهات أو نصوص في مصفوفة وطبق عليهم الحركة كلهم نشرح الامر :



    1- ()staggerTo

    طيب طبق معي أخي الكريم افتح مشروع جديد واحفظ بجانب مجلد com كالعادة
    اضف الى المسرح 3 موفي كليب أو أكثر كما تشاء واعطهم اسماء mc1 mc2 mc3 الخ ... واضف زر باسم btn

    في طبقة الاكشن سنستدعي طبعا كلاسات GreenSock
    كود:
    import com.greensock.*;
    import com.greensock.easing.*;
    نقوم بانشاء مصفوفة نخزن فيها الموفي كليبات
    كود:
    var buttons = [mc1, mc2, mc3, mc4, ];
    الان سنضيف حدث استماع في حالة الضغط على الزر btn

    كود:
    btn.addEventListener(MouseEvent.CLICK, clickHandler);
    ثم الدالة المطلوب تنفيذها
    كود:
    function clickHandler(event: MouseEvent): void {
    
    	TweenMax.staggerFrom(buttons, 1, { x: 50,  y: 50,  alpha: 0.5,rotation: 360,scaleX: 0.5,scaleY: 0.5,ease: Bounce.easeIn},0.5);
    		 
     }
    buttons = اسم كصفوفة الموفي كليبات
    1 زمن الحركة بالثانية
    x: 50 الاحداثي السيني
    y: 50 الاحداثي الصادي
    alpha: 0.5 نسبة الشفافية
    rotation: 360 الدوران 180 درجة
    scaleX: 0.5 تصغير حجم الموفي الى نصفه = افقي
    scaleY: 0.5 تصغير حجم الموفي الى نصفه = عمودي
    ease: Bounce.easeIn خاصية التسارع
    0.5 هو الوقت بالثانية بين حركة كل موفي واخر .

    المثال

    [flash=http://dc21.arabsh.com/uploads/flash/2017/01/16/0d33454967f3.swf]WIDTH=550 HEIGHT=400[/flash]

    1- ()staggerFrom

    سبق أن تطرقنا الى From هي تجعل القيم الحالية هي النهائية سنستعمل نفس الكود أعلاه ونغير فقط الدالة الى FromTo
    وسنغير ايضا بعض الخصائص لتغيير شكل الحركة
    كود:
    TweenMax.staggerFrom(buttons, 1, { x: 250,  y: 200,  alpha: 0 ,rotation: 360,scaleX: 0.5,scaleY: 0.5,ease: Bounce.easeIn},0.5);
    المثال

    [flash=http://dc21.arabsh.com/uploads/flash/2017/01/16/0d33454966fb.swf]WIDTH=550 HEIGHT=400[/flash]


    ()staggerFromTo


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

    TweenMax.staggerFromTo( اسم المصفوفة , الزمن بالثانية , { مجموعة الخصائص النهائية }, { مجموعة الخصائص الحالية }, الزمن بين كل حركة للموفيهات);

    كود:
    TweenMax.staggerFromTo(buttons, 0.3, {
    		alpha: 0,
    		rotation: 180,
    		scaleX: 3,
    		scaleY: 3,
    		alpha: 0,
    		ease: Bounce.easeIn
    	}, {
    		alpha: 1,
    		rotation: 0,
    		scaleX: 1,
    		scaleY: 1,
    		ease: Bounce.easeOut
    	}, 0.1);

    في المثال التالي اضفت 4 ازرار لمعاينة 4 تاثيرات

    [flash=https://up.harajgulf.com/do.php?id=1420421]WIDTH=600 HEIGHT=400[/flash]

    رابط المعاينة المباشر
    https://up.harajgulf.com/do.php?id=1420421


    في المرفقات الملفات المفتوحة



    الملفات المرفقة

  • #2
    تسلم ايدك اخى عزيز
    فعلا مكتبة رائعة ومتجددة دائما بالتحف والتأثيرات الرائعة

    تعليق


    • #3
      جزاك الله خيرا أخى عزيز

      ماشاء الله مكتبة تستحق التعب عليها بالفعل

      بارك الله فيك وفي جهودك

      تعليق


      • #4
        بسم الله الرحمن الرحيم

        تشرفت بحضوركم الطيب

        تعليق


        • #5
          نفع الله بكم

          تعليق


          • #6
            المشاركة الأصلية بواسطة الموسوعة للمعلوماتية مشاهدة المشاركة
            نفع الله بكم
            أشكر لكم حضوركم الكريم

            تعليق


            • #7
              جزاك الله خيرا

              تعليق


              • #8
                مجهود عالى

                تعليق


                • #9
                  يرفع هذا الدرس الذهبى لتستمر الاستفادة وكل الشكر والتقدير لاخى عزيز جزاه الله كل خير

                  تعليق


                  • #10
                    بارك الله فيك

                    تعليق

                    مواضيع تهمك

                    تقليص

                    المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 06-08-2025 الساعة 11:33 PM
                    المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 06-04-2025 الساعة 05:29 PM
                    المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 05-31-2025 الساعة 10:07 PM
                    المنتدى: القسم العام نشرت بواسطة: ماريا عبد الله الوقت: 05-30-2025 الساعة 11:48 PM
                    المنتدى: التصنيع والانتاج نشرت بواسطة: HaMooooDi الوقت: 05-30-2025 الساعة 09:36 AM
                    يعمل...
                    X