کانال بله, جهت پشتیبانی و اطلاع رسانی کانال بله, جهت پشتیبانی و اطلاع رسانی
عضویت

آموزش طراحی قالب برنامه با ابزار Linear Layout در اندروید

آموزش طراحی قالب برنامه با  ابزار Linear Layout در اندروید
شرح مختصر پروژه

در این مقاله قصد داریم تا نحوه استفاده از قالب های مختلف نمایش در اندروید را بصورت تصویری در محیط برنامه نویسی Eclipse به شما دانشجویان محترم آموزش دهیم...

توضیحات پروژه

دوره آموزش آندروید

رمز فایل :tahlildadeh.com

 

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

 

با عرض سلام و خسته نباشید به شما دانشجویان محترم آموزشگاه تحلیلگر داده ها. در این مقاله قصد داریم تا نحوه استفاده از قالب های مختلف نمایش در اندروید را بصورت تصویری در محیط برنامه نویسی Eclipse به شما دانشجویان محترم آموزش دهیم.

 

اهداف پروژه :

در این پروژه ما  قصد داریم اهداف زیر را پیاده سازی نماییم:

طراحی قالب برنامه با استفاده از ابزار Linear Layout

 

در طراحی برنامه های اندرویدی شش قالب مختلف برای طراحی قالب « Layout » برنامه ها وجود دارد.

Linear Layout «  قالب خطی »

Relative Layout « قالب نسبی »

Table Layout « قالب جدول »

Grid View « نمایش شبکه ای »

Tab Layout « قالب سربرگ »

List View « نمایش فهرستی »

اندروید ما را قادر می سازد تا قالب نمایش برنامه ها را با استفاده از فایل های xml ایجاد نماییم. البته از کلاس ها و دستورات جاوا نیز می توانیم استفاده نماییم. توجه داشته باشید که تمامی قالب های طراحی شده با استفاده از فایل های xml، می بایست در پوشه /res/layout/ قرار گیرند.

در این مقاله ما در رابطه با قالب نمایش خطی صحبت خواهیم کرد.

در قالب خطی، همان طور که از نام آن پیداست، تمامی بخش ها به صورت خطی نمایش داده می شوند و با استفاده از خصوصیت android:orientation می توانیم ویژگی های قالب خطی را به صورت عمودی و یا افقی نمایش دهیم. (شکل 1)

clip_image002

شکل 1 – نمونه ای از قالب خطی بصورت عمودی

clip_image004

شکل 1 – نمونه ای از قالب خطی بصورت افقی

 

 

حال که دو نوع از قالب های خطی را شناخته اید، در ادامه مثالی را انجام خواهیم داد.

برای شروع کار ابتدا می بایست یک پروژه جدید در محیط Eclipse ایجاد نماییم. برای این منظور از منوی File زیر منوی New و سپس زیر منوی Android Application Project را انتخاب می نماییم. (شکل 2)

 

clip_image006

شکل 2


همچنین برای ساده تر شدن و بالا بردن سرعت کار می توانید از منوی ابزار ها، منوی New و سپس Android Application Project را انتخاب نمایید. (شکل 3)

 

clip_image008

شکل 3


با انجام هر دو روش پنجره جدیدی با عنوان New Android Application باز می گردد. (شکل 4)


clip_image010

شکل 4

 

در این پنجره قسمت هایی وجود دارد که در زیر به توضیح آنها می پردازیم :

Application Name : در این فیلد می بایست نام برنامه خود را وارد نمایید. توجه داشته باشید که هر مقداری را که در این فیلد وارد نمایید، برنامه با این نام در لیست برنامه های نصب شده قرار خواهد گرفت.

در این فیلد می توانید یک رشته فارسی نیز وارد نمایید.

Project Name : در این فیلد می بایست نام کلی پروژه خود را وارد نمایید و بهتر است که یک رشته با معنا و مرطبت با برنامه خود وارد نمایید.

زمانی که مقدار فیلد Application Name را وارد می نمایید، فیلد Project Name نیز بصورت خودکار همان نام را وارد می نماید. توجه داشته باشد که اگر فیلد Application Name را با یک رشته فارسی مقداردهی نمودید، برای جلوگیری از خطاها می بایست رشته فارسی تولید شده در فیلد Project Name را با یک رشته معادل انگلیسی جایگزین نمایید.

Package Name :  در این فیلد می بایست پکیج پروژه خود را تعیین نمایید که بهتر است آدرس وب سایت خود را بدون درج http  و www و بصورت از آخر به اول و به همراه نام وارد شده در فیلد Project Name وارد نمایید. این نوع مقداردهی به برنامه های مارکت نظیر بازار و Google Paly این امکان را میدهد تا زمانی که نسخه جدیدی از برنامه شما ساخته و آماده منتشر گردید باخبر شده و نسخه جدید برنامه تان را جایگزین نسخه قبلی نماید.

Minimum Required SDK : در این لیست انواع API های « نسخه های سیستم عامل اندروید » منتشر شده توسط گوگل وجود دارد. با انتخاب هر کدام از آنها مشخص می نمایید که برنامه تان به چه حداقل نسخه ای از سیستم عامل اندروید نیاز دارد. برای مثال اگر گزینه API 14 را انتخاب نمایید، برنامه تان در سیستم عامل اندروید پایین تر از اندروید 4 یا همان Ice-Cream Sandwich، نصب و اجرا نمی گردد.

اگر از امکانات خاص نسخه های جدیدتر سیستم عامل اندروید استفاده نمی نمایید پیشنهاد می گردد که API 8  را انتخاب نمایید. چرا که با انتخاب این نسخه از سیستم عامل اندروید مطمئن خواهید بود که برنامه شما در تمامی گوشی ها و تبلت ها اجرا خواهد شد.

