آموزش ساخت یک اپلیکیشن آیفون (بخش اول) — به زبان ساده

۱۹۱۹ بازدید
آخرین به‌روزرسانی: ۲۸ شهریور ۱۴۰۲
زمان مطالعه: ۷ دقیقه
آموزش ساخت یک اپلیکیشن آیفون (بخش اول) — به زبان ساده

ما همه‌روزه از اپلیکیشن‌های مختلف برای غنی‌سازی جنبه‌های متفاوت زندگی خود استفاده می‌کنیم؛ اما ساخت اپلیکیشن یک چالش پرزحمت به نظر می‌رسد. در صورتی که ایده‌ای برای ساخت یک اپلیکیشن هر چند ساده داشته باشید، اگر بخواهید فردی را برای ساخت آن استخدام کنید، ممکن است هزینه‌ای هنگفت برای شما داشته باشد. در واقعیت، آغاز کار چندان هم دشوار نیست. در این سری مطالب آموزش برنامه نویسی iOS، قصد داریم نشان دهیم که می‌توانید یک اپلیکیشن آیفون را به سادگی ساخت یک لگو ایجاد کنید.

Build an App

در این نوشته قصد داریم کارهای زیر را به همراه هم انجام دهیم:

  1. کامپوننت‌های مهندسی شده واقعی را به صورت بصری ایجاد کنیم.
  2. آن‌ها را مانند لگو کنار هم سوار کنیم.
  3. اپلیکیشن خود را روی آیفون اجرا کنیم.

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

اپلیکیشن آیفون

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

  1. یک سیستم مک که قادر به اجرای جدیدترین نرم‌افزارها باشد.
  2. نرم‌افزار Xcode که با همدیگر دانلود خواهیم کرد.
  3. دانش کاربری استفاده از مک را داشته باشید، مثلاً بدانید چگونه یک اپلیکیشن را اجرا کنید، دو بار کلیک کنید، فایل‌ها را درگ نمایید، شیفت-کلیک کنید، کنترل-کلیک کنید، مطلبی را کپی کرده و بچسبانید و همچنین شیءهای مختلف را انتخاب نمایید.
  4. اشتیاق به ساخت یک اپلیکیشن در شما باشد.

نصب Xcode

قبل از هر چیز باید نرم‌افزار Xcode اپل را نصب کنید. این نرم‌افزار رایگان است.

10.1 استفاده خواهیم کرد. با این که حجم دانلود این نرم‌افزار نسبتاً بالا (6 گیگابایت) است؛ اما از آنجا که شامل همه چیزهایی است که برای ساخت یک اپلیکیشن آیفون، آی‌پد، مک و اپل‌تی‌وی مورد نیاز هستند، چنین حجم سنگینی قابل تصور است. روی سیستم مک خود، App Store را باز کرده و به دنبال Xcode بگردید. آن را دانلود و نصب کنید.

 اپلیکیشن آیفون

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

پس از پایان دانلود، در ادامه نرم‌افزار Xcode را باز کنید. زمانی که برای نخستین بار آن را باز می‌کنید، از شما می‌خواهد اجازه نصب برخی اجزای دیگر را بدهید. این اجازه را بدهید و زمانی که آماده شد با پنجره خوشامدگویی Xcode مواجه می‌شوید.

اپلیکیشن آیفون

ایجاد یک پروژه جدید اپلیکیشن آیفون

اینک ما آماده هستیم که اپلیکیشن خود را بسازیم. به این منظور روی گزینه Create a new Xcode project کلیک کنید.

Xcode چندین قالب را نمایش می‌دهد. گزینه iOS را انتخاب کرده و سپس روی Tabbed App کلیک کنید. مطمئن شوید که iOS را انتخاب کرده‌اید، چون در غیر این صورت Xcode کامپوننت‌های صحیح که برای این راهنما مورد نیاز هستند را به شما نمایش نخواهد داد.

اپلیکیشن آیفون

روی دکمه Next کلیک کنید. Xcode پیام زیر را به شما نشان داده و می‌خواهد که گزینه‌های مربوط به پروژه جدید را انتخاب کنید:

Choose options for your new project

Xcode

ما قصد داریم اپلیکیشن خود را «Social» بنامیم. مقداری که دوست دارید را برای فیلد «نام سازمان» (Organization Name) وارد کنید. در مورد Organization Identifier از معکوس نام دامنه که برای سازمان خود وارد کردید استفاده کنید. برای نمونه اگر نام سازمان شما mycompany.com.au بوده است، برای شناسه از au.com.mycompany استفاده کنید. اگر نام دامنه ندارید می‌توانید هر مقداری که دوست دارید وارد کنید. شما می‌توانید در ادامه این مقدار را تغییر دهید؛ اما نباید آن را در این مرحله خالی بگذارید.

اطمینان پیدا کنید که:

  • Language به صورت Swift تنظیم شده است.
  • Include Unit Tests غیرفعال است یعنی تیکی در کادر انتخاب وجود ندارد.
  • Include UI Tests غیرفعال است.

