ممكن طريقه لصنع سكرول بار

[Jene0 Design]

السلام عليكم
مرحبا اخواني الكرام
ممكن طريقه لصنع السكرول بار
ابي اصمم موقع بس ابي يكون فيه سكرول بار في الفرونت بيج
وجبت لكم مثال كيفية ودي اسوي السكرول بار
http://www.noragraphics.net/home.html (http://www.noragraphics.net/home.html)
ادخل الى الرابط ويطلع لك السكرول بار ابي اسوي مثله
احترامي لكم
++

[Jene0 Design]

اوكي اخوي بس انا ابي اتعلمه عادي يعني ياريت لو في درس اسوي
عشان اسوي مثل الموقع الي وضعت الرابط
ياريت لو في حل


انا ابي اسوي كيف اسوي مثل المربع الي في الموقع الي خليته لكم
ياريت في حل للسكرول بار
احترامي

[ح,ـرقة قـلب]

بسم الله الرحمن الرحيم ونبدأ الدرس ....

في البدايه افتح برنامج السويتش

بعد ذلك قم بادراج شكل ولنفرض انه دائره

ونختار اسم للدائره او رقم ليسهل علينا التطبيق ولنختار الرقم " 1 " وذلك من

Shape ==> Name

بعد ذلك قم بتغيير لون الدائره الى أي لون تريده ولنفرض اننا اخترنا اللون الاحمر طبعا تغيير

اللون يكون من القائمه اللي باليمين من

Shape ==> Solid

والان نقوم بالضغط على الزر الايمن من الماوس على الدائره رقم " 1 "

لكي نحوله الى Sprite

Convert to sprite <===== Convert

بعدين نروح لـ Scene 1 اللي في اليسار وراح نلاقي فيها Sprite

الان نقوم بالضغط على علامه الــ + من Sprite

بنشوف فيه شكل الدائره اللي سمينها رقم " 1 "

http://mobd3o.jeeran.com/images/a1.jpg

الآن نقوم بنسخ الدائره ولصقها في الـ Sprite

النسخ يكون بالضغط على الدائره رقم واحد بالزر الايمن من الماوس

واختيار الامر Copy Object

وبعدين نلصقها بامر Paste

حتى يصبح عندي دائرتين ونغير اسم الدائره ونخليه رقم " 2 "

الان نقوم بترتيب الدوائر على حسب الاسم باختيار

http://mobd3o.jeeran.com/images/a2.jpg

حتى يصبح عندي الشكل التالي:

http://mobd3o.jeeran.com/images/a3.jpg

الان نقوم بتحريك الدائره رقم " 2 " بحيث انها تكون دائره تحت دائره وتكون على مستوى واحد

وتكون بالشكل التالي :
http://mobd3o.jeeran.com/images/a4.jpg

الآن نحول الدوائر الى Button

وذلك بالضغط على الزر الايمن من الماوس

Convert ==> Convert to Button

نسمي الدائره الاولى Up ... ونسمي الدائره الثانيه down

حتى تصبح بالشكل التالي:
http://mobd3o.jeeran.com/images/a5.jpg

الآن راح يكون شغلنا كله على Up

نختار Up بعدين Actions اللي في اليسار

وراح تشوف قائمه Add Event

Add Event ==> On Roll Over

بعدين تظهر لنا Add Action نختار منها :

Add Action => tell Taget

بعد كذا بتطلع لك تحت Target وجنبها مربع فاضي

هذا المربع يعني وش الشكل اللي تبيه يطلع اذا جا مؤشر الماوس على الدائره Up
خلونا نسميهas/
http://mobd3o.jeeran.com/images/a6.jpg

وهلى فكره اهم شي الشرطه اللي قبل الاسم " السلاش " لو ماتنكتب ماينفذ الحركه

http://mobd3o.jeeran.com/images/a7.jpg

الحين تقريباً خلصنا 90% من الشرح هذا بالنسبه للحركه هذي

الحين ننتقل للمربع الثاني اللي سميناه down

نسوي فيه مثل ماسوينا بالمربع الاول باختلاف شي واحد

الي هو بدل ما نأشر على Next نأشر على Prev

http://mobd3o.jeeran.com/images/a8.jpg

الآن نقوم بنسخ كل من Up و down مع بعض

يعني أشر بالماوس على Up وانت ضاغط عليه اضغط على down + Ctrl

ولصقهم حتى يصبح عندك اربع مربعات

http://mobd3o.jeeran.com/images/a9.jpg

الحين انشاء الله نبدأ بادراج التأثيرات الازمه

وتكون كالتالي :

في الفريم الثاني من الدائره Up

نضيف التأثير Place

وفي الفريم الثاني من الدائره down

نضيف نفس التأثير Place

وفي الفريم الاول من الدائره Up1

نضيف التأثير Place

وفي الفريم الثاني من الدائره Up1

نضيف التأثير Remove

وفي الفريم الاول من الدائره down1

نضيف التأثير Place

وفي الفريم الثاني من الدائره down1

نضيف التأثير Remove

حتى يصبح عندي بالشكل التالي :

http://mobd3o.jeeran.com/images/ab10.jpg


الان نكون قد انتهينا من تأثير الماوس

والان نبدأ بشرح طريقه اضافه النص اللي سوف يبدأ مع تأثير الماوس

في البدايه نأشر على الـ Scene 1

وبعدين نضيف مربع ونحوله الـ Sprite

نضغط على الزر الايمن من الماوس على المربع

Convert to sprite <===== Convert

نأشر على sprite علامه + الخاص بالمربع

ونضيف نص بحيث يكون النص تحت المربع

http://mobd3o.jeeran.com/images/a11.jpg

وبعدين من قائمة Shape الخاصه بالمربع نختار

من الامر Solid نحول لون المربع الى شفاف

http://mobd3o.jeeran.com/images/a12.jpg

الحين انشاء الله نبدأ بادراج التأثيرات الازمه

وتكون كالتالي :

في الفريم الأول من الـ sprite

تضيف التأثير Stop

وفي الفريم الاول من النص

نضيف التأثير Place

وفي الفريم الثاني من النص

نضيف التأثير Move ونحاول اننا نطول فتره

حركه النص الي 40 فريم مثلا

علشان ماتصير الحركه سريعه

حتى يصبح عندي بالشكل التالي :

http://mobd3o.jeeran.com/images/a13.jpg

وبعدين نحرك النص للأعلى

http://mobd3o.jeeran.com/images/a14.jpg

ثم نقوم بسحبه للأعلى الى نهايه المربع

حتى يصبح بالشكل التالي :

http://mobd3o.jeeran.com/images/a15.jpg

الان نقوم بتغيير اسم الـ Sprite

الخاص بالنص وذلك من القائمه اللي باليمين

Sprite ==> Name

وفي المربع الخاص بالاسم نضع as

الان ننتقل لآخر خطوه واللي هي تكون على الشكل التالي

نأشر بالماوس على الـ Sprite اللي سميناه as

ومن القائمه اللي باليمين نختار Sprite

ونضع مؤشر على Masked

http://mobd3o.jeeran.com/images/a16.jpg

والان نتقل للـ Sprite الخاص بتأثير الماوس

ومن القائمه اللي باليمين نختار Sprite

ونضع مؤشر على Loop

http://mobd3o.jeeran.com/images/a17.jpg

الشكل النهائي للعرض بيكون على الشكل التالي

http://mobd3o.jeeran.com/images/a18.jpg

والان قم بتشغيل العرض

[Jene0 Design]

مشكور ياغالي ينطيك ربي الف عافيه
احترامي