ساخت یک ListView سفارشی (Custom ListView) شامل چندین عنصر در هر ردیف (row) از ListView و با قابلیت رفتن به Activity جدید پس از اشاره کاربر بر روی هر ردیف و ارسال اطلاعات بر اساس ردیف انتخاب شده به Activity مقصد، در برنامه نویسی اندروید

در این مبحث قصد داریم که یک برنامه اندروید شامل یک ListView سفارشی بسازیم که در آن، اگر کاربر بر روی یک ردیف (row - item) از ListView اشاره کند، یک سری اطلاعات بر اساس آن ردیف از ListView به یک Activity ارسال شود (یعنی Activity اجرا شده و اطلاعاتی را بر اساس انتخاب کاربر از میان item های ListView ، دریافت کند).

فایل پروژه اندروید و همچنین فایل apk ساخته شده از آن را می توانید در انتهای مبحث، دانلود کنید و سپس بر اساس آنها، توضیحات بنده را بخوانید و بخش های مختلف آن را بررسی کنید.

ساختار برنامه اندروید به این صورت است که ListView با تعداد 20 ردیف (row - item) داریم که در هر ردیف آن، 4 عنصر وجود دارد (2 تا TextView و 2 تا ImageView). یکی از ImageView ها دارای عکس ثابت و تکراری در تمامی item ها است ولی یک ImageView دیگر، عکسی متفاوت در هر item خواهد داشت. همچنین، یک TextView دارای متنی ثابت در همه item ها است، ولی یک TextView دیگر، در هر item ، متنی متفاوت را خواهد داشت. در واقع با این انتخاب خواسته ایم نمایش بدهیم که چگونه می توانیم عناصری با منبع یکسان و همچنین، عناصری با منبع غیر یکسان، در item های ListView داشته باشیم.

ساخت یک ListView سفارشی (Custom ListView) شامل چندین عنصر در هر ردیف (row) از ListView و با قابلیت رفتن به Activity جدید پس از اشاره کاربر بر روی هر ردیف و ارسال اطلاعات بر اساس ردیف انتخاب شده به Activity مقصد، در برنامه نویسی اندروید

پس از اشاره بر روی یک item دلخواه از ListView ، وارد یک Activity دیگر می شویم که در آن Activity ، پیامی نمایش داده می شود که شماره item انتخاب شده در ListView را اعلام کرده است (زیرا این شماره را به آن Activity ارسال می کنیم) :

این پروژه اندروید، نیاز به تعدادی عکس دارد، یکی به عنوان عکس پس زمینه Activity مربوط به نمایش Listview ، یکی برای نمایش در آن ImageView که عکس آن در تمامی ردیف های ListView ثابت است و 20 تای دیگر هم برای نمایش در ImageView با عکس متغیر در 20 ردیف (row - item) مربوط به ListView . تمامی این عکس ها را در پوشه drawable-hdpi از پروزه اندروید، کپی کرده ایم :

همچنین به تعدادی رشته (متن - string) نیز برای پروژه اندروید نیاز داریم (مثلا برای متنی که باید در هر ردیف از Listview نمایش داده شود) که آنها را در فایل strings.xml از پروژه اندروید تعریف کرده ایم :

بنابراین کدهای فایل strings.xml به صورت زیر خواهد بود :

<?xml version="1.0" encoding="utf-8"?>

<resources>

    <string name="app_name">CustomListView</string>

    <string name="action_settings">Settings</string>

    <string name="hello_world">Hello world!</string>

    <string name="title_activity_second">SecondActivity</string>

    <string name="kelidestan">کلیدستان</string>

    <string name="string_key_1">کلید شماره 1</string>

    <string name="string_key_2">کلید شماره 2</string>

    <string name="string_key_3">کلید شماره 3</string>

    <string name="string_key_4">کلید شماره 4</string>

    <string name="string_key_5">کلید شماره 5</string>

    <string name="string_key_6">کلید شماره 6</string>

    <string name="string_key_7">کلید شماره 7</string>

    <string name="string_key_8">کلید شماره 8</string>

    <string name="string_key_9">کلید شماره 9</string>

    <string name="string_key_10">کلید شماره 10</string>

    <string name="string_key_11">کلید شماره 11</string>

    <string name="string_key_12">کلید شماره 12</string>

    <string name="string_key_13">کلید شماره 13</string>

    <string name="string_key_14">کلید شماره 14</string>

    <string name="string_key_15">کلید شماره 15</string>

    <string name="string_key_16">کلید شماره 16</string>

    <string name="string_key_17">کلید شماره 17</string>

    <string name="string_key_18">کلید شماره 18</string>

    <string name="string_key_19">کلید شماره 19</string>

    <string name="string_key_20">کلید شماره 20</string>

</resources>

ساختار پروژه اندروید به صورت زیر می باشد (Activity ها و فایل های xml را نمایش داده ایم) :