Target SDK : در این لیست انواع API های « نسخه های سیستم عامل اندروید » منتشر شده توسط گوگل وجود دارد. با انتخاب هر کدام از آنها مشخص می نمایید که بالاترین نسخه اندرویدی که برنامه شما می تواند در آن نصب و اجرا گردد کدام نسخه است. بدیهی ست که هرچه سطح API انتخاب شده بالاتر باشد، گوشی ها و تبلت های جدید نیز می توانند از برنامه شما استفاده نمایند.

 

Compile With : در این لیست انواع API های « نسخه های سیستم عامل اندروید » منتشر شده توسط گوگل وجود دارد. با انتخاب هر کدام از آنها مشخص می نمایید که برنامه Eclipse از کدام نسخه از سیستم عامل اندروید برای نوشتن کلاس های برنامه و همچنین کامپایل و تست نمودن آن استفاده نماید.

Theme : در این لیست می توانید یک Theme برای برنامه خود انتخاب نمایید.

توجه داشته باشید زمانی که مقدار Compile With را کمتر از API 14 انتخاب نمایید، از این قسمت نمی توانید استفاده نمایید و می بایست از لیست موجود گزینه None رو انتخاب نمایید.

پس از مقداردهی نمودن فیلد های ذکر شده بر روی دکمه Next کلیک می نماییم تا به مرحله بعدی ایجاد پروژه برویم. (شکل 5)


clip_image012

شکل 5

 

در مرحله بعدی اگر گزینه Create custom launcher icon را انتخاب نمایید، برنامه Eclipse به شما اجازه میدهد تا برای برنامه خود یک عکس جهت ساختن icon انتخاب و یا با استفاده از ابزار های خود برنامه Eclipse، icon مورد نظر خود را ترسیم نمایید. توجه داشته باشید که در صورت عدم انتخاب این گزینه، صفحه مربوطه برای شما باز نخواهد شد.

همچنین اگر گزینه Create Activity را انتخاب نمایید، برنامه Eclipse به شما اجازه میدهد که نام و نوع activity برنامه تان را انتخاب نمایید.

این دو گزینه را انتخاب می نماییم و سایر گزینه ها را به حالت پیش فرض خود می گذاریم. حال مجددا بروی دکمه Next کلیک می نماییم تا به مرحله بعدی ایجاد پروژه برویم. (شکل 6)

clip_image014

شکل 6

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

دکمه image برای انتخاب یک عکس ترجیحا با فرمت png به عنوان icon برنامه

دکمه Clipart برای انتخاب یک clipart « شکلک » به عنوان icon برنامه

دکمه Text برای ورود یک نوشته به عنوان icon برنامه

مورد استفاده قرار می گیرند.

 

ما دکمه image را انتخاب و پس از انتخاب کردن عکس مورد نظر به عنوان icon برنامه بر روی دکمه Next کلیک می نماییم تا به مرحله بعدی ایجاد پروژه برویم. (شکل 7)

clip_image016

شکل 7

در مرحله بعدی گزینه Create Activity را انتخاب می نماییم و از لیست موجود که بیانگر انتخاب نوع Activity برنامه می باشد گزینه Blank Activity را انتخاب می نماییم. (شکل 8)

 

 

clip_image018

شکل 8

در مرحله آخر نیز باید برای activity و layout خود یک نام انتخاب نمایید. ما نام انتخاب شده پیش فرض را قبول کرده و بر روی دکمه Finish کلیک می نماییم تا پروژه مان ساخته شود. (شکل 9)

 

 

 

clip_image020

شکل 9

تا این جای کار ما پروژه خود را در برنامه Eclipse ایجاد کرده ایم. حال برای ادامه کار می بایست layout برنامه خود را طراحی نماییم.

برای این منظور سه TextView، یک Button و یک EditText بر روی layout خود قرار می دهیم. (شکل 10)

 

clip_image021

شکل 10

همچنین مقادیر لازمه برای نمایش متن های TextView و Button را در فایل string.xml وارد می نماییم. (شکل 11)


clip_image022

شکل 11


 

حال در این مرحله می بایست کد های اصلی برنامه را در کلاس MainActivity وارد نماییم.

اولین کدی که می بایست به کلاس MainActivity اضافه نماییم متد onCreate می باشد. این متد یکی از متدهای اصلی برنامه و همین طور چرخه حیات برنامه های اندرویدی می باشد و زمانی که برنامه برای اولین بار اجرا می گردد و یا دستگاه اندرویدی ما از حالت portrait به حالت landscape و یا بر عکس تغییر می کند، این متد فراخوانی می گردد.

یکی از دستورات مهمی که باید به این متد اضافه شود دستور setContentView است. وظیفه این دستور به نمایش در آوردن layout برنامه می باشد.(شکل 12)

clip_image023

شکل 12


مقدار activity_main نام فایل xml مربوط به layout برنامه مان می باشد.

همچنین دستور savedInstanceState حالت جاری layout برنامه را ذخیره می نماید. به این معنا که، فرض نمایید بر روی layout خود یک ابزار EditText قرار داده اید و مقدار نام خودتان را درون آن وارد کرده اید. زمانی که حالت دستگاه اندرویدی خودتون را به landscape و یا portrait تغییر دهید مشاهده می نمایید که مقدار نام شما هنوز در EditText وجود دارد و پاک نشده است. دلیل آن به خاطر استفاده از دستور فوق می باشد.

 

 

حال اگر برنامه را اجرا نمایید، نمایی شبیه به عکس زیر خواهید داشت. (شکل 13)

clip_image025

شکل 13

 

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

شاد و پیروز باشید.

 

1394/09/04 9072 383
رمز عبور : tahlildadeh.com یا www.tahlildade.com
نظرات شما

نظرات خود را ثبت کنید...