پـــــــــرشـــــــیــــــــن رایــــــــانـــــــــه

آموزش جامع مبانی کامپیوتر و نرم افزار به صورت تصویری

پـــــــــرشـــــــیــــــــن رایــــــــانـــــــــه

آموزش جامع مبانی کامپیوتر و نرم افزار به صورت تصویری

پـــــــــرشـــــــیــــــــن رایــــــــانـــــــــه

سلام خدمت همه دوستان عزیز ، پرشین رایانه قصد دارد تا شمارا با مبانی کامپیوتر و نرم افزار آشنا سازد و امیدوار است تا شما عزیزان را در این مسیر همراهی کند.

بایگانی

آموزش (Flash CC) قسمت دوم

دوشنبه, ۱۳ مهر ۱۳۹۴، ۰۴:۵۲ ب.ظ

در این فصل میخواهیم یکسری تنظیمات فلش را بررسی کنیم. برای شروع یک صفحه از نوع ActionScript 3.0 ایجاد کردهایم. به طور مثال میخواهیم یک مستطیل رسم کنیم که نیمی داخل و نیم دیگر آن خارج از صفحه اصلی باشد. روی ابزار مستطیل کلیک کنید.
[تصویر:  001.gif]

برای رسم مستطیل از قسمت مشخص شده با کادر قرمز تا قسمت مشخص شده با کادر سبز درگ کنید.
(یعنی روی قسمت مشخص شده با کادر قرمز کلیک کرده و دکمه چپ ماوس را فشرده نگه دارید و ماوس را به محل مشخص شده با کادر سبز برده و سپس دکمه چپ ماوس را رها کنید.)
[تصویر:  002.gif]

برای مشاهده خروجی، دکمه Ctrl + Enter صفحه کلید را فشار دهید. ( دکمه Ctrl صفحه کلید را فشرده نگه داشته و سپس کلید ٍEnter را فشار دهید.)
مشاهده میکنید که فقط قسمتی از مستطیل که داخل صفحه اصلی بوده به نمایش در آمده است. روی دکمه Close کلیک کنید.
[تصویر:  003.gif]

گاهی نیاز است صفحه را بزرگتر ببینیم. برای این کار میتوانید از منوی مشخص شده یا ابزار Zoom یا از کلید میانبر Ctrl و + استفاده کنید. برای درک بهتر کلیدهای Ctrl و + صفحه کلید را فشار دهید. ( دکمه Ctrl صفحه کلید را فشرده نگه داشته و سپس کلید + را فشار دهید.)
[تصویر:  004.gif]

مشاهده میکنید که صفحه بزرگنمایی شده حال میخواهیم به حالت قبل بازگردیم. برای این کار نیز از کلیدهای Ctrl و – استفاده میکنیم. در واقع Ctrl و – برعکس 
دکمه Ctrl و + عمل میکند. دکمه Ctrl و – صفحه کلید را فشار دهید.
[تصویر:  005.gif]

ممشاهده میکنید که صفحه نمایش به حالت قبل بازگشته است. گاهی ممکن است به علت جابه جایی زیاد صفحه یا Stage، در وسط پنجره نباشد برای این که صفحه را درست در وسط پنجره قرار دهیم تا راحت‌تر بتوانیم کار کنیم، از دکمه center stage استفاده میکنیم. روی دکمه center stage کلیک کنید.
مشاهده میکنید که صفحه اصلی دقیقاً در مرکز قرار گرفته است.
[تصویر:  006.gif]

یکی از ابزارهای بسیار مفید که در نرمافزار Flash وجود دارد، ابزار خط‌کش یا rulers میباشد. با کمک این ابزار دو خط‌کش در بالا و سمت راست صفحه ظاهر می‌شود که به کمک آنها میتوان اشکال مورد نظر را با دقت بیشتری رسم کرد. برای نمایش خط‌کش، روی منوی view کلیک کنید
روی گزینه rulers کلیک کنید
[تصویر:  007.gif]

مشاهده میکنید که دو خط‌کش ظاهر شده است. 
گاهی نیاز است اشکال رسم شده در صفحه را جابهجا کنید. برای اینکار از ابزار Selection Tools استفاده میکنیم. به طور مثال میخواهیم مستطیل رسم شده را جابهجا کنیم. برای این کار، روی ابزار Selection Tools کلیک کنید.
[تصویر:  008.gif]

برای انتخاب مستطیل از محل مشخص شده با کادر قرمز تا محل مشخص شده با کادر سبز درگ کنید.
(یعنی روی قسمت مشخص شده با کادر قرمز کلیک کرده و دکمه چپ ماوس را فشرده نگه دارید و ماوس را به محل مشخص شده با کادر سبز برده و سپس دکمه چپ ماوس را رها کنید.)
[تصویر:  009.gif]

