Android 将 ImageButton 设置为 Toggle

Android Set ImageButton as Toggle

提问by Kleptine

How can I have an imagebutton stay in the 'pressed' state when it is clicked? Basically I just want the background to be the depressed background, but I can't figure out how to set it. At the moment, I've just copied the selected button background into my res folder, but when I set it as the background, it becomes blurry (since the original image is bigger than the button itself).

单击图像按钮时，如何让图像按钮保持“按下”状态？基本上我只是想让背景成为郁闷的背景，但我不知道如何设置它。目前，我刚刚将选定的按钮背景复制到我的 res 文件夹中，但是当我将其设置为背景时，它变得模糊（因为原始图像比按钮本身大）。

Normal Background: alt text http://img707.imageshack.us/img707/9199/ss20100426163452.pngWhat I'm getting: alt text http://img707.imageshack.us/img707/912/ss20100426163357.pngalt text http://img3.imageshack.us/img3/8304/ss20100426163623.png

普通背景： 替代文本 http://img707.imageshack.us/img707/9199/ss20100426163452.png我得到的是： 替代文本 http://img707.imageshack.us/img707/912/ss201004261633357.png alt text ://img3.imageshack.us/img3/8304/ss20100426163623.png

Also I don't believe I can actually use this method considering the many different UI layouts. The button should stay pressed as per the UI the user is using.

此外，考虑到许多不同的 UI 布局，我不相信我真的可以使用这种方法。该按钮应根据用户使用的 UI 保持按下状态。

回答by Roman Nurik

There are a few ways of doing this:

有几种方法可以做到这一点：

First, you can simply use an ImageButton, and manually toggle its image drawable on click in Java. This is what the stock Music playeron Android does for the shufflebutton, for example. Although you won't have control over the button background in its checked state, you'll be able to swap out the image, which may be favorable from an Android UI-consistency perspective.

首先，您可以简单地使用ImageButton, 并在 Java 中单击时手动切换其可绘制的图像。例如，这就是Android上的股票音乐播放器对按钮所做的shuffle。尽管您无法控制处于选中状态的按钮背景，但您可以换出图像，从 Android UI 一致性的角度来看，这可能是有利的。

Another option is to use a complex set of drawables and nine-patches to get an image inside a ToggleButton, with the option of changing the background and/or the image resource upon toggle. That's the option I'll show below. But remember, be cautious about UI consistency before doing this.

另一种选择是使用一组复杂的可绘制对象和九个补丁来获取 . 中的图像ToggleButton，并可以选择在切换时更改背景和/或图像资源。这就是我将在下面展示的选项。但请记住，在执行此操作之前要注意 UI 的一致性。

---

---

res/layout/foo.xml

res/layout/foo.xml

...
<ToggleButton
    android:textOn="" android:textOff=""
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/shuffle_button" />
...

res/drawable/shuffle_button.xml

res/drawable/shuffle_button.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- use "@android:drawable/btn_default" to keep consistent with system -->
    <item android:drawable="@drawable/toggle_button_background" />
    <item android:drawable="@drawable/shuffle_button_image" />
</layer-list> 

res/drawable/toggle_button_background.xml

res/drawable/toggle_button_background.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- checked state -->
    <item android:state_pressed="false" android:state_checked="true"
          android:drawable="@drawable/btn_default_checked" />

    <item android:state_window_focused="false" android:state_enabled="true"
          android:drawable="@drawable/btn_default_normal" />
    <item android:state_window_focused="false" android:state_enabled="false"
          android:drawable="@drawable/btn_default_normal_disable" />
    <item android:state_pressed="true"
          android:drawable="@drawable/btn_default_pressed" />
    <item android:state_focused="true" android:state_enabled="true"
          android:drawable="@drawable/btn_default_selected" />
    <item android:state_enabled="true"
          android:drawable="@drawable/btn_default_normal" />
    <item android:state_focused="true"
          android:drawable="@drawable/btn_default_normal_disable_focused" />
    <item android:drawable="@drawable/btn_default_normal_disable" />
</selector>

res/drawable/shuffle_button_image.xml

res/drawable/shuffle_button_image.xml

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

Image files

图像文件

• btn_default_<state>.9.pngcan be found in frameworks/base.gitunder core/res/res/drawable-hdpiand core/res/res/drawable-mdpi(also ldpi).

• btn_default_<state>.9.png可以frameworks/base.git在core/res/res/drawable-hdpi和 core/res/res/drawable-mdpi（也是 ldpi）下 找到。

WARNING: if you use these, your app will look inconsistent on devices with customized OS UIs (i.e. HTC's Sense UI).

警告：如果您使用这些，您的应用程序在具有自定义操作系统 UI（即 HTC 的 Sense UI）的设备上看起来会不一致。

• ic_mp_shuffle_<state>_btn.9.pngneed to be nine-patches, so that the image gets centered and not stretched to fit the button. Below are example hdpiversions of the icon:

• ic_mp_shuffle_<state>_btn.9.png需要九个补丁，以便图像居中而不是拉伸以适合按钮。以下是hdpi图标的示例版本：

res/drawable-(h|m|ldpi)/ic_mp_shuffle_(on|off)_btn.9.png

res/drawable-(h|m|ldpi)/ic_mp_shuffle_(on|off)_btn.9.png

---

---

Final Note: Remember to be consistent with the system UI when possible, and be mindful of the fact that your app may run on devices with customized versions of the OS that have different graphics for UI elements like buttons. An example of this is HTC Sense, which has green buttons in place of the grey/orange/yellow ones in stock Android. So, if you end up copying the btn_default_...PNG files from the open source repository to create a toggle-able button background, you'll break consistency on those devices.

最后注意事项：请记住尽可能与系统 UI 保持一致，并注意您的应用程序可能会在具有自定义版本操作系统的设备上运行，这些设备具有不同的 UI 元素（如按钮）图形。这方面的一个例子是HTC Sense，它有绿色按钮代替库存 Android 中的灰色/橙色/黄色按钮。因此，如果您最终btn_default_...从开源存储库复制PNG 文件以创建可切换的按钮背景，则会破坏这些设备上的一致性。