Hướng dẫn toàn tập RecyclerView trong Android- Phần 1: Introduction

0
467
Bài này thuộc phần 1 của 3 phần trong series Hướng dẫn toàn tập RecyclerView trong Android

recyclerview-trong-android

Bạn rất hay nghe mọi người tuyên truyền về việc tái sử dụng/tái chế(recycling) một vật liệu gì đó. Từ rác đến sắt thép để đảm bảo hành tinh của chúng ta không bị ngập trong rác. Và trong lập trình cũng vậy, khái niệm tái sử dụng rất hay được sử dụng đặc biệt là các ngôn ngữ hướng đối tượng.

Các kỹ sư của Google cũng đã nghĩ về lợi ích của việc tái sử dụng(recycling) và nhận ra rằng Android cũng chạy hiệu quả hơn nếu các component có thể nó tái chế/tái sử dụng. Kết quả của nguồn cảm hứng đó là sự ra đời của RecylerView- một component được giới thiệu trong Android Lollipop.

Cũng giống như fragment, RecylerView có thể được gọi từ Android platform(hỗ trợ từ bản android L) hoặc từ support library( hỗ trợ cho các bản Android cũ từ 2.2 trở lên)

Trong tutorial này, mình sẽ giới thiệu với các bạn tất cả những kiến thức cần thiết về RecyclerView như:

  • Mục đích và khi nào sử dụng RecyclerView
  • Các thành phần cấu tạo của RecyclerView.
  • Cách thay đổi layout một RecyclerView.
  • Cách thêm những hiệu ứng cho RecyclerView của bạn.

Để cho bài viết dễ hiểu và hiệu quả, chúng ta sẽ vừa tìm hiểu vừa tiến hành code. Chúng ta sẽ xây dựng ứng dụng có tên là Galacticon(Khám phá thiên văn vũ trụ): Chức năng chính là lấy danh sách các ảnh thiên văn từ NASA website thông qua public API và hiển thị ra list bằng RecylerView(Cũng đơn giản phải không)

Chờ chút: Bạn nên có kiến thức cơ bản chút về lập trình cho Android với Kotlin trước khi đọc tutorial này. Nếu bạn cần ôn luyện lại, hãy xem lại các tutorial trước của mình nhé!
Ngoài ra, Bạn cũng cần Android Studio 3.0 hoặc mới hơn

Chúng ta bắt đầu nhé!

Bắt đầu với ứng dụng mẫu

Các bạn tải project với bộ khung mình thiết kế sẵn ở bên dưới  và mở nó trên Android Studio.

Nhấn nút Run > app và bạn sẽ thấy giao diện ứng dụng đơn giản như sau:

1-empty-app-1-281x500

Nó trống rỗng, tất nhiên. Chúng ta mới chỉ có bộ khung cho ứng dụng mà chưa code bất cứ thư gì. Mọi thứ sẽ dần dần được implement ở những bước tiếp theo. Nhưng trước hết, chúng ta phải có API để lấy ảnh từ NASA website đã.

Lấy API từ NASA website

Bạn sẽ sử dụng Astronomy Picture of the Day API một trong những webservices phổ biến nhất được cung cấp bởi NASA. Để đảm bảo tính bảo mật, service sẽ yêu cầu bạn có API key để có thể sử dụng nó trong ứng dụng.

Thật may mắn, cách lấy API key khá đơn giản. Bạn vào đây sau đó điền tên và địa chỉ email. Nhấn nút “Signup” và KEY sẽ xuất hiện trên màn hình như bên dưới

Lấy API key từ NASA website

Khi bạn đã có API key, hãy copy nó và mở strings.xm file trong dự án của bạn. Paste API key của bạn vào thẻ <api_key>, thay thế cho INSERT API KEY THERE.
4.-API_KEY-paste-700x296

RecyclerView là gì?

Bạn sẽ được bay vào vũ trụ để khám phá sự bao la của RecyclerViews, nhưng không có người chỉ huy tài năng nào tiếp những vị khách mà không có sự chuẩn bị. Bạn có câu hỏi và cần câu trả lời trước khi tiếp tục. Thế thì hãy coi phần này như phần tóm tắt nhiệm vụ của bạn.

Một RecyclerView có thể được hiểu như là sự kết hợp của ListView và GridView. Một trong những ưu điểm nổi trội của RecyclerView 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.

Nhưng làm thế nào nó có thể tốt hơn ListView va GridView cái mà đã được chứng minh và bạn đã khá quen? Hay nó có phải là một loại công nghệ lạ không?  Như thường lệ, những câu hỏi sẽ được trả lời một cách chi tiết ở phần sau.

Tại sao bạn lại cần đến RecyclerView?

Thử tưởng tượng bạn đang tạo ra một ListView mà ở đó các tùy chỉnh items layout bạn muốn hiển thị lại khá phức tạp. Bạn mất nhiều thời gian để tạo một layout cho từng item và rồi sử dụng layout đó trong các adapter của bạn.

Trong hàm GetView()trong Apdater, bạn cần inflate các item layout mới. Sau đó, bạn reference tất cả các views bên trong layout bằng việc sử dụng những unique ids( Id này bạn đã định nghĩa trong file XML). Khi đã làm xong, bạn phải chuyển view đó tới ListView và hiển thị lên màn hình. Tất cả quá trình liệu có tối ưu với project của bạn không?

Sự thật rằng ListView và GridView chỉ hoàn thành một nửa trong việc tối ưu bộ nhớ. Chúng tái sử dụng lại mỗi item layout, nhưng không giữ các tham chiếu cho các child layout, buộc bạn phải gọi hàm findViewByld()cho tất cả item layout của các child layout mỗi hàm getView()được gọi.

Tất cả lần gọi hàm này có thể trở thành những xử lí cực kì chuyên sâu (processor-intensive), đặc biệt với các layout phức tạp. Hơn nữa, tình huống đó có thể khiến việc scroll ListView trở nên giật, lag, thậm chí treo luôn ứng dụng. Vì sao ư? Vì nó đang điên cuồng cố lấy được các view mà bạn cần.

ListView-

Giải pháp hỗ trợ Listview/GridView mang tên View Holder pattern

Ban đầu, các kĩ sư Android đã cung cấp một giải pháp cho vấn đề này trên Android Developers  website với kỹ thuật smooth scrolling, thông qua View Holder pattern.

Với pattern này, bạn tạo ra một class dạng in-memory để tham chiếu tới tất cả các view mà bạn cần để hoàn thành layout của mình. Có thể hiểu đại khái tác dụng của pattern này là cache các tham chiếu và tái sử dụng chúng.

viewholder_new_larger

Vấn đề là View Holder pattern chỉ là option không bắt buộc trong ListView hay GridView. Nghĩa là nếu không có View Holder thì ListView hay GridView vẫn chạy được. Nếu trước đây bạn không apply pattern này thì đừng hỏi tại sao ListView của bạn lại chậm như vậy.

Như vậy, qua bài viết này, mình đã giới thiệu khái niệm RecylerView cũng như nhược điểm của ListView hay GridView mà từ đó chúng ta cần đến RecylerView. Bài viết tiếp theo mình sẽ hướng dẫn các bạn cách tạo Layout và Adapter để sử dụng được RecylerView. Các bạn chờ nhé!

Xem tiếp các bài trong Series
Phần kế tiếp: Hướng dẫn RecyclerView trong Android- Phần 2: Layout và Adapter

Bình luận. Đặt câu hỏi cũng là một cách học

avatar
  Theo dõi bình luận  
Thông báo