مشاهده میکنید که مستطیل انتخاب شده است. برای جابجایی مستطیل از محل مشخص شده با کادر قرمز (محل کنونی مستطیل) تا محل مشخص شده با کادر سبز (محل بعدی مستطیل) درگ کنید.
[تصویر:  010.gif]

مشاهده میکنید که محل مستطیل جابهجا شده است.
برای استفاده دقیق‌تر از ابزار rulers میتوانید 
خطکشهایی را در صفحه قرار دهید. برای این کار باید روی 
خط‌کش در محور Xها یا Yها کلیک کرده و تا محل مورد نظر خود در صفحه درگ کنید. اکنون مشاهده می‌کنید که در حال قرار دادن چهار خط‌کش در صفحه هستیم.
بعد از رسم خطکشها تصمیم میگیریم که محل قرارگیری یکی از خطکشها را تغییر دهیم. برای این کار روی خطکش مشخص شده دابل کلیک کنید
[تصویر:  011.gif]

در پنجره بازشده باید محل قرارگیری خطکش را تعیین کنیم. قصد داریم محل قرارگیری خطکش را از 100 پیکسل به 50 پیکسل تغییر دهیم. عدد 50 را تایپ کنید.
روی دکمه OK کلیک کنید.
[تصویر:  012.gif]

مشاهده میکنید که محل قرارگیری خطکش مورد نظر، تغییر کرده است. البته با استفاده از ماوس نیز می‌توانید محل خط‌کش‌ها را تغییر دهیم. توجه داشته باشید که این خط‌کشها برای سادگی کار هستند و در فایل نهایی وجود نخواهند داشت. برای امتحان این موضوع، دکمه Ctrl + Enter صفحه کلید را فشار دهید.
[تصویر:  013.gif]

مشاهده میکنید که هیچ کدام از خطکشها به نمایش در نیامدهاند. روی دکمه Close کلیک کنید.
[تصویر:  014.gif]

اکنون میخواهیم یکی از خطکشها را به صورت دستی جابهجا کنیم. برای اینکار روی خطکش مشخص شده توسط کادر قرمز کلیک کنید و تا محل مشخص شده با کادر سبز درگ کنید.
[تصویر:  015.gif]

مشاهده میکنید که خطکش جابهجا شده است. برای آنکه محل خط‌کش‌ها قفل شوند و از حرکت ناخواسته خطکشها جلوگیری کنیم، منوی View را باز کنید.
منوی فرعی Guides را باز کنید.
روی گزینه Lock Guides کلیک کنید.
[تصویر:  016.gif]

با انجام اینکار هیچکدام از خطکشها حرکت نخواهند کرد. اکنون میخواهیم خطکشها نمایش داده نشوند. برای این کار منوی View را باز کنید.
منوی فرعی Guides را باز کنید.
روی گزینه Clear Guides کلیک کنید
[تصویر:  017.gif]

مشاهده میکنید که تمام خطکشها حذف شدهاند.
[تصویر:  018.gif]

اکنون یک پروژه جدید ایجاد کرده‌ایم و می‌خواهیم روش وارد کردن تصاویر به داخل فلش را بررسی کنیم. در ابتدای کار قصد داریم این پروژه را ذخیره کنیم. روی منوی File کلیک کنید.
روی گزینه Save As کلیک کنید.
[تصویر:  019.gif]

در ادامه عبارت ENIAC را برای نام این پروژه وارد 
میکنیم.
روی دکمه Save کلیک کنید.
[تصویر:  020.gif]

اکنون این پروژه ذخیره شده است. برای تعیین ابعاد صفحه یا Stage که همان خروجی ما می‌باشد، از قسمت Properties استفاده میکنیم. روی قسمت مشخص شده کلیک کنید.
[تصویر:  021.gif]

عدد 450 را تایپ کنید.
روی قسمت مشخص شده کلیک کنید.
[تصویر:  022.gif]

عدد 250 را تایپ کنید.
دکمه Enter صفحه کلید را فشار دهید.
[تصویر:  023.gif]

حال برای این که صفحه دقیقاً در مرکز قرار بگیرد، روی گزینه Center Stage کلیک کنید.
[تصویر:  024.gif]

برای اینکه کل صفحه را بتوانیم مشاهده کنیم، روی منوی بازشونده مشخص شده کلیک کنید.
[تصویر:  025.gif]

عدد 75 که نشان‌دهنده 75% است را وارد کنید.
دکمه Enter صفحه کلید را فشار دهید.
[تصویر:  026.gif]

حال میخواهیم چند تصویر وارد صفحه کنیم. منوی File را باز کنید.
منوی فرعی Import را باز کنید.
برای وارد کردن تصاویر به صفحه Stage، از منوی بازشده روی گزینه Import to Stage کلیک کنید.
[تصویر:  027.gif]

روی تصویر مشخص شده دابل کلیک کنید.
[تصویر:  028.gif]

روی سربرگ Library کلیک کنید.
[تصویر:  029.gif]

