Bài hướng dẫn sử dụng tab trong android hôm nay sẽ trình bày cho các bạn cách tạo tab kết hợp fragment một cách linh hoạt.

Như các bạn đã biết,  trong bài học Tab trong android chúng tôi đã giới thiệu về tab cũng như một số lưu lưu ý khi sử dụng tab và phân loại tab.

Những thứ các bạn cần chuẩn bị là phần mềm Android Studio mới nhất (Tại thời điểm viết bài này, chúng tôi sử dụng Android Studio 3.0). Nào chúng ta cùng bắt tay vào thực hiện nhé! Bài hướng dẫn sẽ tạo 2 tab.

Hướng dẫn sử dụng tab trong android – Tạo Android Project

Mở Android Studio -> chọn File -> chọn New -> chọn New Project. Khi màn hình Create New Project xuất hiện hãy nhập tên ứng dụng (Application Name), chỉ định nơi lưu source code (Project location) -> chọn Next

Ở màn hình Create New Project, chọn Phone and Table, chọn phiên bản Android -> chọn Next

Ở màn hình kế tiếp, hãy chọn Tabbed Activity -> chọn Next

Hãy chọn Action Bar Tabs (with ViewPager) tại Navigation Style -> chọn Finish

Hướng dẫn sử dụng tab trong android – Thay đổi project sau khi tạo

1/ Xóa fragment_main.xml (Chuột phải fragment_main.xml -> chọn Delete)

2/ Thay đổi code của MainActivity.java. Code sau khi thay đổi giống như hình bên dưới

3/ Mở activity_main.xml, xóa tất cả TabItem và FloatingActionButton

Xóa TabItem

Xóa FloatingAtionButtion

Hướng dẫn sử dụng tab trong android – Thiết kế tab

Thiết kế tab thứ nhất

Tạo fragment: Chuột phải project -> chọn New -> chọn Fragment -> chọn Fragment (Blank)

– Nhập tên tại Fragment Name

– Bỏ chọn Include fragment factory methods? và Include interface callbacks?

Thiết kế layout cho tab

Mở fragment_tab1.xml và chuyển layout về dạng ConstraintLayout (chuột phải FrameLayout -> chọn Convert FrameLayout to ConstraintLayout)

Thay đổi layout như sau

Thiết kế tab thứ hai

Thực hiện tương tự như cách tạo tab thứ nhất.

Sau khi thưc hiện xong các bước trên, kết quả như hình bên dưới

Hướng dẫn sử dụng tab trong android – Viết code

1/ Tạo một class tên TabAdapter (Chuột phải lên package -> chọn New -> chọn Java Class -> nhập TabAdapter -> chọn OK)

Viết code. Bạn đọc tải full code TabAdaper

2/ Viết code cho lớp Tab1Fragment (Xử lý của Tab thứ nhất). Thay đổi xử lý của phương thức onCreateView() như hình

3/ Thực hiện tương tự cho lớp Tab2Fragment

4/ Viết code cho lớp MainActivity tại phương thức onCreate()

Hướng dẫn sử dụng tab trong android – Build và run

1/ Tab thứ nhất

Khi chọn vào button Say Hello, một thông báo dạng Toast được hiển thị

2/ Tab thứ hai

3/ Kết luận

Chúng tôi đã hướng dẫn xong cách tạo tab trong Android sử dụng Fragment kết hợp ViewPager. Mỗi một tab tương ứng cho một Fragment. Mỗi Fragment có layout và xử lý riêng, điều này cho phép chúng ta linh hoạt trong xử lý cho mỗi tab.