ساخت پس زمینه بادکنکی در فلش !

در این آموزش قراره که یک پس زمینه بسیار جالب و کاملا اکتیو رو در فلش ۸ و توسط زبان اکشن اسکریپت ۲ (as2) طراحی کنیم که استفاده از این پس زمینه زیبا یک جلوه خاصی رو به پروژه شما می بخشه و زیبایی پروژه شما رو دو چندان می کنه.

دمو

دانلود فایل پروژه

ققنوس گرافیک

بریم سراغ آموزش : برای شروع یک سند ۴۰۰ در ۳۰۰ و با فریم ریت ۳۵ می سازیم.

ققنوس گرافیک

سپس یک دایره به ابعاد ۲۵ در ۲۵ و به رنگ نارنجی (FF7401) توسط ابزار Oval tools که با کلید O فعال می شه, می کشیم.

ققنوس گرافیک

سپس دایره رو انتخاب کرده و روی اون راست کلیک کرده و گزینه Convert to Symbol رو انتخاب می کنیم و اونو به یک Movie Clip تبدیل می کنیم و اسمش رو به ball تغییر می دیم و به Stage اصلی پروژه برگشته و دوباره روی مووی کلیپ ball راست کلیک کرده و باز اون رو به مووی کلیپ تبدیل می کنیم و اسمش رو به ball_animation تغییر می دیم.

ققنوس گرافیک

ققنوس گرافیک

حالا روی Movie Clip دابل کلیک می کنیم تا بتونیم این مووی کلیپ رو ادیت کنیم. در محیط ادیت این مووی کلیپ و در قسمت TimeLine روی فریم اول راست کلیک می کنیم و گزینه Create Motion Tween رو انتخاب می کنیم.

ققنوس گرافیک

در قسمت TimeLine روی فریم ۴۲ راست کلیک می کنیم و گزینه Insert Keyframe رو انتخاب می کنیم تا یک کپی از فریم اول رو داشته باشیم, این کار رو در فریم های ۴۷ و ۷۸ هم تکرار می کنیم.

ققنوس گرافیک

حالا در فریم ۴۲ ابجکت دایره ای رو حدودا تا وسط های پروژه و در خط راست به بالا حرکت میدیم و یکمی هم به سمت چپ و اندازه دایره رو هم توسط ابزار Free Transform Tools که توسط کلید Q فعال میشه دو برابر می کنیم.

ققنوس گرافیک

در فریم ۴۷ هم دوباره دایره رو یکمی به سمت بالا حرکت می دیم و یکمی هم اندازه اون رو کوچیک می کنیم. حالا به فریم ۷۸ می ریم و در این فریم اندازه ابجکت دایره رو کوچیک می کنیم تا اندازش در حد یک نقطه بشه و دوباره به سمت بالا و کمی هم به سمت راست حرکت می دیم و Alpha اوبجکتمون رو ۰% می کنیم تا از صفحه محو بشه.

ققنوس گرافیک

ققنوس گرافیک

برای ادامه کار یک لایه جدید می سازیم و اسم لایه جدید رو به Action Layer تغییر میدیم و در فریم ۷۹ راستی کلیک می کنیم و گزینه Insert Blank Keyframe رو انتخاب می کنیم و در در پنل Action که توسط کلید F9 فعال می شه, کد زیر رو در این فریم می نویسیم :

removeMovieClip(“”);

ققنوس گرافیک

در این مرحله ادیت کردن این مووی کلیپ به پایان رسیده و در این مرحله به محیط اصلی پروژه برمی گردیم و دوباره روی مووی کلیپ ball_animation راست کلیک کرده و گزینه Convert to Symbol رو انتخاب می کنیم و اسم اون رو به ball_action تغییر می دیم.

ققنوس گرافیک

با دابل کلیک کردن در روی مووی کلیپ ball_action وارد محیط ادیت این مووی کلیپ می شیم, تعداد فریم ها رو به به سه عدد تغییر می دیم و یک لایه جدید ایجاد می کنیم و اسم این لایه رو به Action Layer تغییر می دیم و تعداد فریم های این لایه رو هم به سه عدد افزایش میدیم.

ققنوس گرافیک

در این قسمت باید مووی کلیپ ball_animation رو انتخاب می کنیم و توسط کلید های Ctrl + F3 پنل Properties مربوط به این مووی کلیپ رو باز می کنیم و نام این مووی کلیپ رو در stage به bubble تغییر می دیم و کدهایی رو به فریم های این مووی کلیپ اضافه کنیم تا حالت اکتیو و پویا بودن رو به پروژه ما اضافه کنه و برای این کار کد های زیر رو به ترتیب در قسمت Action و فریم های ۱, ۲ و ۳ کپی می کنیم.

ققنوس گرافیک

کد فریم اول :

z = 0;<br />
setProperty(“bubble”, _visible, 0);

کد فریم دوم :

duplicateMovieClip(“bubble”, “bubble” + z, z);<br />
y_cord = 0;<br />
x_cord =<br />
۱۰ – Math.random() * 500;<br />
scale = Math.random() * 70;<br />
setProperty(“bubble”<br />
+ z, _y, y_cord);<br />
setProperty(“bubble” + z, _x, x_cord);<br />
setProperty(“bubble”<br />
+ z, _xscale, scale);<br />
setProperty(“bubble” + z, _yscale, scale);<br />
z++;

کد فریم سوم :

gotoAndPlay(2);

در آخرین مرحله باز به Stage اصلی پروژه بر میگردیم و مووی کلیپ ball_action رو به گوشه سمت راست و پایین منتقل می کنیم و ابعاد مووی کلیپ رو به ۱۰ در ۱۰ تغییر می دیم حالا پروژه ما تکمیل شده و با زدن کلید های Ctrl + Enter پروژه رو کامپایل می کنیم و اگه طبق آموزش پیش رفته باشید نتیجه نهایی کار شبیه دموی این آموزش خواهد شد.

سلام! من صمد ارشدی ادمین ققنوس گرافیک هستم, طراح و برنامه نویس وب و از همه مهمتر عاشق وردپرس. در ضمینه های HTML, Css, Js, jQuery, Php, Mysql و … تخصص دارم. برای ارسال سفارش طراحی و برنامه نویسی سایت می تونین با این ایمیل [email protected] تماس بگیرین.

گوگل پلاس

1 فکر می‌کنند “ساخت پس زمینه بادکنکی در فلش !

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

Time limit is exhausted. Please reload CAPTCHA.