مشاهده میکنید که تصویری که وارد صفحه کردهایم وارد پنل Library شده است. در مورد این پنل بعداً توضیح خواهیم داد. هر فایلی از جمله صوت، تصویر و فیلمی که وارد فلش میکنید در این پنل قرار میگیرد. به این نکته توجه داشته باشید که اگر فایل در این قسمت وجود داشته باشد دلیل بر این نیست که داخل فلش نیز استفاده شده باشد. در این پنل میتوانید پیشنمایشی از فایلها را نیز ببینید.
[تصویر:  030.gif]

حال میخواهیم چند تصویر دیگر نیز وارد کنیم. منوی File را باز کنید.
منوی فرعی Import را باز کنید.
اکنون میخواهیم تصویر فقط در پنل Library یا کتابخانه فلش وارد شود و در صفحه یا Stage قرار داده نشود. روی گزینه Import to Library کلیک کنید.
[تصویر:  031.gif]

در ادامه تصاویر مورد نظر را با استفاده از دکمه Ctrl و دکمه چپ ماوس انتخاب میکنیم.
روی دکمه Open کلیک کنید.
[تصویر:  032.gif]

مشاهده میکنید که تصاویر بدون این که در صفحه اصلی نمایش داده شوند در پنل Library قرار گرفته‌اند. شما میتوانید یک عکس وارد Library بکنید و چند بار از آن استفاده کنید. شاید این سوال برایتان پیش آمده باشد که چرا از هر تصویر یک نسخه کوچک و یک نسخه بزرگ وارد کردهایم و چرا همان یک تصویر را تغییر سایز نمیدهیم. علت اینکار اینست که چون تصاویر از نوع Bitmap میباشند، با تغییر سایز از کیفیت آنها در فلش کاسته خواهد شد.
[تصویر:  033.gif]

در فلش میتوانید تصاویر چند لایه را نیز وارد کنید. به طور مثال میخواهیم یک فایل چند لایه ساخته شده توسط فتوشاپ را وارد Library کنیم. برای این کار منوی File را باز کنید.
منوی فرعی Import را باز کنید.
روی گزینه Import to Library کلیک کنید.
[تصویر:  034.gif]

روی فایل مشخص شده دابل کلیک کنید.
[تصویر:  035.gif]

در این صفحه یکسری تنظیمات در مورد فایلهای چند لایه‌ایی مشاهده میکنید. به قسمت text conversion توجه کنید. با فعال کردن گزینه Editable Text میتوانید بعد از وارد کردن این تصویر متنهای موجود در آن را ویرایش کنید. با فعال بود گزینهVector outline میتوانید لایه های تصویر را مشاهده کنید اما قادر به تغییر آنها نیستید و در آخر با فعال کردن گزینه Flattened bitmap image فقط میتوانید تصویرکلی را مشاهد کنید. برای اینکه قصد اضافه کردن این فایل به پروژه را نداریم، روی دکمه Cancel کلیک کنید.
[تصویر:  036.gif]

حال میخواهیم تصویر موجود در صفحه را تغییر سایز دهیم. برای اینکار روی تصویر مشخص شده کلیک کنید تا به حالت انتخاب در بیاید.
[تصویر:  037.gif]

روی سربرگ Properties کلیک کنید.
به قسمت Position and size توجه کنید. همانطور که مشاهده می‌کنید با استفاده از ماوس در حال تغییر اندازه تصویر هستیم. با فعال بودن دکمه مقدار طول و عرض به صورت متناسب کاهش یا افزایش می‌یابد یعنی با تغییر یکی دیگری نیز به همان نسبت تغییر میکند تا ابعاد تصویر متناسب باشد. 
[تصویر:  038.gif]

حال میخواهیم تصاویری که در Library وجود دارند را کمی مرتب و دسته‌بندی کنیم. برای شروع روی سربرگ Library کلیک کنید.
میخواهیم یکسری از تصاویر را داخل یک پوشه قرار دهیم. برای اینکار روی دکمه New Folder کلیک کنید.
[تصویر:  039.gif]

در ادامه عبارت Pics را برای نام این پوشه واردمیکنیم.
حال میخواهیم تصویر مورد نظر را در داخل پوشه قرار دهیم. برای این کار روی تصویر مشخص شده توسط کادر قرمز کلیک کنید و تا روی پوشه مشخص شده با کادر سبز درگ کنید.
[تصویر:  040.gif]

مشاهده میکنید که تصویر مورد نظر به داخل پوشهایی که ایجاد کردهایم منتقل شده است. در ادامه چند تصویر دیگر را نیز به همین صورت به داخل پوشه منتقل می‌کنیم.
میخواهیم تصاویر موجود در پوشه را مشاهده کنیم. برای اینکار روی فلش مشخص شده کلیک کنید تا محتویات پوشه را مشاهده کنید.
[تصویر:  041.gif]

