ساخت بازی پینگ پونگ دو بعدی با یونیتی

اسفند 16, 1397     افسانه کریمی    

ساخت بازی پینگ پونگ دو بعدی با یونیتی

اموزش بازی سازی : ساخت بازی پینگ پونگ دو بعدی

تو این مقاله سعی داریم بازی ساده پینگ پونگ دو بعدی رو با استفاده از موتور بازی سازی یونیتی بسازیم . همه ی مباحث قدم به قدم و از ابتدا توضیح داده میشه بنابراین برای هر سطحی قابل فهمه .

بازی که قراره بسازیم این شکلیه :

ساخت بازی پونگ دو بعدی

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

قواعد بازی

  • اولین بازیکنی که توپ رو به دیوار حریفش بزنه برندست.
  • اگرتوپ به بالا و پایین صفحه نمایش برخورد کرد برمیگرده .
  • هربازیکن یک تخته داره که میتونه به بالا و پایین حرکتش بده و بوسیله اون به توپ ضربه بزنه . تخته ها روی زاویه خروجی توپ تاثیر دارن بطوری که :
    • اگرتوپ به گوشه بالایی تخته برخورد کرد ، به سمت بالا برمیگرده.
    • اگر توپ به وسط تخته برخورد کرد ، مستقیم برمیگرده.
    • اگرتوپ به پایین تخته برخورد کرد ، به سمت پایین برمیگرده.

درباره موتور یونیتی

همونطور که تو مقاله های قبلی درباره یونیتی صحبت کردیم ، مهمترین ویژگی یونیتی سادگی بیش از حدشه .

اساسا در یونیتی ، ما کارهایی رو پیوسته انجام میدیم :

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

اولین پروژه یونیتی خودمون بصورت زیر میسازیم :

ساخت پروژه در یونیتی

همونطور که میبینید پروژه روبصورت 2D انتخاب میکنیم . این کار باعث میشه دوربین به تصاویر از چشم انداز دوبعدی نگاه کنه . همچنین به یونیتی اعلام میکنه عکس هارو بجای Texture ، Sprite در نظر بگیره که این کار خیلی به ما کمک میکنه .

محیط یونیتی

صفحه اصلی که باهاش مواجه میشیم به این صورت هستش :

محیط یونیتی

سلسله مراتب  (Hierarchy )

در قسمت سمت چپ میتونید پنل هایراکی رو ببینید که شامل لیستی از اشیا بازیمونه . همونطور که میبینین، در حال حاضر فقط دوربین ( Main Camera )  تو صفحه هست که بصورت پیش فرض یونیتی اضافه میکنه .

منطقه پروژه ( Project Area )

این بخش شامل همه اَسِت ها ( Assets ) مثل مدل های سه بعدی ، تکها ( Textures ) و متن هاست . برای استفاده از این عناصر خیلی راحت میتونید اون هارو تو بازی یا هایراکی بکشید .

صحنه بازی ( Scene )

دنیای بازی از این پنل قابل روئیته . با دابل کلیک کردن روی هر عنصر داخل هایراکی ، توی صحنه نشون داده میشه . حرکت کردن داخل صحنه  با راست کلیک کردن و حرکت کردن به چپ و راست انجام میشه.

اینسپکتور ( Inspector )

تو این قسمت ویژگی های شی (یا اشیا)  فعلی بازیتونو نمایش میده . به عنوان مثال اگر دوربین رو انتخاب کنیم میتونیم موقعیتش ، زاویه ، اسمش  بقیه ویژگی های مرتبطش رو ببینیم.

یونیتی هم مثل بقیه موتور های بازی سازی بر مبنا ی اجزاست ( Component-Based )  . هر چیزی در ابتدا یک شی خالیه که چیزایی مثل موقعیت ، نور ، مدل ، تکسچر و… بهش اضافه میشه .

برای مثال دوربین شامل Transform, Camera, GUILayer, Flare Layer and Audio Listener هست . همه این اجزا داخل یک شی هستند و باهم دوربیین رو میسازن تا بتونیم محیط رو ببینیم ، صدا هارو بشنویم ، تو صفحه حرکتش بدیم و … .

