نحوه نمایش آرایه ای از داده ها در یک لیست

در این درس تخصصی و جامع از دوره “آموزش جامع توسعه اندروید”، شما با تکنیک‌های حرفه‌ای نمایش آرایه‌های داده در لیست‌های اندروید آشنا می‌شوید. از تعریف آرایه‌ها و تنظیم ListView گرفته تا اتصال داده‌ها با استفاده از ArrayAdapter، همه مراحل به صورت گام به گام و با جزئیات کامل آموزش داده می‌شود. این درس برای مهندسان و کارشناسانی که به دنبال ارتقای مهارت‌های خود در توسعه اپلیکیشن‌های اندروید و ایجاد رابط‌های کاربری پویا و کاربرپسند هستند، طراحی شده است. با اتمام این درس، شما قادر خواهید بود داده‌های خود را به شکلی زیبا و کارآمد در اپلیکیشن‌های اندروید نمایش دهید و تجربه کاربری بهتری برای مخاطبان خود فراهم کنید.

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

در این قسمت از آموزش قصد دارم بهتون نشون بدم چطوری یک لیست ساده از رشته ها رو نمایش بدید، و بعد در ویدئوی آموزشی بعدی نحوه گسترش و سفارشی کردن بیشتر این لیست رو بهتون نشون میدم. من در پروژه ای به نام List View کار میکنم، و همونطور که میبینید در فولدر منابع در قسمت values یک فایل جدید با نام clothing.xml از قبل اضافه کردم. این فایل رو برای تعریف یک آرایه رشته ای ایجاد کردم. آرایه ای شامل چند رشته یا استرینگ.

خب؛ قبلا همچین چیزی نداشتیم و این سوال پیش میاد که string-array واقعاً چی هست؟، باید بگم اینی که می بینید دقیقا یک string-array یا همون یک آرایه رشته ای هستش در واقع یک مجموعه ای از مقادیر رشته ای و یعنی مقادیری با نوع داده string، و از اونجایی که این یک آرایه هستش باید داده هاش رو به صورت منظم و به ترتیب داخلش ذخیره کنیم. این string-array ها بهترین روش برای ایجاد یک تعداد داده کوتاه در برنامه هستن درست وقتی که داده ها به صورت پویا نیستن، پویایی به معنی این هست که داده هاتون ثابت هستن و قرار نیست از سرور گرفته بشن یا در موقع اجرا تغییری توشون ایجاد بشه.

مثل اپلیکیشنی که قرار هست برای یک وب سایت خبری بسازید و هربار که کاربر اون رو ران میکنه چون دینامیک هست خبرهای بروز رو نشون میده. دقیقا مثل سایر منابع باید یک آیدی واسش تعریف کنید و من اینجا شناسه منبع یا آیدی اش رو clothing میذارم. در واقع آیدی اش همون نام string-array مون میشه.

بعد از اون میرم به فایل لایوت content_main.xml، و کنترل Image View رو حذف و به جایش یک لیست ویو قرار میدم. این ویو رو میتونید در منوی pallet در قسمت Containers پیدا کنید، اینجا، و درگش کنید روی صفحه در قسمت بالا گوشه سمت چپ. بعد، به Text mode میرم و یک نگاهی به کد های ایجاد شده میندازم. میخوام ویژگی های width و height یا عرض و ارتفاعش رو تغییر بدم و از wrap _content به match _parent تبدیل شون کنم تا ListView ای که چند لحظه پیش اضافه کردم کل صفحه رو در بر بگیره.

بعد، کدم رو ریفرمت میکنم تا همه چیز بصورت راست چین مرتب بشه و اینتر هم اینجا میزنم تا کمی از هم مجزا بشن و بعد به Design view میرم ببینم چی شد. همه کاری که تو فایل لایوتم انجام دادم همین بود. بقیه کارها در کد جاوا انجام میشه.

