为ToggleButton设置图像源

Question

为ToggleButton设置图像源

15

我有一个30px x 30px的png文件，希望将其作为android:src而不是android:background使用。如果将其用作背景，并且在高度和宽度都设置为"wrap_content"，则最终结果看起来更像是45px x 45px。

理想情况下，我需要一个ImageButton和ToggleButton的结合体。我希望具备设置android:src的ImageButton功能以及自动保存状态的切换功能。

有什么解决方案或变通方法吗？

TIA。

嗨，创建另一个样式似乎没有帮助。src仍然比其原始的30px x 30px要大得多。

在main.xml中：

<ToggleButton android:id="@+id/blah"
    style="@style/myToggle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
</ToggleButton>

在 Styles.xml 中。

<style name="myToggle">
    <item name="android:textOn">""</item>
    <item name="android:textOff">""</item>
    <item name="android:disabledAlpha">?android:attr/disabledAlpha</item>
    <item name="android:background">@drawable/my_btn_toggle_bg</item>
</style>

在我的 my_btn_toggle_bg.xml 文件中

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@+id/myBackground" android:drawable="@android:drawable/btn_default_small" />
    <item android:id="@+id/myToggle" android:drawable="@drawable/my_btn_toggle" />
</layer-list>

在my_btn_toggle.xml文件中

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

playbutton.png和pausebutton.png每个都是30px x 30px。但是当我在设备上查看时，它们看起来要大得多。

- VJ Vélan Solutions

5个回答

6

我知道如何做到这一点（在一个大的ToggleButton中居中显示一个较小的背景图像），使用ScaleDrawable：

将您的ToggleButton设置为使用选择器Drawable，与正常情况下相同：

<selector xmlns:android="http://schemas.android.com/apk/res/android"
    android:variablePadding="true">
    <item android:drawable="@drawable/ic_star_selected_centered"
          android:state_checked="true" />
    <item android:drawable="@drawable/ic_star_default_white_centered"
          android:state_pressed="true" />
    <item android:drawable="@drawable/ic_star_default_black_centered" />
</selector>

然后，为每个项目的可绘制项创建一个ScaledDrawable，指向您的实际图像文件。例如，ic_star_selected_centered.xml：

<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/ic_star_selected"
    android:scaleGravity="center"
    android:scaleHeight="100%"
    android:scaleWidth="100%" 
     />

最后，安卓存在一个问题，会导致任何缩放的Drawable在一开始都是不可见的，直到你设置它们的级别。因此，在填充视图时，请调用setLevel()函数，取值范围为1-10000（1表示最小缩放，10000表示全尺寸）：

    StateListDrawable star = (StateListDrawable) myToggleButton.getBackground();
    star.setLevel(5000); // centers the image at half size. shame on Android for using magic numbers!

- phreakhead

1

我需要使用你的解决方案，但我不明白你在哪里使用了ScaleDrawable。你能给我们提供整个解决方案吗？ - Jorge Gil

好的，我明白了，对我来说完美地运作。给你点赞！ :-) - Jorge Gil

1

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true">
        <inset android:insetLeft="15dp" android:insetRight="15dp" android:insetTop="15dp" android:insetBottom="15dp">
            <bitmap android:src="@drawable/ic_star_selected_centered" />
        </inset>
    </item>

    <item android:state_pressed="true" >
        <inset android:insetLeft="15dp" android:insetRight="15dp" android:insetTop="15dp" android:insetBottom="15dp">
            <bitmap android:src=" android:src="@drawable/ic_star_default_white_centered" />
        </inset>
    </item>

    <item >
        <inset android:insetLeft="15dp" android:insetRight="15dp" android:insetTop="15dp" android:insetBottom="15dp">
            <bitmap android:src="@drawable/ic_star_default_black_centered" />
        </inset>
    </item>
</selector>

- Alex Cohn

0

除了@caseyB所说的（请看评论），我不得不改变活动的主题以达到预期的效果。我认为这是HoneyComb Xoom上的一个问题，可能在手机上看不到。感谢大家查看我的问题并提供帮助。

- VJ Vélan Solutions

-1

“快速且简单”的实现方法是使用相对布局，并将您的ImageView放置在ToggleButton之上。设置android:layout_centerInParent="true"，并在toggle上设置您的onClick监听器。

话虽如此 - CaseyB提供的另一种解决方案（自定义背景文件）才是正确的方法。

- Bostone

这并不表示切换按钮是否被按下，因为默认情况下，切换按钮在中间有一个开/关标记。因此，这个解决方案最终看起来就像一个普通的ImageButton。 - IgorGanapolsky

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- CaseyB · Accepted Answer

您可以使切换按钮看起来像您想要的任何样子。您只需要创建一个样式。请查看 /platforms//data/res/values/styles.xml 并搜索 Widget.Button.ToggleButton，它如下所示：

<style name="Widget.Button.Toggle">
    <item name="android:background">@android:drawable/btn_toggle_bg</item>
    <item name="android:textOn">@android:string/capital_on</item>
    <item name="android:textOff">@android:string/capital_off</item>
    <item name="android:disabledAlpha">?android:attr/disabledAlpha</item>
</style>

所以，如果您查找btn_toggle_bg可绘制对象，您会发现以下内容：

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@+android:id/background" android:drawable="@android:drawable/btn_default_small" />
    <item android:id="@+android:id/toggle" android:drawable="@android:drawable/btn_toggle" />
</layer-list>

这表明它使用了标准的Button背景和一个名为btn_toggle的可绘制对象作为src。 btn_src.xml看起来像这样:

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

在显示按钮状态时使用了哪两个可绘制对象？它们实际上被称为btn_toggle_{on/off}.9.png，因为它们是9 Patch图像，所以可以拉伸来匹配按钮大小。