اکنون می‌توانید لیست عناصر موجود در پوشه Pics را مشاهده کنید. در صورتی که بخواهید فایلهای تصویر را داخل فلش وارد نکنید و از روی فایلهای خارجی تصاویر را نمایش دهید باید از کدهای ActionScript استفاده کنید که برای یادگیری آن می‌توانید به آموزش ActionScript قابل دانلود از سایت http://www.learninweb.com مراجعه کنید.
[تصویر:  042.gif]

یکی از راههای سازماندهی تصاویر و اشیایی که روی صفحه قرار دارند، استفاده از لایهها میباشد. اگر با نرمافزار فتوشاپ کارکرده باشید با این موضوع آشنا هستید. همان طورکه مشاهده میکنید در صفحه یک آدمک و لوگوی انیاک را قرار دادهایم و هر کدام را داخل لایه جداگانهایی گذاشتهایم. به طور مثال اکنون میخواهیم آدمک نمایش داده نشود. برای اینکار از گزینه show or hide layer استفاده میکنیم. با فعال کردن گزینه show or hide layer برای هر لایه، همان لایه مخفی می‌شود. به طور مثال لایهای که آدمک در آن قرار دارد یعنی Layer 2 را میخواهیم مخفی کنیم. برای این کار روی گزینه show or hide layers کلیک کنید.
[تصویر:  043.gif]

مشاهده میکنید که آدمک غیر قابل رویت شده است. دوباره برای اینکه آدمک را مشاهده کنیم، روی گزینه show or hide layers کلیک کنید.
[تصویر:  044.gif]

گاهی نیاز دارید همه لایهها را غیر قابل رویت کنید. برای اینکار روی چشم مشخص شده کلیک کنید.
[تصویر:  045.gif]

برای این که به حالت قبل بازگردیم، روی چشم مشخص شده کلیک کنید.
[تصویر:  046.gif]

همانطور که میبینید، لایهها به صورت layer1، layer2 و ... به صورت پیش‌فرض نام‌گذاری میشود. برای اینکه مشخص شود هر لایه برای کدام شکل میباشد، باید نامی متناسب با شکل برای لایهها قرار دهیم. به طور مثال میخواهیم برای لایه layer1 نام انیاک را قرار دهیم. برای اینکار روی نام layer1 دابل کلیک کنید.
[تصویر:  047.gif]

عبارت Eniac را تایپ کنید.
دکمه Enter صفحه کلید را فشار دهید.
مشاهده میکنید که نام مورد نظر برای لایه layer1 قرار گرفته است. در ادامه برای لایه دوم نیز نامی متناسب قرار میدهیم.
[تصویر:  048.gif]

هر لایه بر روی لایه قبلی قرار داده می‌شود. یعنی لایه آدمک روی لایه انیاک است. برای درک بهتر این موضوع روی تصویر آدمک کلیک کرده و تا محل مشخص شده با کادر سبز درگ نمایید.
[تصویر:  049.gif]

همان طور که مشاهده میکنید چون لایه انیاک پایین لایه آدمک قرار دارد، تصویر آدمک روی تصویر لوگو قرار گرفته است. می‌خواهیم لایه انیاک را به بالای لایه آدمک ببریم. روی لایه انیاک کلیک کنید و تا بالای لایه آدمک که با کادر سبز مشخص شده است درگ کنید.
[تصویر:  050.gif]

با این کار مشاهده میکنید که آدمک زیر لوگوی انیاک قرار گرفته است.
اکنون فرض کنید میخواهیم یک لایه جدید ایجاد کنیم. برای اینکار از دکمه New layer استفاده میکنیم. روی دکمه New layer کلیک کنید
[تصویر:  051.gif]

مشاهده میکنید که ترتیب نام‌گذاری لایهها به همان ترتیب میباشد که قبلا گفته شده بود.
ممکن است شما بخواهید لایه‌های موجود را سازماندهی کنیم. برای اینکار از گزینه New Folder استفاده میکنیم که باعث ایجاد یک پوشه میشود. توجه داشته باشید هر لایه که فعال باشد، پوشه ایجاد شده قبل از آن لایه قرار میگیرد. برای درک بهتر روی دکمه New Folder کلیک کنید.
[تصویر:  052.gif]

مشاهده میکنید چون لایه اول فعال بوده، پوشه بالای لایه اول ایجاد شده است.
حال فرض کنید میخواهیم لایه Layer 3 را حذف کنیم. برای اینکار روی لایه Layer 3 کلیک کنید.
[تصویر:  053.gif]

روی دکمه Delete که با شکل سطل زباله مشخص شده است کلیک کنید.
[تصویر:  054.gif]

لایه مورد نظر حذف شد. حال میخواهیم نام پوشه ایجاد شده را عوض کنیم. برای اینکار روی نام پوشه دابل کلیک کنید.
[تصویر:  055.gif]

