آموزش ايجاد دكمه قطع و وصل صدا در Flash MX

corel

Active Member
بسمه تعالی

آموزش ایجاد دکمه قطع و وصل موسیقی زمینه در Flash MX

------------------------------------

مقدمه

مدتی بود که مقاله بدرد بخوری برای دوستان ننوشته بودم. یه دلیل مهمش البته مشغله کاری بود که هنوز هم هست.
و تا باشه کار باشه البته!
اما مطلبی که در این تاپیک می نویسم و اگه وقت و فرصت و نیاز باشه ممکنه ادامه اش بدم، مساله ای کاربردی در فایلهای تعاملی ساخته شده با نرم افزار Flash شرکت Macromedia است که البته از عنوانش فکر می کنم مشخص باشه و هر بیننده ای اهمیت وجود این دکمه رو در فایلهایی که صدا دارن درک می کنه.
البته روشهای مختلفی مسلما برای ایجاد دکمه قطع و وصل صدا وجود داره که بیشترش به خلاقیت سازنده بستگی داره.
من طی پروژه های Flash که تا به حال ساختم حداقل دو روش رو ابداع کردم (البته اگه بشه اسمش رو ابداع گذاشت) که یکی از اونها رو با کمی تغییر و ساده کردن در این تاپیک شرح می دم.
دکمه ای که ما می سازیم در واقع عملکرد مشابه دکمه Mute در ویندوز و یا در Control Remote دستگاههای ضبط صوت و تلویزیون رو داره.
پیش فرضهای من برای کاربرانی که قصد استفاده از این مقاله رو دارن عبارتند از:
1- شما یک فایل فلش ساخته اید که شامل یک فایل موسیقی زمینه است. در این مقاله حالتی رو توضیح دادم که فایل موسیقی به داخل نرم افزار وارد شده و پس از ايجاد يك فريم كليدي از پنجره Library به داخل صفحه كاري کشیده شده، در انتهاي انيميشن هم فريم كليدي ايجاد شده و گراف صدا در Timeline دیده می شه. اگر صدا رو به صورت تو در تو داخل یک کلیپ متحرک (Movie clip) قرار دادین یه مقدار کد نویسیش فرق می کنه(در صورت لزوم بگید تا بنویسم).
2- شما با اصول اولیه کار با نرم افزار فلش و مختصری با کد نویسی به زبان Action Script آشنا هستید.
گامهای زیر رو طی کنید:


گام اول: ساخت شکلک قطع و وصل صدا

در این قسمت می تونید یک آیکون ساده بسازید. اما من یک اکولایزر مصنوعی رو برای این دکمه طراحی کردم. البته روش ساخت این دکمه رو نمی خوام اینجا بنویسم چون فکر می کنم زیاد سخت نیست. در عوض فایل سورس رو می ذارم برای دانلود تا اگه کسی خواست دانلود کنه و باز کنه و اونجا می تونید روش ساخت این اکولایزر مصنوعی رو ببینید.
اما توجه کنید که هرچند شکلک ساده ای بخواین بسازین اما حتما باید اون رو به صورت یک نماد (Symbol) از نوع Movie Clip و یا Button در بیارید تا بتونید بهش کد بدین و نمونه رو نامگذاری کنید تا برنامه بتونه بهش مراجعه کنه.
چنانچه در شکل شماره 1 مشاده می کنید، سه Symbol رو ساختم که در کتابخانه قابل رویتند. اولی یک مستطیل ساده بدون خط حاشیه به نام scolumn، دومی کلیپی شامل چهار ستون متحرک که ستونهاش همون شی scolumn هستند و در واقع نقش اکولایزر مصنوعی رو بازی می کنه به نام scolumn_move (تصویر شماره 2). و سومی کلیپ اصلی دکمه که شامل یک نمونه از scolumn_move و یه کادر پس زمینه است و قراره توسط کاربر کلیک بشه به نام sound_onoff.

تصویر شماره 1
p1.jpg


تصویر شماره 2
p2.jpg



گام دوم: ایجاد لایه جدید برای قرار دادن شکلک صدا

من یک لایه به نام sound_button ساختم تا شکلک از بقیه اشیا صفحه کاملا جدا باشه. بهتره این لایه رو بالای تمام لایه ها بسازین تا همیشه روی همه اشیا باشه و حین اجرا شدن فایل پنهان نشه (تصویر شماره 3).

تصویر شماره 3
p3.jpg



گام سوم: قرار دادن شکلک در صفحه کاری و نامگذاری نمونه ها