حرکت کردن ، چرخش و مقیاس پذیری

ما میتونیم موقعیا اشیا رو تغییر بدیم ، اونهارو بچرخونیم ، کوچیک یا بزرگشون کنیم . همه ی اینها با کلید های زیر به آسونی قابل انجامه :

کلیدهای حرکتی یونیتی

به ترتیب از چپ به راست :

  • دکمه دست داخل صحنه جابجاتون میکنه (میانبر : Q )
  • دکمه های جهت برای جابجایی (میانبر : W )
  • دکمه دایره ای برای چرخوندن (میانبر : E )
  • دکمه بعدی برای تغیر اندازه ها ی شی/اشیا (میانبر : R ) استفاده میشه
  • دکمه Rect عموما تو محیط دو بعدی مخصوصا در رابط کاربری استفاده میشه و ترکیبی از جابجایی ، تغییر اندازه و چرخشه (میانبر : T )
  • دکمه اخری هم ترکیبی از همه کلیدهاست (میانبر : Y )
دکمه اجرای بازی

اجرا و توقف بازی در یونیتی

وقتی روی دکمه اجرا (play)  میزنین ، تو پنل بازی (game)، بازی رو از نگاه دوربین میبینید. بنابراین تو این مرحله چون هیچی نساختیم فقط صفحه ابی میبینیم . برای خارج شدن از این حالت کافیه یکبار دیگه رو دکمه اجرا کلیک کنید. ( زمانی که در حالت بازی هستین یونیتی جزصفحه بازی و صحنه رو قرمز رنگ میکنه ، چون تغییرات در این حالت ذخیره نمیشن . )

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

( فراموش نکنید که همون ابتدا محیط بازیتون رو ذخیره کنید با میانبر های Ctrl + S )

ساخت بازی

برای ساخت این بازی به دیوارها ، بازیکن ها و توپ نیاز داریم . که از *این لینک* قابل دانلوده . بعد از دانلود اونهارو داخل منطقه پروژه بکشید  ( یا در ادرس پوشه Assets در محل ساخت پروژتون کپی کنید) .

با انتخاب کردن همه عکس ها تنظیمات زیر رو روی فایل ها اعمال میکنیم :

تنظیمات است ها در یونیتی

pixel per unit رو به 1 تغییر میدیم.  یعنی هر پیکسل یک در یک در زمین بازی ما به عنوان یک واحد در نظر گرفته میشه. اگر مقدماتی هستید ممکنه این تنظیمات براتون یکم گیج کننده باشه. اگرچه که میشه بدون اعمال این تغییرات هم بازی رو ساخت اما بهتره در حالت دو بعدی این کارهارو انجام بدین تا اندازه دنیای بازیتون منطقی باشه .

 تنظیمات دوربین

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

تنظیمات دوربین در بازی پونگ

ساخت دیوار ها

از تکسچرWallVertical و WallHorizontal استفاده میکنیم .تو این بازی به چهار دیوار احتیاج داریم . دو دیوار عمودی و دو افقی .

از منطقه پروژه دیوارهارو به تعداد لازم تو زمین بکشید. با استفاده از میانبر F2 نام دیوارهارو تونید تغییر بدید. و با جابجا کردنشون اونهارو در جای مناسبی قرار بدین. یا از داخل منو اینسپکتور و Position به ترتیب به دیوار های بالا ، پایین ، چپ و راست موقعیت های زیر رو بدید.در نهایت شکلی شبیه مستطیل دارید.

موقعیت دیوارها در بازی پینگ پونگ

فیزیک دیوارها

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

برای این کار کافیه که دیوارهارو انتخاب کنیم و از اینسپکتور Add Component یک Box Collider 2D بهش بدیم . میبینیم که دور دیوارهامون یک مستطیل سبز رنگ قرار گرفته . ( یکم دیدنش سخته و باید زوم کنین )

کولایدر دیوار ها در بازی

مرزبندی زمین بازی

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

(نیازی هم به انجام این کار نیست چون توپ نباید برخوردی باهاش داشته باشه.)

