آموزش برنامه نویسی اندروید قسمت دوم
با سلام خدمت شما علاقه مندان به آموزش برنامه نویسی اندروید. جلسه قبل یک سری مفاهیم کلی در برنامه نویسی اندروید را خدمت شما عرض کردم اما به برنامه نویسی نپرداختیم. اگر مفهمومی ر1و متوجه نشدیدنگران نباشید چون قرار بر این است تا مفاهیم را خیلی بنیادی تر پیش ببریم. شروع برنامه نویسی و یادگیری برنامه نویسی با اندروید نسبت به دیگر زبان های برنامه نویسی کمی پیچیده تر است اما سعی بر آن است تا مفاهیم ساده عنوان شود تا مشکلی در یادگیری برای شما ایجاد نشود. و در ادامه و بعد از چندین جلسه آموزش را به صورت پروژه محور پیش خواهیم برد.
شروع کار و تعریف پروژه در intellij
طبق جلسه قبل محیط intellij را باز میکنیم. دوستانی که جلسه قبل را دنبال کردند دیگر نیازی نیست مسیر sdk یا jdk بدید. درضمن اگر با باز کردن intellij برنامه جلسه قبل باز شد از نوار بالا روی File برید و سپس new project را بزنید.
خب در صفحه مربوط به انتخاب نام پروژه طبق زیر مقدار بدید:
در صفحه بعد نوبت به انتخاب مسیر sdk و jdk است که همانطور که گفتم دوستانی که دفعه اول است که برنامه را باز می کنند باید طبق دستور جلسه قبل مسیر را وارد کنند.
بعد نوبت به انتخاب روش خروجی گرفتن از پروژه میرسد. اینبار قصد دارم روی تلفن هوشمند خودتان نرم افزار را تست کنیم.
برای تست روی گوشی خودتان باید قابلیت usb debugging را فعال کنید. گوشی را با کابل به کامپیوترتان وصل کنید و طبق دستورات page زیر این قابلیت را فعال کنید:
http://wmobile.ir/active-usb-debugging-all-version-android/
خب بعد از فعالسازی گوشیتان در صفحه ای که بودیم target device را روی usb device قرار دهید.
سپس finish را بزنید و صبر کنید پروژتان ساخته شود. کمی طول میکشد.
پس از باز شدن پروژه به صفحه design برنامه بروید. اگر به خاطر داشته باشید فایلی بود از نوع xml.که برای پیدا کردن آن باید از منوی سمت چپ ابتدا وارد پوشه ی res و سپش layout شوید و حالا main.xml را انتخاب کنید
اندفعه میخواهیم بیشتر با اینجا آشنا بشویم. بطور خودکاریک TextView روی صفحه موبایل ساخته شده و داخل آن نوشت شده "Hello World"
پس فهمیدیم ابزاری که در آن متن مینویسیم اسمش TextView می باشد.
حال بهتر است روی گوشی خود تست کنیم. برای اینکار از نوار بالا سمت راست یک علامت Run که یک آیکون Play سبز رنگ است را بزنید.
صبر کنید تا صفحه زیر ظاهر شود...
وقتی این نوار پایین آمد و مدل گوشی سمت چپش نوشته شده یعنی برنامه روی گوشیتان run شده است و بصورت اتوماتیک روی گوشی بالا ظاهر میشود. اگر ظاهر نشد وارد munu شوید و آنرا جستجو کنید. احتمالا اخر منو یافت میشود.
حالا میتوانید داخل گوشیتان همین main.xml را ببینید.
اولین اجرای نرم افزار اندرویدی... تبریک میگم
تغییر برنامه در INTELLIJ
این بخش android ddms که زیر صفحه کد باز شده است را ببندید. برای اینکار آیکن "پیکان جهت پایین" سمت راست صفحه را بزنید تا بسته شود. حال طراحی صفحه را شروع می کنیم.
طراحی صفحه در intellij
کاری که قصد داریم انجام دهیماین است که چگونه یک پیام را به کاربر نشان دهیم.
حتما پیامهایی که گوشی میدهد را گاها دیده اید. یک کادر با حاشیه طوسی رنگ است که مثلا در قسمت مدیریت فایلها یک فایلی را کپی می کنید پیامی با متن copy successfully ظاهر می شود
به این پیامها میگوییم Toast. اما قبل از ادامه کار باید با چند مفهوم اصلی آشنا بشویم.
اول از همه بپردازیم به یک مفهوم مهم. جاوا یک زبان شی گرا است. اما شی گرایی چیست؟ قبل از پاسخ دادن به این باید یک مفهوم اساسی تر را بدانید.
کلاس چیست؟!
کلاس ویژگی اصلی برنامه نویسی شی گرا است و چهارچوبی برای "شی" یا object می باشد.
مثلا یک مثال خوب انسان است. انسان یک کلاس هست. یعنی یک مفهوم کلی از یک موجود زنده است. میتواند صفت داشته باشد، رنگ پوست و رنگ مو و....
اما درست است که بگوییم رنگ موی انسان مشکی است؟ خب مسلما این جمله غلط هست. باید بگویید مثلا آقای X که یک نمونه از انسان است دارای موهای مشکی است که با این کار من یک نمونه از کلاس انسان گرفتم. و آقای x را شی میگوییم .
پس تا اینجا فهمیدیم شی یک نمونه ی مقدار دهی شده از کلاس است و زبانی که این قدرت را دارد میگوییم زبان شی گرا.
حالا برای این شی ما (آقای x ) ممکن است یک اتفاقی بیفتد. مثلا مریض شدن، آمدن، رفتن. به این کارهایی که ممکن هست بارها از آنها استفاده شود یک رویداد یا متد میگوییم.
یک مثال دیگر برای متد (یا گاها میشود گفت تابع) این است که فکر کنید یک عمل ریاضی را قرار است بارها در برنامه انجام بدهیم. مثلا برای محاسبه سینوس یک سری فرمول نوشتیم. و قرار است در کدها بارها از این سینوس استفاده کنیم اما برای زاویه های مختلف... سینوس30.... سینوس60
به این تکه کدی که نوشتیم (یعنی همان فرمول) میگویم متد(تابع) و به زاویه ای که بهش میدهیم ورودی تابع می گوییم. در نهایت حاصل سینوس مثلا 30 که به ما برگردانده میشود را میگویم خروجی تابع
حالا برگردیم به اندروید....
Activity اکتیویتی چیست؟؟؟
اکتیویتی یک کلاس است. کلاسی که بنیاد همه برنامه ماست. همانطور که در جلسه قبل گفتم برای هر صفحه ای از نرم افزار ما یک activity وجود دارد. که داخلش شامل متدهای مختلف میتواند باشد و ما صفحاتمان را با این Activity ها کنترل میکنیم.
حالا Layout چیست؟
ظاهر برنامه های اندروید یا دیزاینش. مثلا تعیین کنید در یک صفحه چه دکمه هایی داریم چه رنگی هست و....
و همانطور که گفتم کنترل این ابزارها در activity ها انجام میگیرد. مثلا بگوییم اگر دکمه ok را کاربر زد یک پیام بهش نشان بده.
حالا میتوانیم به ادامه کد خود برکردیم.
آن layout که دارید را باز کنید. یک دکمه Button از سمت چپ تصویر موبایل در لیست بردارید بندازید در صفحه.
حالا یک نگاه بندازیم به امکانات این صفحه. مثلا Textview را انتخاب کنید. و ببینید چه تغییراتی میتوانید بدهید. میخواهم مثلا در TextView بنویسم: agree؟
اینجا میتوانید تغییرش بدهید:
همین کار را برای دکمه هم بکنید و در آن بنویسید OK.
تغییرات دیگری هم میتوانید بدهید مثلا برای همان button در منوی تنظیمات backgroundرا انتخاب کنید. آنجا برای دادن عکس یا رنگ به بک گراند ابزارهایتان هست.
آن را بزنید و از پنجره ای که باز میشود color را انتخاب کرده و یک رنگ بدهید به دکمه و اوکی کنید.
اما همانطور که جلسه قبل گفتم کار با کد برای دیزاین کردن خیلی بهتر هست. برای دیزاین صفحاتتان باید با تگ های xml کار کنید. جلسه قبل توضیحش را دادم. این جلسه یکم بیشتر آشنا میشویم.
تگ های xml برای دیزاین نرم افزارهای اندروید بصورت زیر هستند:
<Name attributes/>
مثلا دقت کنید:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="New Button"
android:id="@+id/button"
android:layout_gravity="center_horizontal"
android:background="#ffffe000”/>
نام ابزارمان Button است. یک سری ویژگی بهش داده شده است مانند width…text و... در آخر هم تگ را شده است. اما گاها تگ ما شامل یک سری محتویات هم است.
به صفحه طراحی بر می گردیم. روی صفحه اصلی کلیک کنید. منظورم قسمت مشکی رنگ از صفحه نرم افزار است که در آن ابزاری نذاشتید. چیزی که الان انتخاب کردید را رنگش را تغییر دهید تا بیشتر متوجه آن شوید.
این قسمت را میگوییم Linear Layout. همانطور که مشخص شده این ابزار شامل دو ابزار دیگر هم نیز می باشد ، Button و TextView.
منظورم قسمت قرمز رنگ هست :
گزینه ای که انتخاب کردیم LinearLayou نام دارد.
دوباره در پایین Text را بزنید تا داخل صفجه کد شویم. اولین تگ را نگاه کنید. LinearLayout. اگه دقت کنید میبینید به این صورت هست:
<name attribute>
......
some items
.......
</name>
وقتی یک تگ دارید که داخلش شامل ابزارهای دیگر هم میشود به این صورت نوشته میشود. مثل این layout که اینطوری نوشته شده و داخلش یک TextView داریم یک Button. روی انواع Layout ها هم کلی کار خواهیم داشت. حالا قصد داریم تا با یک سری از این صفت ها که مهمتر هستند آشنا شویم...
واضح هست که مهمترین ابزارهایی که خیلی استفاده میشوند همین TextView و Button هستند. پس باید یک سری ویژگی های کلیدی شان رو بدانیم.
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Agree?"
android:textColor="#ff000000"/>
صفت هایش به ترتیب برای عرض خود محل نوشتن، ارتفاعش، متنش و رنگ متن ان می باشد. به مقدار دهی صفت ها جلسه بعد میپردازیم فقط الان آشنا شوید.
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="OK"
android:id="@+id/button" android:layout_gravity="center_horizontal”/>
برای دکمه هم به ترتیب: عرض، ارتفاع، متن، آیدی (توضیح میدم) و محل قرارگیری در layout که اگر دقت کنید برای من وسط قرار دارد که با این هم بعدها کار داریم.
مهمترین چیزی که اینجا بود ID بود. به چه درد میخورد؟ گفتم که Layout در اندروید به یک Activity وصل است. حالا در Activity چطوری مشخص کنیم اگر دکمه OK زده شد چه اتفاقی بیفتد؟ از کجا این را بفهمونیم؟ از روی ID. بهرحال نمیتوانیم بگوییم دکمه ای که زده شد و برنامه بفهمد منظور ما چه دکمه ای هست. باید یک اسم به آن بدهیم. و مثلا بگویم دکمه ای که اسمش هست btn وقتی زده شد به من پیام نشان بده. اینجا بصورت خودکار id را button گذاشته است.
خب عالیه حالا کافیست برویم و به برنامه بفهمونیم قصد داریم پیام نشاد دهی. بریم سراغ اکتیویتی این layout. گفتم تنظیم کردن اتفاقهایی که در layout میفتد از طریق activity انجام میشود. از سمت چپ پوشه src را باز کنید و حالا داخل com.example.First بشوید و اکتیویتی را باز کنید. بالارا ببینید. نوشته class MyActivity . همانطور که گفتم اکتیویتی ها کلاس هستند. به بقیش کار نداشته باشید بیایم داخل oncreate که جلسه قبل توضیح آن را دادم. حالا میخواهیم کد مربوط به نمایش پیام را بزنیم داخل oncreate شروع کنید به نوشتن. یعنی بین } , { مربوط به Oncreate
و البته باید بگویم که همانطور که دیدید مثل کلاس انسان که رویداد آمدن را برایش تعریف کردم، اکتیویتی هم کلاسی هست که یکی از رویدادهایش Oncreate است. به مرور با بقیه رویدادها هم آشنا میشویم.
حالا این کدی که نوشتم را نگاه کنید. میخواهم نشان دهم چه معنایی میدهد البته در یکی دو جلسه آینده که عمیق تر به بحثهای عمیق تر پرداختیم بیشتر متوجه میشوید. برای اینکه تغییرات یک دکمه را بررسی کنیم باید اول در کد معرفیش کنیم. برای معرفی کردنش هم باید بهش بگوییم منظورمان دکمه ای هست که آیدیش x هست. این دقیقا میشود جمله من:
Button btn = findViewById(R.id.button);
اما کدی که نوشتم یک بخش دیگرم دارد. (Button)
این findViewById یک تابع است. که ورودی بهش یک ID میدهیم. و میرود و برایمان پیدایش میکند. (فعلا به R کار نداشته باشید).
اما خروجی آن از جنس Button نیست بلکه از جنس View هست. View را بیشتر توضیح میدهم اما بدانید که همه ابزارهای ما در صفحه از جنس view هستند. پس تابع findViewById نمیداند چه چیزی پیدا کرده. فقط یک آیدی گرفته و پیدا کردتش برای ما. برای اینکه این view را ذخیره کنیم و ازش استفاده کنیم (که همان دکمه خودمان هست) باید تبدیلش کنیم به Button.
(Button) = Cast to Button
یعنی تبدیل کردن به Button با کد بالا صورت میگیرد. حالا کله کار صورت گرفته را در یک دکمه که خودم اسمش رو btn دادم ذخیره میکنیم.
و کد من شد:
Button btn = (Button) findViewById(R.id.button);
حالا بعد از کلیک شدن تابعی را اجرا می کنیم. اینطور اتفاقات مثل کلیک شدن برای ابزار ها به عنوان Listener بیان میشوند. یعنی انگار سیستم عامل منتظر است تا ببیند کسی کلیک شد (Listen) و حالا وقتی این اتفاق افتاد باید یک کاری را برای این اتفاق set کند.
بزنید:
btn.setO
کد نیمه است؟ خب خوده intellij کاملش میکند. خاصیت کامل کردن اتوماتیک خیلی قوی دارد. همین کد بالا را که بنویسید یک لیست ظاهر می شودکه یکی گزین های آن این است :
setOnClickListener
روی گزینه با رفته و enter بزنید تا به صورت زیر کامل شود:
btn.setOnClickListener;()
خب تا الان یه رویداد تعریف کردیم برای موجودیت دکمه (همون مثال انسان و آمدن را به خاطر بیاورید)
حالا بعنوان ورودی باید به آن دستور زیر را بدهید:
new View.OnClickListener()
راه میانبر کد بالا این است که داخل پرانتز new On بزنید تا کامل شود.
حواستان باشه on با حرف O بزرگ است و intellij به حروف بزرگ و کوچیک حساسه می باشد.در لیستی که باز میکند انتخاب کنید:
OnClickListener
و enter بزنید. میبینید که مینویسد:
حالا کافیست در آن میان درخواست نمایش پیام بدهید که کد آن بصورت زیر است. ببینید تا توضیح بدهم:
Toast.makeText(getApplicationContext(),"salam",Toast.LENGTH_LONG).show();
خب دوباره Toast موجود است! ازش میخواهم که یک متن را بسازد. یعنی makeText که یک تابع است که سه پارامتر ورودی میگیرد. توجه کنید ورودیهای توابع با علامت کاما (,) جدا میشودند:
توسط ورودی اول قصد داریم تا محل نمایش پیام را تعیین کنیم. خب مسلم هست در محل آن همین برنامه است. پس از کد زیر استفاده می کنیم:
getApplicationContext()
ورودی دوم: چه چیزی را به کار بر نشان بدهیم ؟ مثلا متن "salam"
ورودی آخر... تا چه زمانی پیام روی صفحه باشد؟ که دو نوع می باشد:
LENGTH_LONG = tulani
LENGTH_SHORT = kutah
و در آخر نوبت به نمایش پیام می رسد :
.show()
بسیار خب حال برنامه را RUN کین د و در گوشی خروجی بگیرید:
نظرات کاربران