عبارت LOGO را تایپ کنید.
دکمه Enter صفحه کلید را فشار دهید.
حال میخواهیم دو لایه موجود را داخل پوشه قرار دهیم. برای قرار دادن لایه انیاک در داخل پوشه، روی لایه انیاک کلیک کرده و تا روی پوشه درگ نمایید.
[تصویر:  056.gif]

مشاهده میکنید که لایه مورد نظر داخل پوشه قرار گرفته است. در ادامه لایه آدمک را نیز داخل پوشه و بالای لایه انیاک قرار میدهیم.
[تصویر:  057.gif]

برای ساخت یک لایه جدید، روی دکمه New layer کلیک کنید.
[تصویر:  058.gif]

در ادامه نام لایه ساخته شده را به guide (راهنما) تغییر میدهیم.
اکنون میخواهیم این لایه جدید را از یک لایه معمولی به یک لایه راهنما تغییر دهیم. برای اینکار، روی قسمت مشخص شده از لایه، دابل کلیک کنید.
[تصویر:  059.gif]

گزینه guide را انتخاب کنید.
[تصویر:  060.gif]

روی دکمه OK کلیک کنید.
[تصویر:  061.gif]

مشاهده میکنید که این لایه به یک لایه راهنما تبدیل شده است. شاید برای شما این سوال پیش آمده باشد که لایه راهنما چیست. لایه راهنما به لایه‌ای گفته میشود که فقط در FLA وجود دارد و در SWF خروجی نمایش داده نمی‌شود. شما میتوانید در این لایه توضیحاتی قرار دهید تا با استفاده از آن توضیحات به راحتی ادامه کار را انجام دهید. در ادامه یک تصویر وارد این لایه میکنیم تا در مراحل ساخت ما را کمک کند. دقت کنید که یک آیکون نیز در کنار نام لایه ظاهر شده است. این آیکون مشخص کرده است که این لایه از نوع راهنما می‌باشد.
طرحی که در ادامه این نرم‌افزار آموزشی می‌خواهیم بسازیم بصورت یک تصویر ایجاد کرده ایم و در لایه راهنما قرار داده‌ایم. حال با وارد کردن این تصویر متوجه شدهایم که محل قرار‌گیری دو تصویر آدمک و لوگوی انیاک درست نمیباشد. در ادامه با تغییر اندازه و سایز این دو، محل قرار گیری آنها را درست میکنیم.
[تصویر:  062.gif]

مشاهده میکنید دو تصویر روی هم قرار گرفتهاند. برای اینکه کاملا مطمئن شوید، روی دکمه مشخص شده کلیک کنید تا تصویر آدمک دیده نشود.
[تصویر:  063.gif]

دوباره روی دکمه مشخص شده کلیک کنید تا تصویر آدمک قابل دیدن شود.
[تصویر:  064.gif]

پس دو تصویر کاملاً روی هم افتادهاند.
یکی دیگر از امکانات لایهها استفاده از قفل میباشد. با قفل کردن هر لایه میتوانید از هر گونه تغییر در آن لایه جلوگیری کنید. به طور مثال روی قسمت مشخص شده از لایه آدمک کلیک کنید تا لایه قفل شود.
[تصویر:  065.gif]

حال روی شکل آدمک کلیک کنید و تا قسمت مشخص شده با کادر سبز درگ نمایید.
[تصویر:  066.gif]

مشاهده میکنید که تصویر آدمک هیچ گونه تغییری نکرده است زیرا ما این لایه را قفل کردیم.
برای مشاهده خروجی که تا اینجا اینجا کردهایم، دکمه Ctrl + Enter صفحه کلید را فشار دهید.
مشاهده میکنید که فقط یک تصویر آدمک و لوگوی انیاک به نمایش در آمده است و تصویر راهنما نیز نمایش داده نشده است.
[تصویر:  067.gif]

یکی از کارهایی که نرم‌افزار فلش انجام میدهد، کنترل کردن، جابهجا کردن و مخفی کردن اشیاء میباشد. برای درک چگونگی انجام اینکار، باید کار با frames، TimeLine و Keyframes آشنا شوید. همان طور که مشاهده میکنید یک فایل با نام travelPhotos.fla ایجاد کردهایم که دارای پنج لایه و چهار تصویر داخل کتابخانه (Library) است. حال میخواهیم یک نمونه از فایل نهایی که قصد داریم در این قسمت درست کنیم را نمایش دهیم. برای اینکار روی فایل مشخص شده دابل کلیک کنید.
[تصویر:  068.gif]

مشاهده میکنید چهار عکس پشت سر هم به نمایش در میآید و سپس یک متن کوتاه نمایش داده میشود. در ادامه این بخش می‌خواهیم این پروژه را بسازیم. روی دکمه Close کلیک کنید.
[تصویر:  069.gif]