نمای کلی بازی تا این مرحله

ساخت بازیکن ها

ازتکسچر Player استفاده میکنیم.دو بازیکن داریم یکی سمت راست و یکی هم چپ.با کشیدن اونها رو در موقعیت مناسب قرار میدیم. بصورت زیر :

موقعیت بازیکن ها در بازی پونگ

فیزیک بازیکن ها

بازیکن ها باید با دیوار و توپ برخورد داشته باشن.بنابراین مثل دیوارها باید بهشون کولایدر بدیم. از طریق اینسپکتور Add Component یک Box Collider 2D بهش میدیم.

یونیتی یک سیستم فیزیک قوی داره که جاذبه ، اصطحکاک ، و بقیه نیروهارومحاسبه میکنه.همه این کار ها با اضافه کردن Rigidbody 2D انجام میشه.درست مثل کولایدر از طریق اینسپکتور،Add Component/Rigidbody 2D به هر بازیکن اضافه میکنیم.  چون بازیکنای ما فقط تو فضا معلقن و بالا پایین میرن پس نیازی به جاذبه ندارن.gravity رو صفر میکنیم .

در نهایت اینسپکتورمون اینجوری میشه :

اینسپکتور بازیکن ها

حرکت بازیکنان

برای حرکت بازیکنان به کدنویسی احتیاج داریم.  Add Component / New Script را انتخاب و اسم مناسب رو براشون بذارین . بعد از ایجاد بصورت زیروارد محیط برنامه نویسی بشید :

اگر از JetBrains Rider استفاده میکنید.  با همچین صفحه ای مواجه میشید :

کدنویسی در محیط jetbrains

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

تابع Start هنگام شروع بازی توسط خود یونیتی و Update هم در هر فرم یکبار(حدودا بیش از 60 باردر ثانیه ) فراخوانی میشه.

یک تابع بروزرسانی دیگه هم وجود داره بنام FixedUpdate که در فاصله زمانی های مشخصی فراخوانی میشه. فیزیک یونیتی هم در همین فاصله زمانی محاسبه مبشه . بنابراین معمولا هرجا rigidbody داریم ازاین تابع استفاده میکنیم.

پس در نهایت داریم :

برای حرکت دادن بازیکن ها از Velocity که ازامکانات Rigidbody هست استفاده میکنیم.بنابراین در لحظه شی درجهت مورد نظر حرکت میکنه . در بردار های دوبعدی حرکت های موجود به این صورته (جهت z بی تاثیر هست):

جهت حرکت در محیط دو بعدی

تو بازی ما اگر کاربر دکمه بالا را فشار دهد مقدار y = 1 و اگر پایین بود y=-1 میشه. بنابراین X کاربردی نداره.

دوکاربر داریم که برای ورودی گرفتن ازشون با کلاس Input و تابع GetKey کلید رومشخص میکنیم . مثلا برای کاربر سمت راست داریم : ( برای کاربر سمت چپ هم با کلیدهای دلخواه تعریف کنید .)

حالا باید متناسب با ورودی کاربر بازیکن رو حرکت بدیم . برای این کار اول باید  به rigidbody ارجاع بدیم . و در اخرمقدار Velocityرو در جهت مورد نظرمون ضربدر متغیرSpeed میکنیم . که دقیقا تعریف velocity هست .

خب اگرکدهاتون درست باشه با همچین چیزی مواجه میشین :

حرکت بازیکنان

ساخت توپ

خب مثه قبل تکسچر توپ رو به بازیمون اضافه میکنیم ودر مکان دلخواه میکشیم . از طریق اینسپکتور / Add Component یک Box Collider 2D بهش میدیم.

فیزیک توپ

توپ باید با دیوار های بالا صفحه برخورد کنه وبرگشت پیدا کنه .مثلا اگر تو با زاویه 45 درجه در حال حرکت به سمت بالاست بعد از برخورد با دیوار باید -45 به سمت پایین حرکت کنه . به نظر میرسه کار پیجیده ای هست و کلی کدنویسی میخواد . ولی تو یونیتی فقط کافیه یک Physics Material بسازید و به توپتون بدین . از طریق Assets > Create > Physics Material 2D ایجاد کنید .