نام پروژه اندروید را برابر CustomListView انتخاب کرده ایم، همچنین نام package برنامه اندروید را برابر com.kelidetan.customlistview در نظر گرفته ایم. نام Activity اصلی برنامه اندروید، MainActivity.java می باشد و یک Activity هم با نام SecondActivity.java داریم. ListView در MainActivity نمایش داده می شود و اگر کاربر بر روی یکی از ردیف های (row - item) ListView اشاره کند، آنگاه وارد SecondActivity می شود.

فایل activity_main.xml ، لایه گرافیکی متناظر برای MainActivity را تعیین می کند و فایل activity_second.xml هم مربوط به لایه گرافیکی متناظر برای SecondActivity است. در فایل list_item.xml ، لایه گرافیکی متناظر برای هر ردیف ListView تعریف شده است. یعنی در این فایل، ساختار کلی هر ردیف (row - item) از ListView را توصیف می کنیم تا برنامه اندروید بداند که عناصر هر ردیف، چگونه باید چیده شوند.

بنابراین نکته مهم در ListView این است که ما ساختار کلی هر ردیف (row - item) از ListView را در یک فایل xml تعریف می کنیم. مثلا در این ListView ، چون 4 عنصر داریم، بنابراین یک فایل xml با نام list_item.xml ساخته ایم که در آن شیوه قرارگیری این 4 عنصر تعریف شده است. این فایل در پوشه layout از پروژه اندروید قرار می گیرد. بنابراین اگر بخواهیم موقعیت عناصر در هر ردیف از ListView را تغییر بدهیم، تنها کافی است که این فایل را ویرایش کنیم :

کدهای فایل list_item.xml را به صورت زیر می نویسیم :

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:padding="10dp"

    android:orientation="vertical" >

    <LinearLayout android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:orientation="horizontal" >

        <TextView

            android:id="@+id/textView1"

            android:layout_width="80dp"

            android:layout_height="wrap_content"

            android:padding="5dp"

            android:textSize="15sp"

            android:text="Text_1" />

        <TextView

            android:id="@+id/textView2"

            android:layout_width="80dp"

            android:layout_height="wrap_content"

            android:padding="5dp"

            android:textSize="15sp"

            android:text="@string/kelidestan" />

        <ImageView

            android:id="@+id/imageView1"

            android:layout_width="60dp"

            android:layout_height="60dp"

            android:padding="5dp"

            android:layout_gravity="right"

            android:src="@drawable/kelidestan" />

        <ImageView

            android:id="@+id/imageView2"

            android:layout_width="60dp"

            android:layout_height="60dp"

            android:padding="5dp"

            android:layout_gravity="right"

            android:src="@drawable/kelidestan" />

    </LinearLayout>

</LinearLayout>

همان طور که مشاهده می کنید، برای هر ردیف (row - item) از ListView ، دو TextView برای نمایش متن و دو ImageView برای نمایش عکس تعریف کرده ایم. اگر یادتان باشد، گفتیم که یکی از متن ها ثابت و دیگری متغیر خواهد بود و همچنین یکی از عکس ها ثابت و دیگری متغیر خواهد بود. اگر به کدها نگاه کنید، مشاهده خواهید کرد که برای هر 4 عنصر، منابعی (متن یا عکس) را تعیین کرده ایم. بنابراین همان دو موردی که قصد داشتیم ثابت باشند را در همینجا مشخص کرده ایم که چه چیزی در آنها نمایش داده شود و دیگر نیازی به تغییر دادن آنها با کدهای java در Activity نخواهد بود. اما دو تای دیگر که قرار است در هر ردیف دارای مقدار (متن یا عکس) متفاوتی باشند را بعدا در خود کدهای java در Activity تغییر خواهیم داد. شاید این سوال برای شما پیش بیاید که خوب چرا دو موردی که قرار است متغیر باشند را مقدار دهی (متن یا عکس) کرده ایم، بلکه هیچ منبعی برای آن تعیین نمی کردیم تا بعدا منبع آنها را توسط کدهای java تعیین کنیم، پاسخ این است که چون ما معمولا نگاهی هم به ظاهر گرافیکی فایل xml می اندازیم، بنابراین یک مقدار (متن یا عکس) برای آنها تعیین می کنیم تا نحوه چیدمان آنها در کل صفحه را ببینم، بعدا چون با اجرای کدهای java ، منبع این عناصر تغییر داده می شود، بنابراین کاربر هیچ وقت این منابع (متن یا عکس) پیش فرض را که در فایل xml تعریف کرده ایم، نخواهد دید.

بنده خیلی وسواس برای تنظیم چیدمان عنصرها در هر ردیف نداشته ام و در صورت تمایل، می توانید آنها را مطابق میل خود تغییر بدهید (همچنین اگر این مبحث را تا انتها خواندید، بعدا بد نیست که نگاهی به