برای اینکه بتوانیم کل صفحه را مشاهده کنیم، روی منوی بازشونده مشخص شده کلیک کنید.
روی گزینه Fit in Window کلیک کنید.
[تصویر:  070.gif]

همان طور که مشاهده میکنید پنج لایه ایجاد کردهایم، که 4 لایه برای عکس و لایه پنجم را برای متن استفاده میکنیم. اکنون روی پنل Properties کلیک کنید.
[تصویر:  071.gif]

میخواهیم تعیین کنیم که در هر ثانیه 24 فریم نمایش داده شود. برای اینکار از قسمت FPS استفاده میکنیم. چون میخواهیم فایل نهایی ما پنج ثانیه طول بکشد(5X24=120)، باید برای لایه‌ها 120 فریم در نظر بگیریم. روی لایه image1 کلیک کنید.
[تصویر:  072.gif]

یک روش‌ برای اینکه یک فریم به این لایه اضافه کنیم، استفاده از دکمه میانبر F5 میباشد. برای اضافه کردن 5 فریم، 5 بار دکمه F5 را فشار دهید.
کلیدهای میانبر پر کاربرد :
F5 : درج فریم
Shift+ F5 : حذف فریم
F6: KeyFrame ایجاد یک 
Shift + F6: KeyFrame حذف یک 
F7: Blank KeyFrame درج یک 
Return : اجرای فیلم در محیط
Enter : اجرای فیلم در محیط
Shift + , : برگشت به ابتدا 
. (نقطه) :یک فریم حرکت به جلو 
, (کاما):یک فریم حرکت به عقب
5 فریم به این لایه اضافه شده است. حال میخواهیم یک روش دیگر برای اضافه کردن فریم را بررسی کنیم. ابتدا برای اینکه قسمت بیشتری از پنل Timeline را مشاهده کنیم، روی فلش مشخص شده کلیک کنید تا پنل Properties بسته شود.
[تصویر:  073.gif]

روی قسمت مشخص شده از نوار لغزان کلیک کنید.
[تصویر:  074.gif]

همان طور که قبلا گفتیم 120 فریم نیاز داریم. برای اینکه 120 فریم به این لایه اضافه کنیم نیاز نیست 120 بار دکمه F5 را فشار دهید. کافیست روی فریم مورد نظر یعنی فریم 120 کلیک راست کنید. 
[تصویر:  075.gif]

از منوی بازشده روی گزینه Insert Frame کلیک کنید.
[تصویر:  076.gif]

مشاهده میکنید که 120 فریم ایجاد شده است. یک راه دیگر نیز کلیک بر روی فریم 120 و فشردن کلید F5 است. حال میخواهیم عکس مورد نظر را وارد صفحه کنیم. در ادامه پنل Library را به نمایش در می‌آوریم.
[تصویر:  077.gif]

حال روی تصویر مشخص شده با کادر قرمز کلیک کنید و تا محل مشخص شده با کادر سبز درگ نمایید.
[تصویر:  078.gif]

مشاهده میکنید که تصویر مورد نظر در صفحه قرار گرفته است. در ادامه همین کار را برای 3 لایه دیگری که قرار است تصویر در آنها نمایش داده شود، انجام می‌دهیم
در ادامه به ابتدای پنل Timeline میرویم و پنل کتابخانه را نیز مخفی میکنیم.
[تصویر:  079.gif]

به فریم شماره 1 هر لایه توجه کنید. مشاهد میکنید که لایه‌ایی که تصویر در آن قرار دارد دارای نقطه مشکی تو پر است و سه لایه دیگری که بدون تصویر میباشند دارای نقطه تو خالی هستند. حال میخواهیم تا اینجای پروژه را امتحان کنیم. برای این که پنجره جدیدی برای امتحان فایل باز نشود، به جای دکمه Ctrl + Enter، فقط دکمه Enter صفحه کلید را فشار دهید. 
مشاهده میکنید که نوار تایم لاین به حرکت در آمده است و تصویر نمایش داده میشود. در قسمت مشخص شده میتوانید سرعت حرکت و فریم جاری را مشاهده کنید.
حال میخواهیم یک متن به پروژه اضافه کنیم. برای اینکه میخواهیم متن در آخرین مرحله اضافه شود، روی فریم 125 لایه Text کلیک کنید.
[تصویر:  080.gif]

برای اینکه تا این قسمت فریم ایجاد شود، دکمه F5 صفحه کلید را فشار دهید.
چون تصویر فقط تا فریم 120 وجود داشت دیگر در فریم 125 نمایش داده نشده است. حال میخواهیم یک نکته را دوباره به شما یاد آوری کنیم. برای این نکته دکمه Ctrl + Enter صفحه کلید را فشار دهید.
[تصویر:  081.gif]