روی دکمه Next کلیک کنید.

Xcode از شما می‌خواهد که پروژه جدید خود را ذخیره کنید. گزینه Create Git repository را روشن کنید. در ادامه به بررسی Git می‌پردازیم.

Xcode

پروژه جدید خود را در پوشه Documents یا هر جای دیگری که دوست دارید ذخیره کنید. سپس روی دکمه Create کلیک کنید تا ذخیره شود. Xcode پوشه‌ای (با همان نام انتخابی برای نام محصول) می‌سازد که شامل همه فایل‌های مورد نیاز برای ساخت اپلیکیشن است. اکنون اگر به Finder نگاه کنید، مانند تصویر زیر است:

Xcode

تبریک می‌گوییم، شما اینک اولین اپلیکیشن بومی iOS خود را ایجاد کرده‌اید.

تنظیمات Xcode

Xcode اینک پروژه شما را به همراه هزاران گزینه ممکن که احتمالاً موجب سردرگمی شما خواهد شد نمایش می‌دهد. اما جای نگرانی نیست، چون شما می‌توانید تقریباً همه آن‌ها را نادیده بگیرید.

Xcode

در ادامه می‌خواهیم ببینیم که آیا می‌توانیم اپلیکیشن را اجرا کنیم یا نه. روی دکمه Build and Run کلیک کنید. این دکمه شبیه به دکمه Play است و در سمت چپ و بالای پنجره قرار دارد.

Xcode

اینک باید صبور باشید چون ممکن است چند دقیقه طول بکشد تا Xocde اقدام به ساخت و اجرای اپلیکیشن بکند. Xcode یک اپلیکیشن جدید مک به نام «Simulator» را در پنجره‌ای که شبیه به آیفون است، باز می‌کند. این یک آیفون XR شبیه‌سازی‌شده است و می‌توانید نوع گوشی را با دکمه کنار Build and Run انتخاب کنید.

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

اپلیکیشن آیفون

به این ترتیب با موفقیت اپلیکیشن را ساخته و اجرا کرده‌ایم. این یک پروتوتایپ ساختگی نیست؛ بلکه یک اپلیکیشن بومی واقعی محسوب می‌شود. شما می‌توانید این اپلیکیشن را روی App Store توزیع کنید. البته اگر در جهت انتشار این اپلیکیشن تلاش بکنید؛ اپل آن را رد خواهد کرد، چون در حال حاضر هیچ کار مفیدی انجام نمی‌دهد.

پنل‌های Xcode

اینک به Xcode بازمی‌گردیم. همانند هر پنجره دیگری روی مک می‌توان پنجره Xcode را نیز بزرگ‌تر کرده یا به حالت تمام صفحه برد. پنجره Xcode به چندین پنل تقسیم می‌شود. در ادامه برخی نکات در مورد روش کار با اجزای مختلف، و نمایش یا پنهان‌سازی پنل‌ها ارائه می‌کنیم. لازم نیست فعلاً در مورد محتوا یا منظور این پنل‌ها نگران باشید. ما بعدتر به بررسی آن‌ها خواهیم پرداخت.

پنل چپ «Navigator» نام دارد و در حال حاضر «Project Navigator» را نمایش می‌دهد که شامل فهرستی از فایل‌های پروژه است. پنل سمت راست نیز «Inspector» نام دارد. به پنل Project Navigator در سمت چپ نگاه کنید. یک بار روی فایل Main.storyboard کلیک کنید. اگر روی آن دو بار کلیک کنید، یک پنجره جدید باز می‌شود. در هر حالت می‌توانید این پنجره را به سادگی ببندید.

Xcode

در پنل مرکزی (canvas)، می‌توانید گردش کار و طرح‌بندی اپلیکیشن را ببینید. در مورد گردش کار و ساختار پروژه کمی بعدتر توضیح خواهیم داد.

Xcode

روی صفحه‌های کوچک‌تر و به طور خاص صفحه لپ‌تاپ، ممکن است به فضای بیشتری برای canvas نیاز داشته باشید. خوشبختانه می‌توانید پنل‌های سمت راست و چپ را با استفاده از دکمه‌های Show/Hide Navigators and Inspectors در سمت راست و بالای پنجره نمایش داده یا پنهان کنید.

روی دکمه‌ها کلیک کنید تا با روش نمایش/پنهان‌سازی پنل‌های Navigator و Inspector آشنا شوید.

Xcode

شما می‌توانید با اسکرول کردن به صورت افقی و عمودی با استفاده از ترک‌پد لپ‌تاپ یا ماوس در روی canvas به اطراف حرکت کنید. شما می‌توانید روی دکمه + و - در انتهای پنجره کلیک کنید:

Xcode

در کنار پنل Navigator در سمت چپ می‌توان یک پنل دیگر به نام Document Outline دید که شامل فهرستی از صحنه‌ها یا «scenes» است. همچنین می‌توان پنل Document Outline را با استفاده از دکمه‌ای که در زیر آن قرار دارد پنهان کرد.

