رفتن به مطلب
انجمن اندروید ایران | آموزش برنامه نویسی اندروید و موبایل
  • android.png.1fab383bc8500cd93127cebc65b1dcab.png

کار با Container در اندروید


پست های پیشنهاد شده

Container امکاناتی برای نمایش خاص از Widgetها را به ما می دهد.مثلا شما می خواهید widget ها را به صورت پشت سر هم به صورت افقی یا به صورت عمودی قرار دهیدبرای این کار از Container استفاده می کنیم .

به عنوان مثال می خواهیم Widgetها را به صورت زیر قرار دهیم (یک EditText و یک TextView در بالای صفحه و دو Button دقیقا زیر EditText)

 

[rtl]do.php?img=59[/rtl]

[rtl]در حالت کلی استفاده از Widgetها برایقرار دادن Widgetها و چیدمان آنها به صورت دلخواه  می باشد.

در اینجا رایج ترین کانتینرها را شرح می دهیم:

LinearLayout:1

RelativeLayout:2

TableLayout:3

Scrollwork:4

LinearLayout

در این مدل Widgetها یکی پس از دیگریدر سطرها و ستون ها  قرار می گیرند.در اینمدل 5 خصوصیت را باید تنظیم کرد.

do.php?img=60

[/rtl]

[rtl]

Orientation:1

نشان می دهد که LinearLayout به صورت سطری یا ستونی باشد.فقط کافیست خصوصیت android:orientation را به vertical یا horizontal تنظیم کنید.همچنین این خصوصیت در زماناجرا هم قابل تغییر می باشد کافیست متد setOrientation() برای LinearLayout که پارامتر ورودی آن می باشد vertical یا horizontal

  را فراخوانی کنید.

Fill Model:2

یک سطر از Widgetها را در نظربگیرید مانند یک جفت RadioButton اندازه این Widgetها به طور طبیعیاندازه متن آنها می باشد و اندازه ترکیب شده آنها ممکن است اندازه صفحه نمایش دستگاه اندروید نباشد مخصوصا دستگاه های که با اندازه صفحه نمایش های متفاوت وجود دارد .شما با این مسئله روبرو هستید که با فضای باقی مانده چه باید کرد.

همه Widgetها درون LinearLayout خصوصیت های android:layout_width و android:layout_height را برای حل این مسئله دارا می باشند کهمقادیر این خصوصیت ها موارد زیر  می باشد.

الف- شما می توانید مقدار آن را تنظیم کنید .مثلا 125pxکه اندازه آن دقیقا 125px می شود.

ب- fill_parent که باید تمام فضای موجود را پوشش دهد.

ج-

wrap_content به این معنی که Widgetها باید به اندازهفضای دربرگیرنده اش باشد یا به عبارت ساده تر هر زمان که محتوای آن افزایش یافت متناسب با آن افزایش ؛ پهنا یا ارتفاعی که برای Widget مورد نظر تنظیم کردیم افزایش پیدا کند.

در اینجا یک مثال در مورد EditText می زنیم:

do.php?img=61

[/rtl]

[rtl]

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

do.php?img=62

[/rtl]

[rtl]در مثال بالا، پهنا به اندازه طول متن و ارتفاع هم بهبهترین حالت که متن مشخص باشد.

do.php?img=63

[/rtl]

[rtl]

در مثال فوق، پهنا و ارتفاع به اندازه پهنا و ارتفاعصفحه نمایش می باشد.

do.php?img=64

[/rtl]

[rtl]

در مثال فوق، پهنا به اندازه متن و ارتفاع به اندازهارتفاع صفحه نمایش می باشد.

 

Weight:3

اگر دو Widget داشته باشیم و بخواهیم فضای خالی موجود را تقسیم کنیم، چه بایدکرد؟

فرض کنید که یک فیلد چند خطی در یک ستون دارید و شما میخواهید فضای باقی مانده را بعد از قرار دادن تمام Widgetهابگیرید.برای این کار شما باید خصوصیت های android:layout_width را برای سطرها و android:layout_height را برای ستون ها با مقدار fill_parent تنظیم کنید.

android:layout_weight میزان فضای خالی که به Widget داده می شود را مشخص میکند.

