آموزش برنامه نویسی#C، جلسه هفتم

هدف کلی:
بازی ساخت پازل

سرفصل های تئوری:
1. آشنایی با افزودن عکس،
2. کار با عکس،

پروژه(3) پازل:
در این جلسه می خواهیم پازل درست کنیم، برنامه ی ما قرار است بعد از اجرا به این صورت باشد که یک عکس را با زدن یک دکمه انتخاب کنیم و سپس به 16 قسمت به صورت تصادفی بچیند و از کاربر بخواهیم آن پازل را با استفاده از ماوس حل کند. لذا سعی می کنیم برنامه را به قسمت های کوچکتری تبدیل کنیم و پس از پایان و انجام آنها قسمت ها را به یکدیگر وصل کنیم و برنامه را پایان دهیم. ابتدا سعی می کنیم برنامه ای بنویسیم که یک عکس را داخل PictureBox لود کند پس یک دکمه و یک pictureBox روی صفحه قرار دهید. برای لود کردن یک تصویر لازم است یک دکمه قرار دهیم و در رخداد کلیک شدن روی آن امکانی برای انتخاب فایل عکس قرار دهیم، برای این کار از کنترلی به نام OpenFileDialog استفاده می کنیم قبل از استفاده از این کنترل توضیح کوتاهی در مورد آن می دهیم.

OpenFileDialog:
این کنترل به برنامه خود قابلیتی اضافه می کند که کاربر بتواند با جستجو در درایوهای کامپیوتر و انتخاب عکس مورد نظر عکس را داخل picture box قرار دهد. برای اضافه کردن این قابلیت در برنامه لازم است از کنترل dialog استفاده کنید. معمولاً در برنامه ها شرایطی وجود دارد که بخواهیم فایلی را انتخاب کنیم یا داده ای را از فایلی بخواهیم، شما در برنامه هایی نظیر paint و word برای باز کردن و انتخاب فایلی یا ذخیره فایلی با چنین کنترل هایی روبه رو شده اید. این نوع کنترلها به صورت یک مجموعه استاندارد در ویندوز وجود دارد که برنامه نویسان می توانند از آن ها در برنامه های خود استفاده کنند. مثلا برای دسترسی به پنجره open باید از کلاس OpenFileDialog استفاده کرد. برای استفاده از این کنترل لازم است آن را با کشیدن بر روی فرم به فرم خود اضافه نمایییم البته باید توجه داشته باشید که با کشیدن این کنترل چیزی بر روی فرم ما اضافه نمی شود.

پس برای انتخاب عکس کدی مانند زیر در رخداد کلیک دکمه قرار دهید:
 

با اجرای برنامه، خواهید دید که بعد از زدن دکمه ی افزودن عکس و انتخاب یک تصویر از روی کامپیوتر خود، عکس درون کنترل نمایش داده می شود. حال در قسمت دوم می خواهیم عکس را پس از انتخاب به 16 قسمت مساوی تقسیم کنیم یعنی با زدن دکمه عکس ما در ابتدا به 16 قسمت تقسیم شود و در نهایت به صورت رندوم بر روی 16 کنترل از نوع Picture Box یا label یا panel و ... نمایش داده شود.  پس بایست مانند شکل زیر 15 کنترلر از جنس مورد نظر روی صفحه قرار دهیم،

 گرچه می توان این کار را با انتخاب کنترلر و انداختن آن روی صفحه انجام داد، اما از آنجایی که می خواهیم در کد از 15 کنترلر خود مانند یک آرایه استفاده کنیم، بهتر است یکراست آرایه ای از PictureBox در خود کد ایجاد و مکان آنها را مقداردهی کنیم:

اندازه عکس را فعلا ثابت 240*240 در نظر می گیریم و اندازه 16 کنترل را 60*60 قرار می دهیم و جهت تقسیم عکس تابعی می نویسیم که یک مربع 60*60 را از ابتدا پیکسل پیکسل با استفاده از دستور getpixel بخواند و سپس در یک آبجکت از نوع bitmap پیکسل به پیکسل  setpixel کند:

و برای راحت تر شدن کار با این مجموعه بیت مپ و نگهداری آن آنها را داخل یک ArrayList قرار می دهیم برای راحتی برنامه یک تابع به صورت زیر می نویسیم.

ArrayList:
یک لیست آرایه ای بسیار مشابه با یک آرایه است با این تفاوت که دارای توانایی تغییر سایز است. ArrayList ها فضای کافی را برای ذخیره سازی تعداد معینی از ارجاعات به اشیاء به ما می دهند و می توانیم به راحتی به وسیله ی آنها اشیاء را دستکاری کنیم. ایده بکارگیری یک ArrayList آن است که ArrayList می تواند در صورت نیاز پویا (یعنی در زمان اجرا) رشد کند ما با استفاده از متد Add می َتوانیم عناصر از آبجکت را به داخل ArrayList اضافه کنیم.
حال باید تابعی بنویسیم که مقادیر آبجکت های داخل این ArrayList را به صورت رندوم در Background پنل یا هر کنترلی که شما می خواهید قرار دهد، با استفاده از این تابع یک آرایه ی 15 تایی رندوم تولید می کنیم:

و در آخر در داخل رویداد کلید کدهای زیر را می نویسیم.
  برنامه را اجرا کنید و دکمه را کلیک کنید و یک عکس انتخاب کنید با انتخاب عکس مورد نظر قطعه های 60*60 به صورت رندوم از عکس بر روی پنل ها قرار می َگیرد. در جلسه ی آینده با نحوه ی زمان بندی و سرهم کردن پازل آشنا خواهیم شد.

آموزش برنامه نویسی# C، جلسه اول
آموزش برنامه نویسی# C، جلسه دوم
آموزش برنامه نویسی# C، جلسه سوم
آموزش برنامه نویسی# C، جلسه چهارم
آموزش برنامه نویسی# C، جلسه پنجم
آموزش برنامه نویسی# C، جلسه ششم
آموزش برنامه نویسی# C، جلسه هفتم
آموزش برنامه نویسی# C، جلسه هشتم 
 

بخش پژوهش های دانش آموزی تبیان، تهیه: محسن نصرتی

تنظیم: نسرین صادقی