Nút tùy chỉnh nút chuyển đổi Android

Question

Tôi đã cố gắng tùy chỉnh giao diện nút chuyển đổi nhưng không thành công. Dưới đây là cách tôi muốn nó trông giống như:

Ai đó có thể cho tôi một hướng dẫn?

Answer 1

Tạo selector

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@drawable/btn_da" android:state_checked="true"/> 
    <item android:drawable="@drawable/btn_nu"/> 
</selector> 

và sử dụng nó làm nền cho ToggleButton của bạn.

Answer 2

Tôi nghĩ bạn cần xác định nền tùy chỉnh cho nút của mình. Hãy xem Hướng dẫn dành cho nhà phát triển về tùy chỉnh Button's background.

Tuy nhiên, trong bước Ba, Tạo một file XML mới trong res/drawable/ directory Sử dụng Xml này:

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@drawable/button_da" 
      android:state_checked="true" /> 
    <item android:drawable="@drawable/button_nu" /> 
</selector> 

Yếu tố android:state_checked="true" là những gì định nghĩa rằng nhà nước như là nền tảng kiểm tra.

Hãy cho tôi biết nếu điều này phù hợp với bạn.

Answer 3

tạo toggle_selector.xml trong res/drawable

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:drawable="@drawable/toggle_on" android:state_checked="true"/> 
    <item android:drawable="@drawable/toggle_off" android:state_checked="false"/> 
</selector> 

áp dụng bộ chọn nút Toggle bạn

<ToggleButton 
      android:id="@+id/chkState" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:background="@drawable/toggle_selector" 
      android:textOff="" 
      android:textOn=""/> 

Lưu ý: để loại bỏ các văn bản tôi sử dụng sau trong mã trên

textOff="" 
textOn="" 

Answer 4

Tôi không biết đây có phải là giải pháp tốt nhất hay không nhưng nó hoạt động tốt cho tôi:

1.- Quyết định mức độ bạn muốn nút bật tắt. Trong trường hợp của tôi chiều rộng 56dp và chiều cao 76dp.

2.- Tạo biểu tượng thiết lập 56px 76px-cho mdpi, 84px-113px hdpi, tương tự cho xhdpi và xxhdpi

3.- Di chuyển các biểu tượng trong thư mục drawable tương ứng. Trong trường hợp của tôi 20 biểu tượng 5 trong mỗi thư mục, đặt tên ic_name1_on, ic_name1_off [...] ic_name5_off

4.- Tạo các file xml sau trong đối tượng vẽ được thư mục mới có tên gọi (nếu nó chưa hề tồn tại):

• ic_name1_toggle.xml
• ic_name1_toggle_bg.xml
• ic_name2_toggle.xml
• (...)
• ic_name5_toggle_bg.xml

5.- Trong ic_name1_toggle.xml mã phải:

<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item 
     android:state_checked="false" 
     android:drawable="@drawable/ic_name1_off" /> 
    <item 
     android:state_checked="true" 
     android:drawable="@drawable/ic_name1_on" /> 
</selector> 

6.- Trong ic_name1_toggle_bg.xml mã phải:

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
    <item android:id="@+android:id/background" 
     android:drawable="@android:color/transparent" /> 
    <item android:id="@+android:id/toggle" 
     android:drawable="@drawable/ic_name1_toggle" /> 
</layer-list> 

7.- Cuối cùng trong Layout.xml của bạn:

<ToggleButton 
       android:id="@+id/toggleButton1" 
       android:layout_width="56dp" 
       android:layout_height="76dp" 
       android:background="@android:color/transparent" 
       android:button="@drawable/ic_name1_toggle_bg" 
       android:textOff="" 
       android:textOn="" />