برای مثال اگر شما خصوصیت android:layout_weight را برای جفت Widgetها  مقدار یکسان غیر صفر بدهید مثلا 1، فضای بینآنها مساوی تقسیم می شود ولی اگر اولی را 1 و دومی را 2 بدهید دومی دوبرابر اولی فضا می گیرد .این خصوصیت ها به طور پیش فرض 0 می باشد.

الگوی دیگر استفاده از Widgetها  زمانی است که بخواهیم اندازه ها را با درصدبیان کنیم.

برای استفاده از الگو در نمای افقی:

الف: خصوصیت android:layout_weight برای تمام Widgetها  را برابر 0 قرار دهید.

ب- مقدار android:layout_weight را به اندازه دلخواه تنظیم کنید.

ج- مطمئن شوید که جمع تمام Widgetها  بیشتر از 100 نمی شود.

4- Gravity

Widgetها 

به طور پیش فرض از بالا گوشه چپ قرار می گیرند.اگر بخواهید نحوهء قرارگرفتن آنها را تغییر دهید از ویژگی android:layout_gravity استفاده می کنید یا اگر بخواهید درزمان اجرا آن را تعیین کنید از متد setGravity() استفاده کنید.

Padding :5

به طور پیش فرض Widgetها  به صورت فشرده در کنار یکدیگر قرار می گیرند.اگر می خواهید فاصله ی بین Widgetها   را زیاد کنید از خصوصیت Padding استفاده کنید یا در زمان اجرا از متد setPadding() استفاده کنید.

[/rtl]

[rtl]

Paddingفاصله کرانه Widgetها را مشخص می کند.

do.php?img=65

[/rtl]

[rtl]شما می توانید از خصوصیت های android:paddingTop,android:paddingLeft, android:paddingRight, android:paddingBottom به ترتیب برای فاصله گذاری در چپ،راست،پایین،بالا استفاده کنید.[/rtl]

[rtl]مثال:[/rtl]

[rtl]به فایل main.xmlرفته و دستورات زیر را وارد کنید.[/rtl]

[rtl]do.php?img=66[/rtl]

android:orientation="horizontal"android:layout_width="wrap_content"android:layout_height="wrap_content"android:padding="5px">android:id="@+id/horizontal"android:text="horizontal" />android:id="@+id/vertical"android:text="vertical" />android:orientation="vertical"android:layout_width="fill_parent"android:layout_height="wrap_content"android:padding="5px">android:id="@+id/left"android:text="left" />android:id="@+id/center"android:text="center" />android:id="@+id/right"android:text="right" />

[rtl]

 کدهای زیر را درفایل Example2Activity.java وارد کنید.[/rtl]