Xcode

ویرایش متن

شما می‌توانید آیتم‌های موجود روی canvas را ویرایش کنید. کافی است روی برچسب متنی First View دو بار کلیک کنید تا متن داخل آن انتخاب شود:

Xcode

سپس می‌توانید برچسب متنی مورد نظر خود را برای این صحنه به صورت News وارد کنید.

Xcode

با زدن دکمه Return روی کیبورد یا با کلیک در خارج از canvas، تغییراتی که روی آن ایجاد کرده‌اید ذخیره می‌شوند. دقت کنید که نوار برگه (tab bar) در انتهای صفحه در حال حاضر دارای عنوانی به صورت First است و تلاش می‌کنیم آن را نیز تغییر دهیم. در ادامه روی عنوان First دو بار کلیک کنید. ممکن است برای انتخاب صحیح آن نیاز به بزرگنمایی داشته باشید.

اگر روی عنوان دو بار کلیک کنید، به صورت خالی در می‌آید. سپس گزینه Undo را از منوی Edit انتخاب کنید. به نظر می‌رسد این وضعیت یک باگ در Xcode است که امیدواریم اپل آن را به زودی رفع کند.

Xcode

عنوان این نوار برگه را به News تغییر دهید. همچنین با زدن دکمه Return آن را ذخیره کنید.

Xcode

اپلیکیشن را یک بار دیگر با کلیک کردن روی دکمه Build and Run در سمت بالا-چپ پنجره Xcode اجرا کنید. اگر اپلیکیشن از قبل در حال اجرا باشد، Xcode از شما می‌پرسد که آیا می‌خواهید نسخه کنونی متوقف شود و نسخه جدید اجرا شود؟

Xcode

روی Stop کلیک کنید تا اپلیکیشن جدید اجرا شود. اپلیکیشن اینک باید برچسب News را در عنوان آیتم نوار برگه نمایش دهد.

Xcode

کامیت کردن تغییرات

اینک به Xcode بازگردید. Xcode در حال حاضر تغییرات ما را ذخیره کرده است و از این رو می‌توانیم از آن خارج شویم. زمانی که دوباره آن را اجرا کنیم، کار خود را از جایی که باقی مانده بود ادامه خواهیم داد. با این وجود در این مسیر، تغییرات زیادی ایجاد می‌کنیم و ممکن است مجبور شویم ایده‌های متفاوتی را آزمایش کنیم یا بارها به نسخه‌های قبلی که روزها پیش ساخته‌ایم، بازگردیم. برای این که بتوانیم نسخه‌های خاصی را به عنوان نسخه‌های شاخص ذخیره کنیم، می‌توانیم از یک «سیستم کنترل نسخه» به نام Git استفاده کنیم. Git به طور گسترده‌ای در همه نظام‌های برنامه‌نویسی و همچنین کنترل اسناد به طور کلی مورد استفاده قرار می‌گیرد. Xcode چندین آیتم منو ارائه می‌کند که امکان دسترسی آسان به برخی دستورهای Git را فراهم ساخته است.

در این مرحله تغییراتی که تا این جا ایجاد کرده‌ایم را با یک توضیح کوتاه از موارد تغییر یافته «کامیت» (Commit) می‌کنیم. در ادامه می‌توانیم این کامیت را در سابقه توسعه اپلیکیشن خود ببینیم و در صورت نیاز کارهای خود را به این کامیت «بازگردانی» (Revert) بکنیم.

در Xcode و در منوی Source Control، در نوار منو در بالاترین بخش صفحه، گزینه Commit را انتخاب کنید.

Xcode

Xcode فایل‌هایی را که تغییر داده‌اید به شما نشان می‌دهد. در این مورد، ما تنها Main.storyboard را تغییر داده‌ایم. در انتهای پنجره، کرسر در حال چشمک زدن است تا توضیحی در مورد تغییرات خود وارد کنید. مثلاً بنویسید: Changed First to News.

Xcode

روی دکمه Commit بزنید.

جمع‌بندی

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

  1. مجموعه ابزار توسعه‌دهنده آیفون اپل به نام Xcode را نصب کردیم.
  2. یک اپلیکیشن iOS بومی ساختیم.
  3. اندکی تغییر در آن ایجاد کردیم.
  4. اپلیکیشن را روی شبیه‌ساز آیفون اجرا کردیم.
  5. تغییرات کامیت شده را از طریق کنترل نسخه Git کامیت کردیم.

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

اگر این نوشته برای شما مفید بوده است، آموزش‌های زیر به شما پیشنهاد می‌شوند:

==

بر اساس رای ۱۶ نفر
آیا این مطلب برای شما مفید بود؟
اگر بازخوردی درباره این مطلب دارید یا پرسشی دارید که بدون پاسخ مانده است، آن را از طریق بخش نظرات مطرح کنید.
منابع:
build-an-app-like-lego
نظر شما چیست؟

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