در حالی که لایه sound_bottun انتخاب شده و در فریم دلخواه (مثلا فریم اول) قرار دارین، یک نمونه از دکمه ایجاد شده با نام sound_onoff رو به داخل صفحه کاری پروژه بکشید و در محل مناسب قرار بدید.
در پنل properties یک نام اختصاصی به اون بدید. Flash به طور خودکار روی نمونه ها اسم خاص نمی گذاره. اما شما زمانی که می خواین با کدنویسی به اون شیء رجوع کنید، باید یک نام ویژه بهش بدید. در این مورد من نوشتم sound_onoff1 (تصویر شماره 4).
اگر مثل من یک دکمه تو در تو برای صدا ساختین باید روش دابل کلیک کنید و به کلیپ داخلی اون (در اینجا scolumn_move) هم نام اختصاصی بدید. من نوشتم scolumn_move1 (تصویر شماره 5).

تصویر شماره 4
p4.jpg


تصویر شماره 5
p5.jpg



گام چهارم: تعریف متغیر وضعیت صدا در فریم اول اصلی

اکنون به سطح سکانس برگردید. من معمولا در پروژه های Flash که کار می کنم یک لایه به نام action می سازم تا دستوراتی که باید در سطح فریمهای اصلی اجرا بشن رو بتونم راحت کنترل کنم. پیشنهاد می کنم شما هم این لایه رو بسازید و بعد در فریم اول اون یک keyframe تعریف کنید (با زدن F6) و بعددر پنل Action دستور زیر رو تایپ کنید:
کد:
Switcher = 1;
این متغیر که با مقدار مثبت 1 مقدار دهی شده با هر بار کلیک کردن کاربر مقادیر منفی و مثبت به خودش می گیره. 1 یعنی صدا داره پخش می شه و 2 یعنی پخش نمی شه (تصویر شماره 6).

تصویر شماره 6
p6.jpg



گام پنجم: کد نویسی برای شکلک قطع و وصل صدا

این گام، فنی ترین گام این آموزش است. روی شکلک صدا که داخل صفحه قرار دادید کلیک کنید و در پنل Action دستورات زیر رو تایپ کنید:
کد:
on (release) {
	so = new Sound(_root);
	s = _root.switcher;
	s = -1*s;
	_root.switcher = s;
	if (s<0) {
		with (_root) {
			so.setVolume(0);
			sound_onoff1.scolumn_move1.stop();
		}
	} else {
		with (_root) {
			so.setVolume(100);
			sound_onoff1.scolumn_move1.play();
		}
	}
}

این اسکریپت رو برای متغیرهایی با نامهایی که انتخاب کردم نوشته ام. اگه نامگذاری شما متفاوته باید اسکریپت رو اصلاح کنید (تصویر شماره 7).

تصویر شماره 7
p7.jpg


شرح اسکریپت:
اول صدای موجود در سطح فریمهای اصلی (root) به صورت متغیری به نام so تعریف می شه.
بعد متغیر switcher که در سطح اصلی تعریف شده در هر بار کلیک مثبت و منفی می شه و در واقع به کلید قطع و وصل صدا حالت دو وضعیتی می ده. مثل کلید play و pause در Media player ویندوز مثلا.
بعد تعریف می کنه که بستن حجم صدا همراه با توقف انیمیشن اکولایز مصنوعی باشه و وصل کردن حجم صدا همراه با حرکت اکولایزر.


گام ششم: آزمایش پروژه و مشاهده نتیجه کار

پروژه رو تست (Ctrl + Enter) و در صورت نیاز رفع اشکال کنید. با کلیکهای متوالی روی دکمه ساخته شده، صدا باید قطع و وصل بشه و اکولایزر هم متوقف بشه و به حرکت در بیاد (تصویر شماره 8).

تصویر شماره 8
p8.jpg


امیدوارم این مقاله مورد استفاده دوستان قرار بگیره. در زیر لینک فایلهای نمونه رو برای دانلود می ذارم. توجه کنید که فایل اصلی با ورژن MX 2004 ساخته شده و ممکنه در نسخه های قدیمی تر باز نشه.
-------------------------------------------
لینکها:

فایل اصلی به فرمت fla

فایل نمونه نتیجه کار با فرمت swf

فایل صوتی استفاده شده با فرمت mp3
 
آخرین ویرایش:

corel

Active Member
با سلام

فکر کنم خیلی شرح دادم کسی رغبت نمی کنه بخونه.

می خواستم اگه مشتری زیاد بود بشینم رو یه ضبط صوت مجازی با امکانات اولیه کار کنم اگه به نتیجه رسیدم بذارم اینجا.

ولی حالا حسش نیست.

یا کاربردی واسه کسی نداشت یا از روشهای ساده تر استفاده می کنن بعضیا.
 

جدیدترین ارسال ها

بالا