آموختن Multi Media Builder

آموختن برنامه‎ی چند رسانه‎ای Multi Media Builder

آموختن Multi Media Builder

آموختن برنامه‎ی چند رسانه‎ای Multi Media Builder

آموزش طراحی و مثالی برای ساخت یک AutoPlay ساده با برنامه MMB

در این قسمت ما برای شما یک برنامه ی کاربردی بسیار ساده که با MMB میتوان ساخت را آموزش میدهیم .

صفحه ای به اندازه ی 300 در 400 ایجاد کنید . ( اگر دوست داشتید می توانید سایر اختیارات را در زیر منوی Project Settings انجام دهید )

صفحه ای مانند صفحه ی شکل زیر ، طراحی کنید :


شکل 1 - صفحه ی نخست برنامه ی Autorun ساخته شده توسط برنامه MMB .


این صفحه همانطوری که در شکل مشاهده میکنید ، از کنترل های زیر تشکیل شده است .

  1. چهار تا Text Button که با نام های Button Glow و یک شمارش گر نام ، به ترتیب 1 و 2 و 3 و 4 بعد از آن قرار داده شده است .
  2. یک Text ( نوشته ) که محتوی نوشته ": Show Button Glows" است که با دو بار کلید بر روی شی Text و تایپ نوشته میتوانید اعمال کنید .
  3. یک Dynamic FX که در پس زمینه قرار دارد .
  4. یک Rectangle (مستطیل - هر مربع یک مستطیل است ! ) که در سمت بالای پنجره قرار گرفته است .
  5. یک Text دیگر که محتوی نوشته ی"Welcome to Gahir Help - Lesson 1 \ Fig 01" است .
  6. یک دکمه ی ضربدر در سمت راست بالا .
  7. دو دکمه ی Next و Prev که در سمت راست-پایین قرار دارد .

توجه داشته باشید که موارد 4 تا 7 در بالاترین لایه یعنی Master Top Layer قرار دارند ، بخاطر همین اشاره ای به آنها در شکل نشده است .

