در این آموزش قصد داریم به یادگیری recycler review می پردازیم قبل از اینکه به بررسی و آموزش ریسایکلر ویو در اندروید استودیو بپردازیم باید ببینیم که Recycler view چیست و برای چه کاری استفاده می شود.
اصلا Recycler view چیست؟
در اندروید استودیو های قدیمی ما گزینه ای به نام listview و gridview داشتیم که در نسخه 5 اندروید به بعد Recycler view که در حقیقت نسخه منعطف تر و بهتری از آن است معرفی شده است. در حقیقت در Recycler view برخلاف list view که یک مولفه برای شما کار میکرد. چندین مولفه برای شما کار میکنند. در Recycler view بر خلاف list view که تعداد محدودی از گزینه ها را داشتیم هیچ محدودیتی در تعداد گزینه های لیست خود نداریم و میتوانیم به سادگی تعداد بسیار زیادی از آیتم ها را درون آن قرار دهیم همچنین همگام استفاده از Recycler view می توانیم از اینیمیشن ها استفاده کنیم که زیبایی بیشتری به کار نهایی ما میدهد. این قابلیت ها باعث می شود Recycler view طراحی کاربر پسندانه تری به نرم افزار شما بدهد.
برای شروع به کار با Recycler view ما نیاز به دانستن موارد زیر داریم.
آداپتور Recycler view درحقیقت شامل یک شکل جدید از آداپتور است. روش کار آن بسیار مشابه با آداپتور هایی است که تا کنون استفاده میکردید اما نیاز به برخی ویژگی ها مانند viewholder دارد.
ریسایکلرویو برای نمونه سازی در حقیقت به یک layout manager و یک آداپتور نیاز دارد در حقیقت یک layout manager آیتم ها را درون Recycler view قرار میدهد و مشخص میکند که چه آیتم هایی در دید کاربر هستند و چه آیتم هایی خارج از دید کاربر هستند و دیگر در صفحه قابل مشاهده نیستند. در Recycler view ما سه نوع layout manage داخلی داریم. این سه نوع manager عبارتند از LinearLayoutManager که نشان دهنده لیست عمودی و افقی است. GridLayoutManager که نشان دهنده آیتم ها در گرید است و StaggeredGridLayoutManager که آیتم ها را در Staggered grid نشان می دهد.
لازم به ذکر است که در ورژن اخیر Support Library اگر به طور دقیق layout manager را تنظیم نکنید. ریسایکلر ویو نمایش داده نمی شود و یک ارور Logcat به شکل زیر به وجود می آید.
E/RecyclerView: No layout manager attached; skipping layout
آداپتور RecyclerView.ItemAnimator وظیفه Animate کردن تغییرات viewgorup مانند اضافه کردن و دیلیت کردن را دارد که به آداپتور اطلاع داده می شود. DefaultItemAnimator را می توان برای انیمیشن های پیش فرض استفاده کرد وبا استفاده از این انیمیشن ها بسیار خوب کار می کند.
برای استفاده از Recycler view باید مراحل زیر را انجام دهیم.
1. ابتدا Recycler view اندرویدx را به فایل gradle build اضافه میکنیم.
2. یک کلاس مدل را تعریف میکنیم تا به عنوان منبع داده ما استفاده شود.
3. یک RecyclerView را به activity خود اضافه میکنیم که آیتم ها را نمایش دهد.
4. یک فایل خام XML برای نمایش و ظاهر آیتم ها میسازیم.
5. یک RecyclerView.Adapter و یک ViewHolder برای رندر کردن آیتم ها میسازیم.
6. آداپتور ساخته شده را به منبع داده ها متصل میکنیم.
ابتدا باید شروع به نصب ریسایکلر ویو کنیم. برای شروع به کار ابتدا اطمینان حاصل کنید که کتابخانه Recycler view اندروید X به عنوان یک dependency در app/build.gradle قرار داشته باشد.
dependencies {
...
implementation 'androidx.recyclerview:recyclerview:1.1.0'
}
یعد از زدن کد بالا برروی Sync Project with Gradle filesکلیک کنید تا موارد مورد نیاز شما دانلود شود.
هر recycler view با استفاده از منبعی از داده ها پشتیبانی می شود. در این مورد ما یک کلاس contact را تعریف میکنیم که نشان دهنده مدل داده هایی است که در recycler view استفاده می شود.
public class Contact {
private String mName;
private boolean mOnline;
public Contact(String name, boolean online) {
mName = name;
mOnline = online;
}
public String getName() {
return mName;
}
public boolean isOnline() {
return mOnline;
}
private static int lastContactId = 0;
public static ArrayList<Contact> createContactsList(int numContacts) {
ArrayList<Contact> contacts = new ArrayList<Contact>();
for (int i = 1; i <= numContacts; i++) {
contacts.add(new Contact("Person " + ++lastContactId, i <= numContacts / 2));
}
return contacts;
}
}
در درون فایل لایوت اکتیویتی XML مورد نظر در res/layout/activity_users.xml بایستی recycler view را از Support library وارد کنیم.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rvContacts"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
در layout, preview میتوانیم RecyclerView درون فعالیت خود را ببینیم.
ساخت یک layout ردیفی
قبل از اینکه به ساخت Adaptor بپردازیم باید یک فایل XML ایجاد کنیم. این فایل XML در حقیقت برای هر ردیف لیست ما استفاده می شود. این آیتم layout باید شامل یک ردیف افقی به همراه یک اسم و دکمه باشد.
این layout میتواند از مسیر res/layout/item_contact.xml ساخته شود و هر ردیف را رندر بگیرد.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingBottom="10dp"
>
<TextView
android:id="@+id/contact_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<Button
android:id="@+id/message_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:textSize="10sp"
/>
</LinearLayout>
حال بعد از اینکه ساخت layout خود را به پایان رساندیم میتوانیم شروع به ساخت adaptor کنیم.
ساخت آداپتور
در اینجا نیاز به ساخت یک آداپتور داریم تا اطلاعات مارا درون ریسایکلر ویو نشر دهد. در حقیقت کار آداپتور تبدیل یک شی در یک مکان به لیستی ( ردیفی ) از آیتم ها برای قرار دهی اطلاعات است. لازم است این را بدانیم که آداپتور RecyclerView نیاز به وجود یک شی به نام ViewHolder دارد این View Holder در حقیقت نقش تعریف کننده و همچنین تهیه کننده دسترسی به همه view های درون یک ردیف را دارد. ما از طریق روش زیر میتوانیم به یک لیست آداپتور خالی و یک Holder در ContactsAdapter.java دسترسی پیدا کنیم.
// Create the basic adapter extending from RecyclerView.Adapter
// Note that we specify the custom ViewHolder which gives us access to our views
public class ContactsAdapter extends
RecyclerView.Adapter<ContactsAdapter.ViewHolder> {
// Provide a direct reference to each of the views within a data item
// Used to cache the views within the item layout for fast access
public class ViewHolder extends RecyclerView.ViewHolder {
// Your holder should contain a member variable
// for any view that will be set as you render a row
public TextView nameTextView;
public Button messageButton;
// We also create a constructor that accepts the entire item row
// and does the view lookups to find each subview
public ViewHolder(View itemView) {
// Stores the itemView in a public final member variable that can be used
// to access the context from any ViewHolder instance.
super(itemView);
nameTextView = (TextView) itemView.findViewById(R.id.contact_name);
messageButton = (Button) itemView.findViewById(R.id.message_button);
}
}
}
حال که آداپتور و view holder را تعریف کردیم میتوانیم آداپتور خود را پر کنیم. برای شروع میتوانیم یک member variable برای لیست مخاطبین خود ایجاد کرده و لیست را از طریق constructor انتقال دهیم.
public class ContactsAdapter extends
RecyclerView.Adapter<ContactsAdapter.ViewHolder> {
// ... view holder defined above...
// Store a member variable for the contacts
private List<Contact> mContacts;
// Pass in the contact array into the constructor
public ContactsAdapter(List<Contact> contacts) {
mContacts = contacts;
}
}
هر آداپتور دارای 3 متد اصلی است: onCreateViewHolder که آیتم مورد نظر را پر کرده و لایوت را بسازد. onBindViewHolder که وظیفه انجام تنظیمات ویژگی های نمایشی بر اساس داده ها را دارد و getItemCount که تعداد آیتم های مورد نمایش را میشمارد. برای اینکه این سه ویژگی را درون آداپتور خود بگنجانیم میتوانیم از کد زیر استفاده کنیم.
public class ContactsAdapter extends
RecyclerView.Adapter<ContactsAdapter.ViewHolder> {
// ... constructor and member variables
// Usually involves inflating a layout from XML and returning the holder
@Override
public ContactsAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
Context context = parent.getContext();
LayoutInflater inflater = LayoutInflater.from(context);
// Inflate the custom layout
View contactView = inflater.inflate(R.layout.item_contact, parent, false);
// Return a new holder instance
ViewHolder viewHolder = new ViewHolder(contactView);
return viewHolder;
}
// Involves populating data into the item through holder
@Override
public void onBindViewHolder(ContactsAdapter.ViewHolder holder, int position) {
// Get the data model based on position
Contact contact = mContacts.get(position);
// Set item views based on your views and data model
TextView textView = holder.nameTextView;
textView.setText(contact.getName());
Button button = holder.messageButton;
button.setText(contact.isOnline() ? "Message" : "Offline");
button.setEnabled(contact.isOnline());
}
// Returns the total count of items in the list
@Override
public int getItemCount() {
return mContacts.size();
}
}
حال که آداپتور ما کامل شده است میتوانیم به ترکیب داده ها و آداپتور بپردازیم.
ترکیب Adaptor و Recycler view
در این اکتیویتی و مشغول populate تعدادی sample user که باید در recycler view نمایش داده شود می شویم.
public class UserListActivity extends AppCompatActivity {
ArrayList<Contact> contacts;
@Override
protected void onCreate(Bundle savedInstanceState) {
// ...
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_users);
// Lookup the recyclerview in activity layout
RecyclerView rvContacts = (RecyclerView) findViewById(R.id.rvContacts);
// Initialize contacts
contacts = Contact.createContactsList(20);
// Create adapter passing in the sample user data
ContactsAdapter adapter = new ContactsAdapter(contacts);
// Attach the adapter to the recyclerview to populate items
rvContacts.setAdapter(adapter);
// Set layout manager to position the items
rvContacts.setLayoutManager(new LinearLayoutManager(this));
// That's all!
}
}
حال در پایان مراحل بالا باید لیستی به شکل زیر ببینید و اگر لیست شما به اندازه کافی آیتم داشته باشد به سادگی میتوانید بین آیتم ها scroll کنید. این scroll کردن بسیار سریع تر و روان تر از listview انجام می پذیرد.
در این آموزش دیدیم که چگونه میتوانیم یک recycler view را در اندروید استودیو ایجاد کرده و به شکلی که میخواهیم از آن استفاده کنیم.
اگر بخواهید از لیست های قابل اسکرول کردن در اپلیکیشن خود استفاده کنید بهترین راه استفاده از recycler view به جای list view است زیرا هنگامی که داده های درون لیست شما از تعدادی بیشتر می شوند حتی برای اسکرول در درون لیست هم ممکن است با استفاده از list view به مشکل بخورید.
اگر شما علاقه مند به برنامه نویسی اندروید هستید و کار با اندروید استودیو برایتان لذت بخش است پیشنهاد میکنیم مجموعه آموزش های اندروید سایت ما را بررسی کنید.
