آموزش سوئیفت swift قسمت هشتم

مقدمه و معرفی :

سلام در این جلسه ساخت ماشین حساب رو ادامه میدیم. تو جلسه پیش ui یا ظاهر برنامه رو تکمیل کردیم!  و فهمیدیم که چجوری میتونیم button ها یا textfield اضافه کنیم تغییر رنگ بدیمشون و…

تو این جلسه ارتباط دکمه ها و المان های برنامه رو با برنامه یاد میگیرین.

نمایی از ظاهر ماشین حساب

تصویر ۱: این ظاهر ماشین حسابمون بود! طبق عکس روی اون مربع قرمز رنگ کلیک کنید

بخش viewcontroller.swift

 بعد از اینکه  روی assistant editor کلیک کردید viewcontroller.swift باز میشه. (کادر قرمز رنگ )

بخش assistant editor

حالا کافیه که روی یکی از دکمه هایی که شامل اعداد ۰-۹ هست کلیک  کنید (فرقی نداره کدوم button  ولی هر کدوم رو که انتخاب کنید یادتون باشه مراحل بعدی رو نیازی  نیست روش اعمال کنید! من از همون button شماره ۰ شروع می کنم.) بعد دکمه control رو از روی کیبورد نگه دارید و دوباره روی اون button کلیک کنید! ( متاسفانه این مرحله توی عکس قابل نمایش نیست! ولی بعد از این کار یک خط ابی رنگ ظاهر میشه) به سورس برنامه هدایت میکنیم و داخل سورس موس رو رها می کنید ( متاسفانه قابل نمایش نیست که بهتر درک کنید گفته هام رو )

devider

بخش های مختلف assistant editor

بعد از مرحله قبل باید مشخص کنید که این دکمه چه کاری میخواد انجام بده !

خب طبق این عکس عمل کنید: در مربع کوچیکی که ایجاد میشه connection: رو به actionتغییر  بدین چون این دکمه ها کاری رو میخوان برای برنامه انجام بدن ! وname هم یک نامی برای دکمه ها بگذارید! و type شون هم UIButton هست! بعد از اینکه این تغییرات رو اعمال کردید روی connect کلیک کنید.

تغییر نوع کانکشن به اکشن

خب مرحله قبل برای شناسایی دکمه ها و تعریف یک action در برنامه بود ! و فقط هم من برای دکه ۰ این کار رو انجام دادم! بقیه دکمه ها چی؟!! باید بقیه دکمه ها هم در برنامه شناسایی بشن دکمه های ۱-۹

برای دکمه های ۱-۹ طبق این دستور العمل کار می کنیم.

رو هر دکمه یه بار کلیک می کنید دکمه control رو روی کیبورد نگه دارید و دو باره روی دکمه ها کلیک کنید ایندفعه هم همون خط ابی نمایان میشه ! ولی با این تفاوت که مسیر این دکمه ها با دکمه ۰ فرق میکنه ! طبق عکس ایندفعه برای تمام button های ۱-۹ مسیر به طرف view control scene هست!(میدونم توضیح جالبی نبود  :)) ) طبق عکس عمل کنید مسیر فلش رو دنبال کنید و موس رو روی view controllerرها کنید!

انتخاب اکشن buttonNum

بعد از مرحله قبلی این باکس کنار view controller ظاهر میشه ! توجه کنید action ای که ایجاد کردیم اسمش موجوده ! تو کادر  قرمز! برای تمام دکمه های ۱-۹ که طبق روش قبل عمل کردین این اکشن رو انتخاب کنید ( buttonNum این نام اکشنمون هست که من به این نام گذاشتم شما  هر نامی رو که برای اکشن قرار دادین اینجا میبینید)

توجه توجه! هر باری که روی یه دکمه طبق مرحله ۵ عمل کردین بعدش مرحله ۶ هست ! یعنی چی یعنی برای مثال دکمه ۱ رو که مرحله ۵ رو انجام دادین بعدش مرحله ۶ هست که نوع اکشن رو انتخاب می کنید! و بعد سراغ دکمه ۲ میرین !

پنل view controller

devider

حالا که تمام اعداد رو به اکشن مد نظر وصل کردین ! میریم سراغ عملگر ها ! عملگر ها هم مثل دکمه ها باید یه اکشن براش تعریف کنید و مراحل قبل رو جدا گونه اعمال کنید! طبق عکس روی عملگر تقسیم کلیک کنید و بعد هم controlرو نگه دارین و روباره کلیک کنید روش و طبق عکس به داخل viewcontroller.swift هدایت کنید.

مراحل برقراری connection

توی این عکس هم مثل مراحل قبل باید طبق شکل اعمال کنید connection از نوع action و نامی براش انتخاب کنید نوعش هم UIButton سپس connectرو بزنید.

نمای view controllerscene

 بقیه عملگر ها هم باید به اکشن ایجاد شده متصل بشن ! پس روی عملگر های دیگه کلیک کنید command رو نگه دارید و مسیر این بار به سمت view controller scene هست و خط ابی ( که قبل هم گفتم ولی تو عکس مشخص نیست ) دقیقا رو view controller که ایکون زرد داره رها می کنید.

انتخاب اکشن buttonOp

خب اگر تو این عکس دقت کنید می بینید که اکشن هایی ک ایجاد می کنیم رو لیست ممیکنه پس تو انتخاب اکشن مد نظرتون دقت کنی!

اکشنی که برای عملگر ها مد نظرمون هست طبق شکل ! من buttonOp نامگذاری کردم ! پس برای تمام عملگر ها باید این اکشن رو انتخاب کنید.

تعریف اکشن برای دکمه clear

تصویر 11

تصویر ۱۱:

دکمه ی clear داریم داخل این ماشین حساب ! برای این button هم باید یه اکشنی تعریف کنیم

طبق عکس روی کلی c یا clear کلیک کنید و بعد هم control و دوباره کلیک تا همون خط ابی ای که اخرش شما ندیدیدش! ظاهر بشه و داخل سورس برنامه رها می کنیم دقیق زیر  اکشن های اعداد و عملگر ها! بق عکس ۱۲ میشه ! لیست اکشن ها به این صورت زیر هست.

لیست تمام اکشن ها

بخش Text field

نوبت به text field برنامه میرسه ! این المان فقط خروجی رو قراره نشون بده! کار خاصی نمیخواد انجام بده ! پس کافیه که به عنوان یه المانی که در ui وجود داره در برنامه تعریفش کنیم. طبق شکل اول روی text field کلیک کنید بهد باز هم control و هدایتش میکنیم به داخل سورس و همون خط ابی خیلی ظاهر میشه و رهاش میکنید داخل سورس

گفتم که text field کار خاصی نمیخواد انجام بده  پس connection اون همون پیش فرضی که ظاهر میشه هست یعنی outlet که به این معنی هست که ایم تکس فیلد با اون نامی که براش تعیین کردیم در  برنامه میتونه کانکت باشه و جر المان های برنامه هست به طور ساده میشه این طور تعریفش کرد.

ونام resultرو براش انتخاب کردم ! type هم UITextField هست.

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

 

برای درج نظر و یا طرح سوالات خود لطفا در سایت ثبت نام کنید و یا وارد سایت شوید

نظرات کاربران

برای این مطلب تاکنون نظری ارسال نشده است. شما اولین نفر باشید