[Android Cơ Bản] Selector trong Android

Hi các em trong bài ngày hôm nay, thầy hướng dẫn các em cách tùy biến giao diện của Button với Selector nhé

Như các bạn biết, Button là thành phần giao diện cơ bản trong lập trình Android và khi triển khai 1 dự án Android, lập trình viên thường xuyên cần thay đổi giao diện mặc định của Button sao cho phù hợp với thiết kế của khách hàng. Trước khi cùng tìm hiểu cách tùy biến giao diện button. chúng ta cùng xem cấu trúc của button thông thường ntn.

Cấu trúc của 1 Button thường như sau :

normal : trạng thái hiển thị bình thường
pressed : trạng thái khi bấm
disabled : trạng thái nút khi bị khóa chắc năng bấm ( ví dụ : button.setEnabled(false) )

Ngoài ra còn 1 số trạng thái khác như focused, checked … với các biến thể của button như checkbox, switch …

Android SDK cung cấp 1 cấu trúc file xml để chúng ta định nghĩa trạng thái của 1 button với các ảnh dạng png hoặc png 9-patch như sau :
File xml này được lưu trong thư mục drawable của dự án
File xml được tạo bằng cách bấm chuột phải vào thư mực drawable -> Drawable Resource File với root Element là selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/button_pressed"
          android:state_pressed="true" />
    <item android:drawable="@drawable/button_focused"
          android:state_focused="true" />
    <item android:drawable="@drawable/button_normal" />
</selector>

Chúng ta chuẩn bị 3 ảnh png cùng kích thước vs màu sắc khác nhau lần lượt là button_pressed, button_focused, button_normal copy vào thư mục drawable

Kế tiếp, sử dụng file selector vừa tạo gán vào Button như sau :

  <Button
        android:id="@+id/imageButtonSelector"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/new_button" />
// btn_selector là tên file selector tạo ban nãy 

Chạy thử ta được kết quả :

Link code hoàn chỉnh : https://github.com/huuhuybn/BtnSelector

Ngoài ra các em có thể tham khảo 1 số website hỗ trợ công cụ tự sinh file selector :
https://tdscientist.github.io/button4Android/
từ khóa google tìm : selector android generator