import android.app.Activity;import android.os.Bundle;import android.view.Gravity;import android.widget.LinearLayout;import android.widget.RadioGroup;import android.widget.RadioGroup.OnCheckedChangeListener;public class Example2Activity extends Activity {/** Called when the activity is first created. */RadioGroup orientation;RadioGroup gravity;private OnCheckedChangeListener listener=new OnCheckedChangeListener() {public void onCheckedChanged(RadioGroup group, int checkedId) {// TODO Auto-generated method stubswitch (checkedId) {case R.id.horizontal:orientation.setOrientation(LinearLayout.HORIZONTAL);break;case R.id.vertical:orientation.setOrientation(LinearLayout.VERTICAL);break;case R.id.left:gravity.setGravity(Gravity.LEFT);break;case R.id.center:gravity.setGravity(Gravity.CENTER_HORIZONTAL);break;case R.id.right:gravity.setGravity(Gravity.RIGHT);break;}}};@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.main);orientation=(RadioGroup)findViewById(R.id.orientation);orientation.setOnCheckedChangeListener(listener);gravity=(RadioGroup)findViewById(R.id.gravity);gravity.setOnCheckedChangeListener(listener);}}

[rtl]

2-

RelativeLayout

همانطور که از نامش پیداست widgetها را متناسب با رابطهء آنها در کانتینرها قرار می دهد .

ساده ترین ارتباط widgetها مربوط به ارتباط نکانی آنها می باشد که در اینجا خصوصیات آن را با یک مثالشرح می دهیم.

فرض کنید می خواهیم widgetها را به صورت زیر در صفحه قرار دهیم.

do.php?img=78

توضیحات عکس:

1-یک TextViewدر بالای صفحه و یک EditText در سمت راست آن قرار دارد.

2-EditTextو ViewText دقیقا در یک سطح قرار دارند.

3-در پایین EditTextدو Button وجود دارد

4-دو Buttonدر سمت راست قرار دارند.

5-Buttonبا نام Cancel در سمت چپ Ok قرار دارد.

دستورات مربوط به توضیحات 1و 2

[/rtl]

android:layout_width="fill_parent"android:layout_height="fill_parent">android:text="Enter Your NAme"android:id="@+id/tvName"android:layout_alignParentTop="true"خط فوق ،TextView را در بالای صفحه قرار می دهد.android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignBaseline="@+id/edName" خط فوق خصوصیت نام Widget می باشد که میخواهیم با آن هم سطح شود./>android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_alignParentRight="true"android:layout_toRightOf="@+id/tvName"در خط فوق EditText در سمت راست قرار می گیرد.با این دستور مشخص کردیم که EditText در سمت راست یک TextView با نام tvName قرار دارد./>

[rtl]

دستورات مربوط به توضیحات 3و4و5

[/rtl]

android:layout_width="fill_parent"android:layout_height="fill_parent" >android:id="@+id/tvName"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignBaseline="@+id/tvName"android:layout_alignParentLeft="true"android:text="Enter Your NAme" />android:id="@+id/etName"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_alignParentTop="true"android:layout_toRightOf="@+id/tvName" />android:id="@+id/btnOk"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentRight="true"android:layout_below="@+id/etName"android:text="ok" />android:id="@+id/btnCancel"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_alignParentRightt="true"android:layout_below="@+id/etName"android:layout_toLeftOf="@+id/btnOk"android:text="Cancel" />

[rtl]

در کد بالا

android:layout_alignParentRight="true"

android:layout_below="@+id/etName"

 در سمت راست و پایین EditText می باشد.

android:layout_alignParentRightt="true"

android:layout_below="@+id/etName"

android:layout_toLeftOf="@+id/btnOk"

در سمت راست و پایین EditText می باشد و سمت چپ ok میباشد.

 

خصوصیت android:paddingمربوط به RelativeLayout که فاصله widgetها را از اطراف مشخص می کند.

[/rtl]

android:layout_width="fill_parent"android:layout_height="fill_parent"android:padding="0dp">

[rtl]

do.php?img=77

[/rtl]

android:layout_width="fill_parent"android:layout_height="fill_parent"android:padding="10dp">

[rtl]do.php?img=76

 3-

TableLayout

این نوع Container پنجره را مانند جدول به سطر و ستون هایی تقسیم می کند.شما می توانید Widgetها را در هر کدام از سلولهای جدول قرار دهید.

می خواهیم در پنجره 2 سطر اضافه کنیم کهبرای اضافه کردن سطرها از عنصر  مانند زیر استفاده می کنیم.[/rtl]

 سطر1سطر2

[rtl]

هر Widget را که میخواهید اضافه کنید بین عنصر قرار دهید.

مثال:

do.php?img=75

این صفحه دارای 2 سطر و 5 ستون می باشد.در اینجا تعداد سطرها توسط ما مشخص می شود ولی تعداد ستون برابر است با بیشترین widgetی که در هر کدام از سطرها وجود دارد.

در این مثال 5 widgetدر سطر اول و 2 widget در سطر دوم قرار گرفته است بنابراین تعداد ستونها برابر5 می باشد.

دستورات صفحه فوق به صورت زیر می باشد.[/rtl]

android:layout_height="fill_parent" >سطر اولandroid:layout_height="wrap_content"android:id="@+id/tvName"android:text="Enter YourName"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>android:id="@+id/btnOk"android:layout_width="wrap_content"android:layout_height="wrap_content"/>android:id="@+id/btnCancel"android:layout_width="wrap_content"android:layout_height="wrap_content"/>android:id="@+id/btnExit"android:layout_width="wrap_content"android:layout_height="wrap_content"/>سطر دومandroid:layout_height="wrap_content"android:id="@+id/tvFamily"android:text="Enter Family"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>

[rtl]

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

stretchColumns:1

دستورات زیر را وارد نمایید.

[/rtl]

android:layout_height="fill_parent" >android:layout_height="wrap_content"android:id="@+id/tvName"android:text="Enter YourName"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>android:layout_height="wrap_content"android:id="@+id/tvFamily"android:text="Enter Family"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>

[rtl]

do.php?img=74

همانطور که مشاهده می کنید اندازه هرستون متناسب با اندازه widgetی می باشد که در آن قرار دارد که این به صورت مناسب نمی باشد برای اینکه مشکل رابرطرف کنیم از خصوصیت android: stretchColumns برای TableLayout استفاده می کنیم که این خصوصیت اندیس ستون (ستون ها) رادریافت می کند که widget کدام ستون ها را گسترش داده تا فضای خالی را پر کند.

 

دستورات فوق را به صورت زیر تغییر می دهیم.

[/rtl]

android:layout_height="fill_parent"androidtretchColumns="1" >android:layout_height="wrap_content"android:id="@+id/tvName"android:text="Enter YourName"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>android:layout_height="wrap_content"android:id="@+id/tvFamily"android:text="Enter Family"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>

[rtl]

do.php?img=73

در کد بالا مشخص کردیم که widgetی که در ستون 1 می باشد را گسترش داده تا فضای خالی را پر کند.

باید توجه داشت که اندیس ستونها از 0شروع می شود.

311x20file:///C:%5CUsers%5CSony%5CAppData%5CLocal%5CTemp%5Cmsohtml1%5C08%5Cclip_image002.gif[/img]279x20file:///C:%5CUsers%5CSony%5CAppData%5CLocal%5CTemp%5Cmsohtml1%5C08%5Cclip_image004.gif[/img]

android: shrinkColumns:2

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

do.php?img=71302x251http://p30droid.com/Uploader/do.php?img=72[/img]

[/rtl]

android:layout_height="fill_parent">android:layout_height="wrap_content"android:id="@+id/tvName"android:text="Enter YourName ------------------------------------------------"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>

[rtl]

همانطور که مشاهده می کنید زمانی که طول widgetافزایش می یابد ستون معادل آن هم افزایش می یابد و دیگر widgetها درصفحه قابل مشاهده نیستند برای رفع این مشکل از خصوصیت android: shrinkColumns استفاده می کنیم .این خصوصیت اندیسستون ها را گرفته و مشخص می کند در صورتی که اندازه widget از اندازه ستون افزایش یافت ستون هایمشخص شده شکسته و به خط بعد بروند.

 do.php?img=70

کد فوق را به صورت زیر تغییر می دهیم :

[/rtl]

android:layout_height="fill_parent"androidhrinkColumns="0" >

[rtl]

do.php?img=69[/rtl]

[align=right]android:collapseColumns

:3

[/align]

 

[align=right]برای مخفی کردن ستونها از این خصوصیت استفاده می کنیم .اندیس ستون های که می خواهید مخفی شوند را دریافت می کند.

[/align]

[align=right]کدزیر ستون 0 را مخفی می کند.

[/align]

[align=right]

android:layout_height="fill_parent"android:collapseColumns="0" >android:layout_height="wrap_content"android:id="@+id/tvName"android:text="Enter YourName"/>android:layout_width="wrap_content"android:layout_height="wrap_content"/>

[/align]

[rtl]

 

Scrollwork:4

تلفن های همراه صفحه نمایش موچکی دارند و همه widget ها و اطلاعات دریک صفحه قابل مشاهده نمی باشد .به کمک این کانتینر شما می توانید اطلاعات بیشتری را روی صفحه نمایش قرار دهید و با Scroll کردن آنها رامشاهده کنید.

برای این کار کافیست widgetها و اطلاعات را بین عنصر زیر قراردهید.

<ScrollView >

ScrollView>

مثال:

[/rtl]

xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="fill_parent"android:layout_height="wrap_content">android:layout_width="fill_parent"android:layout_height="fill_parent"androidtretchColumns="0">android:layout_height="80px"android:background="#000000"/>android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#440000" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#884400" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#aa8844" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#ffaa88" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#ffffaa" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#ffffff" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#101056" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#112548" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />android:layout_height="80px"android:background="#751357" />android:paddingLeft="4px"android:layout_gravity="center_vertical" />

do.php?img=68

لینک ارسال
به اشتراک گذاری در سایت های دیگر

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...