کلاس Main Activity رو جستجو و باز میکنم و میرم سراغ متد onCreate(). در این قسمت میخوام کدهایی اضافه کنم که اول داده ها رو از منابع بگیره و بعد در کنترل لیست ویو قرار بده.

اول از همه یک آرایه رشته ای تعریف میکنم و اسمش رو items میذارم و از این عبارت برای فراخونی اون از فایل منابع استفاده میکنم. با متد get Resources شروع میکنم. و از اینجا، متدی با نام get StringArray رو فراخونی میکنم و بعد آیدی مورد نظر رو بهش میدم. اگه یک رشته ساده بود، فراخوانی آیدی های منابع همیشه با R .string شروع میشه، ولی حالا که یک آرایه هستش با R .array مینویسمش و بعد هم نام آرایه رو وارد میکنم. پس شد R .array.clothing.

از اونجایی که این پروسه، یعنی اسکن شدن و تولید کلاس جاوا در بکگراند اجرا میشه، اندروید استودیو میدونه که این آیدی در منابع وجود داره. در واقع به محض نوشتن کد توسط برنامه نویس اندروید استودیو به دنبال آیدی نوشته شده میگرده و اگه پیداش نکرد ارور میده و همه این عملیات در پس‌زمینه ی اندروید استودیو مادامی که ما کد مینویسیم در حال انجام هست. خب حالا یک نمونه از کلاس به نام Array Adapter ایجاد میکنم. این کلاس عضوی از پکیج android .widget هستش، و کلاسی هست که برای متصل کردن داده ها به لیست مورد نظر ما استفاده میشه، میشه گفت یک رابطی بین داده ها و لیست مدنظر ما هستش. باید به این Array Adapter یک نوع داده عمومی بدیم که تعیین کننده جنسیت یا نوع داده تک تک اعضای اون هستش. درواقع Array Adapter یک لیست از داده هاست که میخواییم داخل لیست ویومون قرار بدیم و اینجا بین این تگ ها باید جنسیت داده های داخلش رو بهش بدیم.

چون من با یک آرایه رشته ای کار میکنم و میخوام یک آرایه از رشته ها رو داخل لیست ویو قرار بدم، پس نوع داده String رو بهش میدم، و اسم این شی رو adapter میذارم. بعد، میام این شی adapter رو با استفاده از متد سازنده اش یعنی ArrayAdapter معرفی میکنم، خوب هست همینجا این نکته برنامه نویسی رو متذکر بشم که هر کلاسی که دارای متد سازنده باشه به این روش معرفی میشه، کلمه new و بعد متد سازنده اش رو که همون Array Adapter هست تایپ میکنم، نوع داده اش هم که همون String هست، همونطور که راهنمای اندروید استودیو نشون میده این کلاس نسخه های زیادی از سازنده داره من اونی رو که به بیشترین اطلاعات نیاز داره انتخاب میکنم. اول از همه مثل همیشه باید context یا محتوا کاری رو معرفی کنیم. که در واقع همین اکتیویتی جاری هستش، پس کلمه this رو که نشون دهنده همین اکتیویتی هست تایپ میکنم.

بعد، باید آیدی فایل لایوتی که میخوام آیتم های لیست ویوی من با اون چیدمان در لیست ویو قرار بگیرن رو بهش بدم، یعنی این لایوت مشخص کننده نحوه چیدمان ظاهری هر کدوم از اون آیتم های داخل لیست هستش. خب چون من خودم هیچ فایل لایوتی از قبل برای چیدمان آیتم ها نساختم، پس میام از فایل های لایوت موجود در اندروید SDK استفاده میکنم. برای اینکار همیشه با کلمه اندروید با حروف کوچک شروع میکنم، و بعد .R .

بعد از اون دنبال فایل لایوت میگردم، با تایپ .layout فایل خاصی که من اینجا قصد دارم استفاده کنم، اسمش simple_list_item_1 هستش. این فایل لایوت تنها شامل یک شی Text view خالی هستش. یعنی میخام آیتم های لیستم فقط اون متن خالی رو نشون بدن.