مشاهده میکنید که تصویر مورد نظر به خوبی نمایش داده میشود اما بین فریم 120 تا 125 چون عکسی وجود ندارد تصویر بعد از چند ثانیه حذف شده و دوباره ظاهر می‌شود. روی دکمه Close کلیک کنید.
[تصویر:  082.gif]

اکنون برای اینکه این 5 فریم اضافی را حذف کنیم در ادامه این 5 فریم را انتخاب می‌کنیم. 
روی فریم مشخص شده کلیک راست کنید.
از منوی بازشده روی گزینه Remove Frame کلیک کنید.
[تصویر:  083.gif]

مشاهد میکنید که 5 فریم اضافه شده حذف شده‌اند. 
در ادامه به فریم 20 میرویم و یک فریم کلیدی جدید ایجاد میکنیم.
[تصویر:  084.gif]

برای آنکه در فریم شماره 20 محل تصویر تغییر پیدا کند. روی تصویر مشخص شده کلیک کنید و تا قسمت مشخص شده با کادر سبز درگ کنید.
[تصویر:  085.gif]

حال با حرکت دادن نوار تایم لاین وقتی به فریم 20 میرسیم تصویر دچار پرش میشود. در ادامه قصد داریم این keyframe را حذف کنیم. 
روی keyframe مشخص شده کلیک راست کنید.از منوی باز شده روی گزینه Clear keyframe کلیک کنید.
[تصویر:  086.gif]

مشاهده میکنید که keyframe ایجاد شده، حذف شده است. اکنون میخواهیم برای زیبایی کار کمی تصویر را دوران دهیم. برای اینکار روی تصویر مشخص شده کلیک کنید.
[تصویر:  087.gif]

برای انجام دوران و تغییر سایز تصویر دکمه q صفحه کلید را فشار دهید.
[تصویر:  088.gif]

در ادامه تصویر را با استفاده از ماوس کمی دوران میدهیم.
با این کار زمانی که هد پخش به فریم مورد نظر برسد دوران تصویر به پایان خواهد رسید. برای اینکه به صورت ناخواسته تغییری در تصویر رخ ندهد، روی دکمه مشخص شده کلیک کنید تا این لایه فقل شود
[تصویر:  089.gif]

حال برای وارد کردن تصویر دوم روی فریم مشخص شده کلیک راست کنید.
[تصویر:  090.gif]

از منوی باز شده روی گزینه Insert Blank Keyframe کلیک کنید.تا یک فریم کلیدی جدید ایجاد شود.
[تصویر:  091.gif]

همان طور که میبینید که keyframe خالی ایجاد شده است. برای اضافه کردن keyframe خالی میتوانید از مسیر منوی Insert < Timeline < Blank Keyframe را انتخاب کنید. حال روی دکمه Library کلیک کنید.
[تصویر:  092.gif]

روی تصویر Vacation_2 کلیک کرده و تا قسمت مشخص شده با کادر سبز درگ نمایید
[تصویر:  093.gif]

در ادامه حالت قرار گرفتن این تصویر را نیز تنظیم میکنیم.
[تصویر:  094.gif]

روی دکمه مشخص شده کلیک کنید تا این لایه نیز فقل شود.
[تصویر:  095.gif]

در ادامه دو تصویر دیگر را نیز وارد میکنیم.
اکنون میخواهیم با نمایش آخرین عکس، یک متن کوتاه نیز نمایش داده شود. برای اینکار روی فریم مشخص شده در لایه Text کلیک کنید.
[تصویر:  096.gif]

دکمه F5 صفحه کلید را فشار دهید.
حال ابزار Text را انتخاب کنید.
[تصویر:  097.gif]

در پنل Properties میتوانید تنظیمات متن را تغییر دهید. روی قسمت مشخص شده کلیک کنید.
[تصویر:  098.gif]

در ادامه عبارت مورد نظر را تایپ میکنیم.
حال برای تست فایل نهایی دکمه Ctrl + Enter صفحه کلید را فشار دهید.
[تصویر:  099.gif]

مشاهده میکنید که به فایل مورد نظر خود دست پیدا کردهایم.
[تصویر:  100.gif]

توسط مثال قبلی تا حدودی با فریمها و فریمهای کلیدی آشنا شدید. در ادامه این قسمت به تکمیل پروژه قبلی که در مورد محصولات شرکت انیاک بود می‌خواهیم بپردازیم. می‌خواهیم تصویر جلد چند محصول را در پروژه قرار دهیم تا با کلیک بر روی آنها اطلاعاتی در مورد آن محصول نمایش داده شود. مشاهده میکنید که تا همان جایی که پروژه را تکمیل کرده بودیم باز کردهایم. در ابتدا باید یک لایه جدید ایجاد کنیم. روی دکمه New Layer کلیک کنید.
[تصویر:  101.gif]

در ادامه نام مناسبی برای این لایه تعیین میکنیم.
برای این پروژه 60 فریم مد نظر داریم. برای این که به طور همزمان برای همه لایهها 60 فریم انتخاب کنیم، روی فریم 60 لایه اول کلیک کنید.
[تصویر:  102.gif]