Friction ضریب اصطحکاک و Bounciness پرشش رو مشخص میکنه . در این حالت فقط توپ بعد برخورد برمیگرده بنابراین :

متریال توپ

قراره توپمون تو زمین حرکت کنه بنابراین به rigidbody نیاز داریم . مثه مرحله قبل از طریق Add Component /Rigidbody 2D اضافه کنید.چندتا کار لازمه تا انجام بدیم :

  • توپ نباید تحت تاثیر جاذبه باشه. پس gravity صفر میکنیم.
  • جرم جسم باید خیلی کم باشه تا زمانی که به بازیکن ها برخورد میکنه اونهارو جابجا نکنه. بنابراین در کمترین حالت ممکن یعنی 0.0001 قرار میدیم .
  • توپ نباید دور خودش بچرخه . بنابراین چرخش حول محور Z رو غیرفعال میکنیم .
  • برای اینکه فیزیک دقیقتری داشته باشیم از تشخیص پی در پی برخورد ها استفاده میکنیم . به عبارتی collision  detection  رو continuous میذاریم .

در نهایت باید همچین چیزی داشته باشیم :

اینسپکتور توپ در یونیتی

کدنویسی توپ

میرسیم به بخش آخر یعنی کدنویسی توپ . از طریق Add Component / New Script یک متن جدید میسازیم و بازش میکنیم .  برای توپ به تابع Update احتیاجی نداریم چون همون اول به توپ یک نیرویی میدیم .

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

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

تابعی به نام OnCollisionEnter2 داریم که زمان برخورد جسم با بقیه اشیا ی دارای کولایدر فراخوانی میشه . اتفاقایی که تو زمان برخورد رخ میده رو داخل این تابع مینویسیم. همونطور که قبلا نشون دادیم حرکت های مجاز تو حالت دوبعدی بصورت زیر هست:
جهت حرکت در محیط دو بعدی
مقدار x که مشخصه ، اگر به بازیکن سمت راست بخوره -1 و اگر به سمت چپ برخورد کنه 1میشه. چیزی که ما باید محاسبه کنیم مقدارy که عددی بین -1 و 1 هست .
اگر به بالای بازیکن برخورد کنه 1 میشه ، وسط 0 و پایین -1 میشه . بنابراین میتونیم با تقسیم کردن موقعیت y توپ، بر ارتفاع بازیکن بفهمیم به کجا برخورد کرده.

در نهایت با اجرای بازی نسخه ساده ای از بازی پینگ پونگ رو مشاهده میکنید .

خلاصه :

تو این اموزش ما یادگرفتیم که یک پروژه یونیتی بسازیم . با محیط یونیتی  و فیزیکش کار کردیم .در نهایت با کدنویسی بازیمونو به حرکت در اوردیم. هنگام ارتقا بیشتر بازی در نظر داشته باشید که یونیتی خیلی سادست . تقریبا هرکاری رو میشه با  چند کلیک وچند خط کدنویسی انجام داد.

تومقاله بعدی *لینک* با UI در یونیتی کار میکنیم و بازی رو ارتقا میدیم . بنابراین با ما همراه باشین .

دسته‌بندی‌ : بازی سازی

2 thoughts on “ساخت بازی پینگ پونگ دو بعدی با یونیتی”

  1. محمد

    سلام من در قسمت کد بازیکن گیر کردم همش بهم ارور میده
    Severity Code Description Project File Line
    Error CS0411 The type arguments for method ‘Component.GetComponent()’ cannot be inferred from the usage. Try specifying the type arguments explicitly. Assembly-CSharp C:\Users\RS\Documents\New Unity Project\Assets\Sunnyland\artwork\Environment\w.cs 10
    Severity Code Description Project File Line
    Error CS0111 Type ‘w’ already defines a member called ‘Start’ with the same parameter types Assembly-CSharp C:\Users\RS\Documents\New Unity Project\Assets\Sunnyland\artwork\Environment\w.cs 12

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

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

Rating*