بیایید یک نگاهی به کدش بندازیم؛ با فشردن کلید های کنترل یا کامند به ترتیب در ویندوز و مک و کلیک رو این فایل میریم سراغ کدش. میبینید که فقط یک Text view تنها داره و مهمتر اینکه، آیدی این Text view، text1 هستش. توجه کنید که این آیدی با @android:id شروع شده. خب با دیدن این فک کنم متوجه شدید که چرا تو کد جاوا گفتم از فایل های موجود در SDK استفاده میکنم. برمیگردم به کدم. خب مقدار بعدی که باید وارد کنم آیدی Text view ای هستش که قرار هست رشته من رو در یک سطر نشون بده، و اون android.R.id.text1 هستش.

این آیدی رو در کد مربوط به فایل لایوت چند لحظه پیش مشاهده کردید و در آخر، باید اون شی ای که میخوام نمایش داده بشه رو وارد کنم. همون لیست مورد نظرم. این میتونه هم یک آرایه ساده از رشته ها باشه و هم لیست پیچیده از رشته ها. و من همون آرایه رشته ای که ایجاد کردم و اسمش را items گذاشتم رو وارد میکنم. حالا، آداپتر میدونه که چه داده هایی رو قرار هست استفاده کنه، و همینطور میدونه که چیدمان هر سطر از لیست مثل کدوم لایوت باید باشه، به علاوه آیدی Text view نمایش داده شده توی هر سطر هم میدونه.

خب حالا باید یک ارجاعی به شی لیست ویوم که جزیی از لایوتم هست داشته باشم. List View رو که نام کلاس هست تایپ میکنم، میتونید با فشردن ctrl +space با اطمینان از لیستی که باز میشه انتخابش کنید و به کلاس جاواتون ایمپورتش کنید. اسمش رو lv میذارم، و بعد find ViewById رو واسش فراخونی میکنم و آیدی لیست ویو رو بهش میدم. که R .id.listView هستش. و مثل همیشه برای اطمینان دادن از نوع بازگشتی اش به عنوان یک کلاس قابل قبول، کستش میکنم.

اگه واستون سوال شد که این آیدی رو از کجا آوردم، بهتون میگم که در واقع این آیدی از فایل لایوت ام اومده. وقتی من لیست ویو رو روی لایوت ام درگ کردم، این آیدی اتوماتیک برای لیست ویو ایجاد شد. خب نهایتاً حالا آماده ام تا آرایه ام رو به لیست ویو متصل کنم. و برای اون lv .setAdapter رو فراخونی میکنم، و شی آداپتر رو بهش میدم. پس میتونم کارهایی که کردم رو تو چهار جمله خلاصه کنم: گرفتن داده از منابع استرینگ، ساختن آداپتر، ارجاع دادن به لیست ویو و در آخر متصل کردن آداپتر به لیست ویو.

و از برنامه ران میگیرم تا نتیجه رو ببینیم. وقتی برنامه رو صفحه بالا میاد، متد onCreate() اجرا میشه و کدهای موجود در اون میرن که داده ها رو بگیرن و نمایش بدن. حالا وقتی من به گوشی ام در حالت عمودی نگاه میکنم، داده ها اسکرول نمیشن چون انقد زیاد نیستن که بیشتر از ظرفیت صفحه باشن. خب تلفنم رو میچرخونم و به حالت افقی در میارم خب حالا فقط بخشی از داده ها دیده میشن و میتونم با لمس صفحه نمایشم اسکرولش کنم و بقیه لیستم رو ببینم.

و بعدش هم به حالت عمودی برمیگردم. خب حالا یاد گرفتید که چطوری یک لیست از داده های قابل اسکرول در اندروید ایجاد کنید. با یک مجموعه داده شروع کردیم، که میتونست یک آرایه ساده یا یک لیست جاوا باشه، بعد ازش استفاده کردیم و با آداپتور و لیست ویو وارد لیستش کردیم.