دکمه Shift صفحه کلید را فشرده نگه داشته و سپس روی فریم 60 لایه آخر کلیک کنید.
[تصویر:  103.gif]

مشاهده میکنید که فریم 60 همه لایه ها انتخاب شده است. دکمه F5 صفحه کلید را فشار دهید.
[تصویر:  104.gif]

در این پروژه عکس چهار محصول وجود دارد می‌خواهیم با کلیک بر روی هر محصول وارد صفحه توضیحات و عکس آن محصول بشویم. برای این کار باید با کلیک بر روی هر محصول به فریم آن محصول برویم. در این مثال با کلیک روی تصویر آموزش ActionScript، می‌خوانیم به فریم 10 برویم و با کلیک بر روی تصویر آموزش Excel به فریم شماره 20 برویم. حال در فریم 10 باید متن و تصویر محصول ActionScript را نمایش دهیم و در فریم 20 نیز باید متن و تصویر محصول Excel را نمایش دهیم. حال روی فریم 10 لایه ایجاد شده کلیک راست کنید.
[تصویر:  105.gif]

از منوی بازشده روی گزینه Insert Blank Keyframe کلیک کنید تا یک Keyframe خالی ایجاد شود. تفاوت این گزینه با گزینه Insert Keyframe این است که با انتخاب گزینه Insert Blank Keyframe یک فریم خالی ایجاد میشود اما با انتخاب گزینه Insert Keyframe یک Keyframe از Keyframe قبلی کپی گرفته و آن را قرار میدهد. 
[تصویر:  106.gif]

برای عدم نمایش لایه راهنما، روی گزینه مشخص شده کلیک کنید.
[تصویر:  107.gif]

روی گزینه مشخص شده کلیک کنید تا لایه آدمک نیز غیر قابل نمایش شود.
[تصویر:  108.gif]

حال روی فلش مضاعف قسمت Library کلیک کنید.
[تصویر:  109.gif]

روی تصویر جلد آموزش اکشن اسکریپت کلیک کنید و تا قسمت مشخص شده از صفحه درگ نمایید.
[تصویر:  110.gif]

حال روی فریم 20 کلیک راست کنید.
[تصویر:  111.gif]

روی گزینه Insert Keyframe کلیک کنید تا یک کپی از فریم قبلی از Keyframe ایجاد شده گرفته شود.
[تصویر:  112.gif]

اکنون میخواهیم این تصویر را با تصویر دیگری عوض کنیم. برای این که دقیقا در همین محل قرار بگیرد از گزینه Swap استفاده میکنیم. برای فعال شدن گزینه Swap، ابتدا روی تصویر کلیک کنید.
[تصویر:  113.gif]

حال روی دکمه Swap کلیک کنید.
[تصویر:  114.gif]

در این پنجره، تصاویر موجود در کتابخانه (Library) را می‌توانید مشاهده کنید. روی تصویر مشخص شده کلیک کنید.
[تصویر:  115.gif]

روی دکمه OK کلیک کنید.
[تصویر:  116.gif]

مشاهده میکنید که تصویر مورد نظر با تصویر قبلی عوض یا Swap شده است. در ادامه به همین روش تصویر دو محصول دیگر را در فریمهای 30 و 40 قرار می‌دهیم. به علت اینکه تا فریم 50 بیشتر نیاز نداریم به همان روشی که قبلاً گفته بودیم، 10 فریم بین 50 تا 60 را حذف خواهیم کرد.
همان طور که میبینید چهار تصویر را با فاصله 10 فریم در لایه مورد نظر قرار دادهایم. با حرکت دادن نوار Timeline میتوانید عوض شدن تصاویر را مشاهده کنید. توجه داشته باشید که علت خاصی ندارد که تصاویر را با فاصله 10 فریم قرار دادهایم. شما میتوانید هر تصویر را با فاصله 1 فریم قرار دهید. اما برای این که واضح‌تر بتوانیم ببینم، 10 فریم فاصله ایجاد کردهایم.
روی گزینه مشخص شده کلیک کنید تا تصویر آدمک قابل نمایش باشد.
[تصویر:  117.gif]

با حرکت دادن نوار Timeline میتوانید عوض شدن تصاویر را مشاهده کنید اما مشکل اینجاست که تصویر آدمک زیر تصاویر محصولات وجود دارد. در ادامه این نرم‌افزار آموزشی به ترتیب این مشکلات را رفع کرده و به پروژه نهایی دست پیدا خواهیم کرد.
کاربر گرامی، شما اکنون در پایان این بخش هستید، 
[تصویر:  118.gif]

موافقین ۱ مخالفین ۰ ۹۴/۰۷/۱۳

نظرات (۰)

هیچ نظری هنوز ثبت نشده است

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی