RecyclerView trong Android

I. Tổng quan

RecyclerView là một ViewGroup mới, nó là sự kế thừa và nâng cao của ListView và GridView được hỗ trợ trong support-v7 version. Một trong những ưu điểm nổi trội của Recycler là nó có khả năng mở rộng tốt hơn, nó có thể hiển thị dữ liệu theo cả chiều ngang và chiều dọc.

Để làm việc với Recycler bạn cần biết một số phương thức sau đây.

• RecyclerView.Adapter dùng để thu thập và hiển tRequired ViewHolder in Adapters hị dữ liệu lên View.
• LayoutManager dhỉ định chiều hiển thị của 1 Item ( theo chiều ngang hay dọc ).
• ItemAnimator Dùng để sét hiệu úng chuyển động.

A. So sánh khác biệt với ListView

RecyclerView khác với người tiền nhiệm của nó ListView chủ yếu là do các tính năng sau:

• Required ViewHolder in Adapters ListView không yêu cầu bắt buộc sử dụng ViewHolder để cải thiện hiệu suất. Ngược lại khi bạn sử dụng RecyclerView thì điều đó là bắt buộc.
• Customizable Item Layouts Để hiển thị dữ liệu theo chiều ngang thì bạn không thể sử dụng ListView mà bạn cần đến HorizontalScrollView. Nhưng với Recycler thì chúng ta có tùy chọn RecyclerView.LayoutManager để chỉ định cách hiển thị dữ liệu.
• Easy Item Animations ListView thì không cho phép bạn xử lý trực tiếp hiệu ứng mà bạn phải thông qua 1 Animation bổ sung, còn trong RecyclerView thì nó được tích hợp luôn trong RecyclerView.ItemAnimator
• Manual Data Source ListView có 2 Adapter để bạn có thể tùy chỉnh điều hướng dữ liệu là ArrayAdapter vàCursorAdapter, còn với RecyclerView thì bạn bắt buộc phải sử dụng RecyclerView.Adapter.
• Manual Item Decoration ListView sử dụng android:divider để ngăn cách các danh mục trong danh sách. Ngược lại, RecyclerView yêu cầu sử dụng một đối tượng RecyclerView.ItemDecoration để thiết lập nhiều hiệu ứng giữa các Item.
• Manual Click Detection ListView cung cấp cho bạn interface AdapterView.OnItemClickListener để lắng nghe sự kiện khi bạn click vào 1 Item trên danh sách. Nhưng RecyclerView chỉ hỗ trợRecyclerView.OnItemTouchListener để quản lý sự kiện chạm tay vào màn hình mà không quản lý sự kiện nhấp chuột.

II. Các thành phần trong RecyclerView

LayoutManagers

Một RecyclerView cần phải có một layout manager và adapter được cài đặt. Vị trí và cách sắp xếp Item trongRecyclerView được quyết định bởi Layout Manager. RecyclerView cung cấp cho người lập trình 3 LayoutManager sau:

• LinearLayoutManager hiển thị Item theo chiều ngang hay chiều dọc như Scroll list.
• GridLayoutManager hiển thị Item theo kiểu Grid
• StaggeredGridLayoutManager hiển thị Item theo tùy kích thước của Item trong Grid.

Để khởi tạo Layout Manager bạn cần kế thừa lớp RecyclerView.LayoutManager

RecyclerView.Adapter RecyclerView includes một adapter mới. Nó cũng gần giống như những gì bạn đã làm với các Adapter cũ, nhưng nó một số đặc tính riêng như là bắt buộc sử dụng ViewHolder. Bạn sẽ cần ghi đè 2 phương thức chính, 1 là để định nghĩa VIew và ViewHolder 2 là để chuyển dữ liệu tới View.

ItemAnimator RecyclerView.ItemAnimator là một animation của ViewGroup, mọi hành động thêm/sửa/xóa đều được thông báo cho Adapter. DefaultItemAnimator được sử dụng như là 1 Animation mặc định và hoạt động khá tốt.

Sử dụng RecyclerView

Sử dụng *RecyclerView cần làm những bước sau:

• Thêm thư viện Recycler vào gradle build file.
• Định nghĩ một Moldel class để sử dụng cho Adapter.
• Thêm RecyclerView vào Activity để hiển thị Item*.
• Tạo một custom layout để định nghĩa cách dữ liệu hiển thị.
• Tạo Recycler.Adapter và ViewHolder để trả về cách hiển thị Item.
• Rằng buộc Adapter và nguồn dữ liệu vào RecyclerView.

1. Cài đăt Chắc chắn rằng các thư viện hỗ trợ RecyclerView được thêm vào app/build.gradle. 

Click Sync Project with Gradle files để IDE tìm và download các tài nguyên phù hợp.

2.Định nghĩa Models

Mỗi RecyclerView được hỗ trợ bởi một nguồn dữ liệu. Trong ví dụ này tôi sẽ xác định một Contact lớp đại diện cho các mô hình dữ liệu được trình bày bởi các RecyclerView.

Java



















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;
    }
}

3. Khởi tạo RecyclerView với Layout

Mở Layout res/layout/activity_users.xml và thêm RecyclerView từ thư viện hỗ trợ.

XML



















<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
​
    <android.support.v7.widget.RecyclerView
      android:id="@+id/rvContacts"
      android:layout_width="match_parent"
      android:layout_height="match_parent" />
​
</RelativeLayout>

4. Khởi tạo Custom Row Layout

Tạo file res/layout/item_contact.xml để render ra 1 Item trong hàng.

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>

Sau khi tạo Custom layout bây giờ công việc tiếp theo là tạo 1 RecyclerView.Adapter để chuyển dữ liệu lên View để hiển thị.

5. Khởi tạo RecyclerView.Adapter

Ở đây tôi tạo 1 RecyclerView.Adapter để chuyển dữ liệu và RecyclerView. Vai trò của Adapter là chuyển đổi 1 đối tượng dữ liệu được định nghĩa trước vào từng hàng của View. Tuy nhiên với một RecyclerView adapter đòi hỏi sự tồn tại của một "ViewHolder". Chúng ta có thể tạo một Adapter cơ bản và HolderView cùng nhau trongContactsAdapter.java.

Java



















public class ContactsAdapter extends 
    RecyclerView.Adapter<ContactsAdapter.ViewHolder> {
​
    public static class ViewHolder extends RecyclerView.ViewHolder {
​
        public TextView nameTextView;
        public Button messageButton;
​
        public ViewHolder(View itemView) {
​
            super(itemView);
            nameTextView = (TextView) itemView.findViewById(R.id.contact_name);
            messageButton = (Button) itemView.findViewById(R.id.message_button);
        }
    }
}

Bây giờ chúng ta đã định nghĩa xong một Adapter cơ bản và một HolderView. Bây giờ ta có thể bắt đầu chuyển dữ liệu vào trong Adapter. Đầu tiên cần đĩnh nghĩa 1 list các danh sách và truyền danh sách từ nơi gọi hàm bằng Constructor.

Java




















public class ContactsAdapter extends 
    RecyclerView.Adapter<ContactsAdapter.ViewHolder> {
​
    // ... view holder defined above...
​
    private List<Contact> mContacts;
​
    // Pass in the contact array into the constructor
    public ContactsAdapter(List<Contact> contacts) {
        mContacts = contacts;
    }
}

Mỗi Adapter cần 3 phương thức chính:

• onCreateViewHolder - Định nghĩa các Item layout và khởi tạo Holder.
• onBindViewHolder - Thiết lập các thuộc tính của View và dữ liệu.
• getItemCount - Đếm số Item trong List Data.

Java




















public class ContactsAdapter extends 
    RecyclerView.Adapter<ContactsAdapter.ViewHolder> {
​
    // ... constructor and member variables
​
    @Override
    public ContactsAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        Context context = parent.getContext();
        LayoutInflater inflater = LayoutInflater.from(context);
​
        View contactView = inflater.inflate(R.layout.item_contact, parent, false);
​
        ViewHolder viewHolder = new ViewHolder(contactView);
        return viewHolder;
    }
​
    @Override
    public void onBindViewHolder(ContactsAdapter.ViewHolder viewHolder, int position) {
​
        Contact contact = mContacts.get(position);
​
        TextView textView = viewHolder.nameTextView;
        textView.setText(contact.getName());
​
        Button button = viewHolder.messageButton;
​
        if (contact.isOnline()) {
            button.setText("Message");
            button.setEnabled(true);
        }
        else {
            button.setText("Offline");
            button.setEnabled(false);
        }
​
    }
​
    // Return the total count of items
    @Override
    public int getItemCount() {
        return mContacts.size();
    }
}

Sau khi đã hoàn thành Adapter thì nó đã sẵn sàng cho việc đẩy dữ liệu lên RecyclerView.

6. Chuyển dữ liệu từ Adapter lên RecyclerView.

Trong Activity. Tôi sẽ tạo sẵn một List dữ liệu để hiển thị lên RecyclerView.

Java



















public class UserListActivity extends AppCompatActivity {
​
     ArrayList<Contact> contacts;
​
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         // ...
         // 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!
     }
}

Sau khi hoàn thành hãy thử Build ứng dụng. 

Trong phần này tôi đã giới thiệu cơ bản về RecyclerView và cách sử dụng để Bind Data lên RecyclerView. Trong phần sau tôi sẽ hướng dẫn bạn tủy chỉnh RecyclerView với nhiều tùy biến hơn.

Link bài viết gốc : https://guides.codepath.com/android/using-the-recyclerview#binding-the-adapter-to-the-recyclerview

Nguồn tham khảo: 
https://viblo.asia/huyquyet/posts/lA7GKwbWGKZQ