Android切換按鈕自定義外觀

Question

我一直在嘗試自定義切換按鈕的外觀，但沒有成功。 這裏是我希望它看起來像：

有人可以給我一個教程？

Answer 1

創建選擇

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

，並以此爲背景的切換按鈕。

Answer 2

我認爲你需要爲你的按鈕定義一個自定義背景。 查看定製Button's background的開發者指南。

然而，在步驟三，在使用res/drawable/ directory創建一個新的XML文件，這個XML：

<?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> 

元素android:state_checked="true"是什麼定義了狀態檢查的背景。

讓我知道這是否適合你。

Answer 3

創建資源toggle_selector.xml /繪製

<?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> 

選擇適用於您的切換按鈕

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

注：除去我使用的文本在上面的代碼下面

textOff="" 
textOn="" 

Answer 4

我不知道這是最好的解決方案，但它對我來說工作得很好：

1.-決定你想要多大的切換按鈕。在我的情況下寬度56dp和高度76dp。

2.-創建圖標集56px-76px爲MDPI，84px-113px HDPI，同樣爲xhdpi和xxhdpi

3.-移動圖標在相應的可繪製的文件夾。在我的情況下20個圖標5每個文件夾中，名爲ic_name1_on，ic_name1_off [...] ic_name5_off

4.-在一個新的文件夾，名爲繪製創建下面的XML文件（如果不存在的話）：

• ic_name1_toggle.xml
• ic_name1_toggle_bg.xml
• ic_name2_toggle.xml
• （...）
• ic_name5_toggle_bg.xml

5.- In ic_name1_toggle。XML的代碼必須是：

<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.-在ic_name1_toggle_bg.xml代碼必須是：

<?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.-最後在layout.xml：

<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="" />