توضیحات مورد 1 :
این چهار دکمه که یکی پس از دیگری کپی هم هستند از قسمت جعبه ابزار (Object Toolbar (popup که در سمت چپ برنامه قرار دارد ، انتخاب شده اند .
همانطور که در شکل زیر مشاهده میکنید ، این شکل جعبه ابزار (Object Toolbar (popup را نشان میدهد .


شکل 2 - جعبه ابزار اشیا / (Object Toolbar (popup


برای استفاده اشیای موجود در این جعبه ابزار فقط کافی است که نشانگر ماوس را بر روی آن ها برده و با کلید روی کنترل مورد نظر و کلید دیگر روی پنجره ی کاری برنامه ، آنها را در دسترس قرار دهید .
که سومین عضو این جعبه ابزار است ، باعث ایجاد Text Button (دکمه) میشود . اگر ماوس را روی عضوهایی همانند این که دارای یک فلش سیاه رنگ در گوشه ی پایین-راست است ، نگاه دارید ، باعث میشود که سایر عضوهای مشابه این عضو که به گونه ای زیر عضو آن هستند ، به نمایش در بیایند .
مثلا اگر ماوس را روی عضو Text Button نگه دارید ، میتوانید سایر عضوهای مشابه این عضو را مشاهده و از آنها استفاده کنید .


شکل 3 - نمایش عضوهای مشابه اعضای جعبه ابزار در صورت وجود


شما این چهار دکمه را با عمل انتخاب-رها /کپی-پیست انجام دهید و با دوبار کلید روی دکمه ها نام آن ها را مطابق شکل تغییر دهید .


شکل 4 - Property دکمه ، که با دوبار کلید روی آن ظاهر میشود

 

همانطوری که در شکل 4 مشاهده میکنید ، در قسمت Label ، نام اصلی کنترل که در برنامه مورد استفاده قرار میگیرد ، وجود دارد .

  • تیک Hide باعث مخفی شدن کنترل میشود . اگر میخواهید شی Hide شده را دوباره بازگردانید ، کافی است که در لیست Objects روی آیکون چشم که ضربدر خورده( ) است کلیک کنید .
  • تیک ، Lock Position باعث میشود که شی در مکان خودش قفل شود ؛ یعنی امکان انتخاب و تغییر موقعیت آن توسط ماوس امکان پذیر نیست .
  • قسمت Style نوع نمایشی دکمه را مشخص میکند .
  • در قسمت Font هم میتوانید قلم نوشته را تعیین کنید .
  • در قست Action میتوانید ، عملکردی که بهنگام کلید روی دکمه اجرا میشود را انتخاب کنید .
  • قسمت Cursor که به طور پیشفرض Default انتخاب شده است ، شمایل (Icon) ماوس را بهنگام رفتن ماوس روی دکمه را مشخص میکند.

بعد از اینکه دکمه ها را قرار دادید و یک نام برای هر کدام مشخص کردید . بر روی یکی از آنها کلید کرده و به قسمت Effects --> MMB Effects --> Glow رفته و افکت Glow را روی دکمه ها اعمال کنید .


شکل 5 - مسیر افکت اعمال شده روی دکمه های صفحه ی نخست


در کادرتبادلی جدیدی که ظاهر شده است ، میتوانید نحوی نمایش Effect را روی کنترل ( در اینجا دکمه ) تعیین و اعمال کنید .


شکل 6 - کادر تبادلی DropShadow/Glow


همانطوری که در شکل 6 مشاهده میکنید ، مشابه شکل تنظیمات را انجام دهید .
بعد از اینکه شما این کار را انجام دادید MMB به طور خودکار افکت ایجاد شده را با نامی که در Label شکل 6 مشخص کردید همراه Text Button ای که این افکت را روی آن اعمال کردید ، گروه بندی میکند .

شما این کار را برای هر 4 دکمه انجام دهید .

توضیحات مورد 2 :
یک شی Text () را از جعبه ابزار انتخاب کرده و در محیط کاری برنامه قرار دهید .
با دوبار کلید کردن روی آن محتویات آن را به ": Show Button Glows" تغییر داده و ذخیره کنید .

شما میتوانید از یک Text به عنوان یک Link استفاده کنید ، برای اینکار در Text Property نوشته‌یتان ، در قسمت Actions تیک Enable Actions را روشن کرده .
همچنین میتوانید رنگ نوشته را به هنگام رفتن ماوس روی Text یا کلید روی آن تعیین کنید .

توضیحات مورد 3 :
روی در قسمت جعبه ابزار کلیک کرده تا یک Dynamic FX ( افکت محرک) قرار داده باشید .

بعد از انتخاب این عضو ، برای تعیین اندازه و موقعیت FX ، در محیط کاری برنامه ، Drag-Drop (کشیدن-رهاکردن) کنید تا FX شما ظاهر شود .

با دوبار کلید روی شی FX ، کادرتبادلی خصوصیات Dynamic FX ظاهر میشود .


شکل 7 - کادر تبادلی Dynamic FX که با دوبار کلید روی FX ظاهر میشود.


شما برای اینکه بتوانید ، Autorunای شبیه شکل 1 ایجاد کنید ، میتوانید از تنظیماتی که در شکل 7 برای نوع نمایشی Dynamic FX استفاده شده است ، استفاده کنید .

نمایش و ظاهر شدن افکت Glow اطراف
روی گروهی از افکت Glow و Text Button ای که ایجاد کرده اید ، دوبار کلید کنید تا کادرتبادلی با عنوان Group ظاهر شود . در این قسمت تمامی اعضای گروهی که گروه بندی شده اند ، نمایش داده میشود .
روی دکمه دو بار کلیک کنید تا کادرتبادلی Text Button ظاهر شود . برای اینکه بتوانید برای دکمه Actionای اضافه کنید میتوانید از دکمه هایی که در قسمت Actions (قسمت پایینی) قرار دارند ، استفاده کنید .

چون عملکرد ما نیازی به نوشتن برنامه ی زیادی ندارد ، از دکمه Interaction with other objects استفاده میکنیم .


شکل 8 -دکمه Interaction with other objects


بعد از کلید روی این دکمه کادر تبادلی Interaction with other objects ظاهر میشود .


شکل 9 - کادر تبادلی Interaction with other objects


همانطور که در شکل 9 مشاهده میکنید ، در قسمت Action ما Show/Fade out را انتخاب کرده ایم تا به هنگام نمایش شی ای که در قست Object قرار است انتخاب شود به نرمی محو گردد . در قسمت Object ما عکس افکت Glow شده ی دکمه را به عنوان شی ای که قرار است ظاهر شود و بعدا به نرمی مخفی شود انتخاب کرده ایم .تنظیمات دیگر را به مانند تنظیمات شکل به حال خود رها کنید.

این عمل ها زمانی انجام میشود که ماوس روی دکمه برود و وقتی که ماوس روی دکمه رفت ، افکت Glow شده ی ما نمایش داده خواهد شد و وقتی ماوس از محوطه دکمه خارج شود ، عکس افکت Glow شده به نرمی محو میگردد .

این کارها را برای سه دکمه ی دیگر انجام دهید .  

 


شکل 1- صفحه ی شماره 2 برنامه آموزشی تکمیل شده به صورت بالا میباشد.


صفحه ای جدید به صفحه ی قبلی پروژه خود اضافه کنید .

برای پس زمینه آن یک عکس انتخاب کنید (Background) یا از Dynamic FX (آتش-Fire) استفاده کنید.

یک تکست حاوی متنی که نشان دهنده ی وارد کردن رشته در EditBox باشد را اضافه کنید . زیر این تکست یک EditBox اضافه کرده و نام آن را به دلخواه (در اینجا MessageBox ) تغییر دهید . مانند شکل زیر در قسمت Output در مقابل کادر String نامی که میخواهید از آن به عنوان متغیر استفاده شود را وارد کنید ( در اینجا $MessageBox) علامت $(دلار) بعد از نام متغیر نشان دهنده ی آن است که این متغیر از نوع String (رشته ای) است ، که در اکثر زبان های برنامه نویسی این کاراکتر بیان کننده ی این موضوع است. سپس سایر تغییراتی که دوست دارید اعمال شود را انجام دهید .


شکل 2- کادر تبادلی خصوصیات Text EditBox


دکمه ای در زیر EditBox قرار داده شده ایجاد کنید تا بتوان یک خط برنامه نویسی شده را اجرا کند .
نام دکمه را Show MSG بگذارید .



شکل 3- کادر تبادلی خصوصیات Text Button با دوبار کلید روی دکمه


روی آن دوبار کلید کرده و در قسمت Actions دکمه ی (More Actions (Script را بفشارید تا یک کادر تبادلی جدید ظاهر شود . این کادر تبادلی مکان نوشتن برنامه های خط به خطی MMB است .



شکل 4- کادر تبادلی (More Actions (Script برنامه MMB


تابع Message و سایر توابعی که در برنامه تعریف شده هستند ، به این رنگ در می آیند . در قسمت اول ( آرگمان اول این تابع) ، از ما خواسته شده است که محتویات متن پیغام نمایشی را بنویسیم ، و چون متن پیغام نمایشی ما میتواند توسط کاربر در کادر MessageBox نوشته شود ، ما از متغیر این کادر یعنی $MessageBox استفاده کرده ایم .

سایر توابع برنامه از طریق دکمه جادوگر (Wizard)[ ] قابل دسترسی و مشاهده هستند .

همانطوری که در شکل زیر مشاهده میکنید ، با انتخاب تابع Message از لیست توابع تعریف شده ی برنامه ، دو کادر برای دسترسی به آرگمان های در خواستی و یک توضیح مختصر و مفید در گوشه ی راست کادر قرار میگیرد .



شکل 5- کادر تبادلی Script Wizard برای دسترسی به سایر توابع MMB


در شکل 5، با انتخاب تابع Message ، دو کادر (String / Variable (string و (String / Variable (string/integer روشن میشوند و در سمت راست در قسمت Help توضیحاتی به همراه چندین مثال کارا در اختیار کاربر قرار داده شده است .


بعد از مشاهده و شناخت این قمست دکمه Ok را بزنید تا خط نوشته شده اعمال شود .





اگر کد نوشته شده ی شما ، درست نباشد ، یعنی دارای خطاهای نحوی MMB باشد ، MMB با اعلان پیغامی مبنی بر نادرست بودن خط نوشته شده ، آن قسمت را نادیده میگیرد .

  • در IDE برنامه MMB برای اضافه کردن توضیحات باید از دو ستاره " ** " استفاده کنید که بعد از تایپ این دو ستاره ، رنگ قسمت های بعد از آن به رنگ سبز در میآید ، یعنی در اجرای برنامه نادیده گرفته میشوند و جنبه توضیحی دارند .
  • برای تخصیص یک رشته به یک متغیر رشته ای باید از 'متن' (کوتیشن سپس متن سپس کوتیشن) استفاده کنید . که رنگ آن به طور پیشفرض به رنگ قهوه ای در می آید .
مانند شکل 1 ، دوباره یک تکست و یک EditBox ، قرار دهید . اینبار ، نام این EditBox را به TitleBox تغییر داده و متغیر آن را نیز به $TitleBox . دکمه ای زیر آن قرار دهید تا یک بار دیگر متن نوشته شده در MessageBox را به صورت پیغام نمایش دهد با این تفاوت که با زدن این دکمه به پیغام نمایشی شما یک عنوان (Title) که کاربر در کادر TitleBox وارد میکند ، اضافه میشود و به نمایش در میآید .


نام این دکمه را Show MSG EX قرار دهید .

چون تابع Message محدود است ، ما برای نمایش بهتر پیغام و استفاده از دکمه های دیگر غیر از دکمه ی Ok از تابع MessageEx استفاده میکنیم .


در تابع MessageEx اختیارات زیادی که نیاز کاربر را به پیغام برطرف کند وجود دارد . از جمله ی این اختیارات استفاده از یک متن عنوان یا Title است .

در این تابع ، متن عنوان را در آرگمان اول (قسمت اول) و متن پیغام را در آرگمان دوم قرار میدهیم .
این تابع علاوه بر اختیار متن عنوان دارای اختیارات Flag (پرچم) نیز هست .
این Flag ها نحوه ی نمایش پیغام را مشخص میکنند که توضیحات کامل آن هم در فایل Help برنامه و هم در قسمت Help تابع وجود دارد .
برای مثال اگر بخواهیم پیغام نمایشی ما دارای دو دکمه ی Ok , Cancel باشد ، از پرچم شماره 1 استفاده میکنیم .
محل قرار گیری Flagها بلافاصله بعد از کامای "," بعد از متن پیغام است .
یعنی کد زیر :

("MessageEx("MMB-Title","MMB-Description,1

MMB-Title : عنوان پیغام

MMB-Description : توضیحات
1 : دکمه ی Ok و Cancel


شما میتوانید به جای عدد 1 در کد بالا ، اختیارات دیگری که وجود دارد را قرار دهید .
برای مثال : دکمه های پیغام هم Ok و Cancel باشند ، آیکون پیغام به صورت پرسشی باشد و دومین دکمه ، دکمه ی پیشفرض انتخابی باشد ؛

در این مثال میتوانیم در محل قرار گیری عدد 1 چنین نوشت :
1+32+256

یا اینکه ، حاصل جمع آنها را نوشت ، یعنی :

289


در قسمت پایین تر مثال صفحه ی دوم ، یک تکست و یک EditBox دیگری رو قرار داده ام تا در این EditBox محل دایکتوری جاری فایل Exe ، نوشته شود .
برای اینکار ، یک تکست و یک EditBox جدید دیگری را اضافه کنید و نام متغیر EditBox را به $DirBox تغییر دهید .
روی آیکون صفحه ی دوم ، دو بار کلیک کنید تا پنجره خصوصیات صفحه ظاهر شود .


شکل 6- کادر تبادلی Page Properties هر صفحه ( در اینجا صفحه 2)


در قسمت Script روی دکمه کلیک کرده تا پنجره(More Actions (Script ظاهر شود .
برنامه هایی که در این قسمت نوشته میشوند زمانی اجرا میشوند که صفحه بار گذاری(Load) شود.
در قسمت کد نویسی برای اینکه در EditBoxمان محل دایرکتوری فایل Exe را نمایش دهیم از تابع LoadText استفاده میکنیم .

تابع LoadText نیز ، دو آرگمان میگیرد ، اولین آرگمان شی یا کنترل مقصد است که در اینجا EditBoxمان است و دومین آرگمان نیز متن نوشته است .
ما برای آنکه محل دایرکتوری فایل Exe را در EditBox به نمایش در بیاوریم ، از کلمه ی کلیدی <SrcDir> استفاده میکنیم .
وقتی برنامه را اجرا میکنید ( یعنی وقتی دکمه ی را میفشارید ) در EditBox محل نصب برنامه MMB را نشان میدهد ، چرا که محل کامپایل فایل Exe آنجاست . حال اگر بخواهیم محل فایل Exe ساخته شده، در EditBox ظاهر شود ، باید به همراه فایل Exe یک فایل Player نیز در دایرکتوری Exe قرار گیرد .
برای ایجاد این فایل Player به ترتیب به Tools-->Designer settings رفته و در قسمت To Run or Test Current page که قبلا توضیح داده شده است ، دکمه ی رادیویی Run External player in the location را بفشارید و محل فایل Exeای که میخواهید در آنجا کامپایل شود را انتخاب کنید . برای مثال : شما میخواهید فایل Autorun.exe را در دایرکتوری D:\Sample قرار دهید .


شکل 7- استفاده از یک player خارجی (External)


بعد از کلید روی دکمه سه نقطه و انتخاب محل، دکمه Ok را بفشارید .
بعد از اینکه مجددا برنامه را اجرا کردید ، دیگر برنامه یک Exe موقت در دایکتوری که قرار داده اید ایجاد میکند و آن دایکتوری میشود دایرکتوری Source و هرجا که player باشد ، دایرکتوری Source همانجا میشود حتی اگر در هر دیسک خوان قرار بگیرد !

بعد از این عمل ، همواره برنامه ، Autorun شما را از صفحه ی نخست آغاز میکند انگار که شما فایل Exe را اجرا کرده اید .
اگر برنامه را اجرا کنید و به صفحه دوم در این مثال ما بروید ، میبینید که EditBox رشته D:\Sample یعنی محلی که Exe در آن درست شده است را بر میگرداند .


کامپایل برنامه |

حال ما میخواهیم مثال خودمان را به صورت یک فایل Exe کامپایل کنیم و در دسترس عموم قرار دهیم .

به ترتیب Project-->Check & Distribute یا با استفاده از دکمه فوری آن در جعبه ابزار Main ، کادر تبادلی Check & Distribute ظاهر میشود .


شکل 8- کادر تبادلی کامپایل برای ایجاد فایل خروجی
همانگونه که در شکل 8 مشاهده میکنید این کادر تبادلی که توضیح آن داده شده است ، خصوصیات و اختیارات ایجاد فایل خروجی را نشان میدهد .

تنظیمات دلخواه را انجام دهید یا مانند شکل قسمت ها را برای ایجاد مثال مشابه پر کنید .
حال فایل Exe ما برای مصرف Autorun آماده است .
به محلی که فایل Exe را در آن ایجاد کرده اید بروید (برای مثال شکل زیر)

برای مشاهده ، اینجا کلیک کنید . 
شکل 9- دایرکتوری فایل Exe ایجاد شده
همانطوری که در شکل معلوم است ، با توجه به تنظیماتی که در شکل 8 شده است ، این برنامه 3 فایل دیگری را ایجاد کرده است که ما برای تمایز آنها ، به رنگ متفاوت در آوردیم .

فایل Autorun.inf : این فایل ، فایل اصلی برای خواندن فایل Exe میباشد . این فایل مستقیما توسط سیستم عامل خوانده میشود و بنابه دستوراتی که در آن قرار داده شده است ، عملیاتی انجام میدهد .
دستور =OPEN در خط دوم ، دستور اجرای فایلی که بعد از مساوی قرار داده شده است را به سیستم عامل برمیگرداند.
دستور =ICON نیز ، آیکون دیسک را مشخص میکند .
دیگر این فایل مانند Exe ی MMB نیاز به فایل Player ندارد و در همانجایی که فایل Exe ای که قرار است اجرا شود ، فقط با گرفتن نام فایل و پسوند آن فایل (مسیر فایل)، آن را اجرا میکند .
یعنی نباید بعد از مساوی چنین نوشت :

D:\Sample\Autorun.EXE ...........False

پس :

Autorun.EXE ........................True


قرار دادن دستور False بعد از مساوی در HardDisk ای که آن فایل وجود دارد مشکلی ندارد و باز هم فایل اجرا خواهد شد ولی وقتی دیسک را در یک لوح فشرده Write میکنیم و در رایانه ی دیگری اجرا میکنیم ، یک پیغام خطا مبنی بر این که فایل پیدا نشد ، خواهید دید .

پس اگر هدفمان ایجاد Autorun برای اجرا شدن در سایر رایانه هاست و مسلما هم همان است ، باید از دستور True (یعنی قرار دادن مسیر Autorun.EXE در مقابل دستور =OPEN) استفاده کنیم .
اگر هم فایل EXE یا هر فایل دیگری که قرار است اجرا شود در دایرکتوری های تو در توی دیگری باشد ، مثلا اگر همین فایل Autorun.EXE در D:\Sample\Layer1\Layer2\...\Autorun.EXE باشد ، در مقابل دستور =OPEN مسیر Layer1\Layer2\...\Autorun.EXE را مینویسم .

توضیحات بالایی برای دستور =ICON نیز صادق است .

مهم نیست که دستورات را در فایل autorun.inf حتما با حروف بزرگ نوشت . میتوان OPEN را به صورت oPeN نیز نوشت و اجرا هم شود . برنامه MMB این دستورات را با Case بزرگ مینویسد .


روی فایل Exe ساخته شده کلید راست کرده و Properties را انتخاب کنید . اگر تنظیمات کامپایل Exe را به مانند تنظیمات شکل 8 انجام داده باشید ، در سربرگ (Tab) دوم ، Version ، تنظیماتی که در قسمت Copyright Info شکل 8 انجام داده اید را مشاهده خواهید کرد .



شکل 10 - کادر تبادلی Properties سربرگ Version برنامه Exe ساخته شده

تصاویر زیر نیز از برنامه ساخته شده و کامپایل شده گرفته شده است :



شکل 11-صفحه 1


شکل 12- صفحه 2

شکل 13- نمایش پیغام با تنظیمات شکل 12


برای درک بهتر و مشاهده ی مثال این دو پست ، در زیر لینک دانلود مثال ساخته شده قرار داده شده است ، که میتوانید آن را دانلود کرده و بنا به آن مثالی به مانند آن بسازید :

برای دانلود فایل شده ی توضیحات بالا ، به اینجا کلیک کنید .
حجم : 880 کیلو بایت
والسلام علیکم و رحمت ا... و برکاته ! 
مثال ما به پایان رسید.
نظرات 0 + ارسال نظر
برای نمایش آواتار خود در این وبلاگ در سایت Gravatar.com ثبت نام کنید. (راهنما)
ایمیل شما بعد از ثبت نمایش داده نخواهد شد