Android：创build一个带图片和文本的切换button

有没有可能在Android中创build一个图像，但没有文字的切换button？ 理想情况是这样的：

我见过类似的post，其中的答案是改变背景，但我想保留Holo Light布局，只是交换与图像的文字。

我需要能够编程改变图像源，

任何想法，我会如何做到这一点？

如果不能这样做，有没有办法让一个正常的button切换开关？

Answer 1

1. 我可以用图像replace切换文本吗？

   不，我们不能，虽然我们可以隐藏文本，但是仍然不会给我们一个切换button，因为我们不能用图像replace文本。

2. 我怎样才能做一个正常的切换button

   在res/drawable文件夹中创build一个文件ic_toggle

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

   这里@drawable/ic_slide_switch_on ＆ @drawable/ic_slide_switch_off是您创build的图像。

   然后在同一个文件夹中创build另一个文件，将其命名为ic_toggle_bg

    <?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_toggle" /> </layer-list> 

   现在添加到您的自定义主题（如果您没有在res/values/文件夹中创buildstyles.xml文件）

    <style name="Widget.Button.Toggle" parent="android:Widget"> <item name="android:background">@drawable/ic_toggle_bg</item> <item name="android:disabledAlpha">?android:attr/disabledAlpha</item> </style> <style name="toggleButton" parent="@android:Theme.Black"> <item name="android:buttonStyleToggle">@style/Widget.Button.Toggle</item> <item name="android:textOn"></item> <item name="android:textOff"></item> </style> 

   这会为您创build一个自定义切换button。

3. 如何使用它

   在视图中使用自定义样式和背景。

     <ToggleButton android:id="@+id/toggleButton" android:layout_width="wrap_content" android:layout_height="match_parent" android:layout_gravity="right" style="@style/toggleButton" android:background="@drawable/ic_toggle_bg"/> 

Answer 2

ToggleButton从TextViewinheritance，因此您可以将drawables设置为在文本的4个边框处显示。 您可以使用它来显示您想要在文本顶部的图标，并隐藏实际的文字

 <ToggleButton android:id="@+id/toggleButton1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:drawableTop="@android:drawable/ic_menu_info_details" android:gravity="center" android:textOff="" android:textOn="" android:textSize="0dp" /> 

结果与普通ToggleButton相比看起来像

秒选项是使用ImageSpan实际上用图像replace文本。 看起来稍微好点，因为图标是在正确的位置，但不能直接使用layout xml来完成。

你创build一个普通的ToggleButton

 <ToggleButton android:id="@+id/toggleButton3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="false" /> 

然后编程设置“文本”

 ToggleButton button = (ToggleButton) findViewById(R.id.toggleButton3); ImageSpan imageSpan = new ImageSpan(this, android.R.drawable.ic_menu_info_details); SpannableString content = new SpannableString("X"); content.setSpan(imageSpan, 0, 1, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE); button.setText(content); button.setTextOn(content); button.setTextOff(content); 

中间图标的结果稍微低一点，因为它取代了文本。

Answer 3

在res / drawable中创buildtoggle_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> 

将select器应用于切换button

 <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

我知道这有点晚，但是对于任何感兴趣的人，我已经创build了一个基本上是切换图像button的自定义组件，drawable可以具有状态以及背景

https://gist.github.com/akshaydashrath/9662072