切换按钮充当图像按钮

时间:2015-02-16 03:48:32

标签: android xml image button toggle

我需要一个切换按钮来获得图像和背景颜色。目前,我的切换按钮只有图像而没有背景颜色。这是它的代码

<ToggleButton
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:layout_weight="1.0"
android:layout_margin="5dp"
android:onClick="onToggleClicked"
android:textSize="0sp"
android:checked="false"
android:background="@drawable/soundfocuslone1"/>


<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true">
<bitmap android:src="@drawable/soundonlone1"
android:gravity="center"/>
</item>
<item android:state_pressed="true">
<bitmap android:src="@drawable/soundfocuslone1"
android:gravity="center" />
</item>
<item android:state_checked="false">
<bitmap android:src="@drawable/soundofflone1"/>
</item>
</selector>

切换按钮上可以有两个背景吗?我想要背景颜色和图像。如果没有,是否有一种简单的方法让图像按钮的行为类似于切换按钮?由于图像未在切换按钮上缩放,因此将图像按钮用作切换按钮可能会更容易。谢谢,我将感谢所有的回复。

3 个答案:

答案 0 :(得分:1)

如果您不希望将图片放在中心,请使用此图片来提供背景。

<强> 1 即可。把它放在你的切换按钮 - android:background =&#34; @ drawable / bw_toggle_on_selector&#34;

<强> 2 即可。在drawable文件夹中创建一个XML,名称为&#34; bw_toggle_on_selector&#34;并将以下代码粘贴到其中 -

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"     android:shape="rectangle" >
<corners
android:radius="14dp"
/>
<gradient
android:angle="45"
android:centerX="35%"
android:centerColor="#7995A8"
android:startColor="#E8E8E8"
android:endColor="#000000"
android:type="linear"
/>
<padding
 android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="270dp"
android:height="60dp"
/>
<stroke
android:width="3dp"
android:color="#878787"
/>
 </shape>  

3 。使用android:drawableLeft设置背景图片。

如果您想将图片放在中心,请使用此代码(它涵盖所有内容,包括背景图片)。

 <?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item 
    android:state_pressed="true">
    <layer-list>
        <item>
            <bitmap 
                android:gravity="center" 
                android:src="@drawable/ic_stop" 
                 />
        </item>
        <item>
            <shape>
                 <gradient 
                     android:angle="270" 
                     android:endColor="#a0e0b071" 
                     android:startColor="#a0a67637" />
                 <stroke 
                     android:width="1dp" 
                     android:color="#5c3708" />
                 <corners 
                     android:radius="5dp" />
                 <padding 
                     android:bottom="10dp" 
                     android:left="10dp" 
                     android:right="10dp" 
                     android:top="10dp" />
            </shape>
        </item>
    </layer-list>
</item>

<item 
    android:state_enabled="true">
    <layer-list>
        <item>
            <bitmap 
                android:gravity="center" 
                android:src="@drawable/ic_back" 
                 />
        </item>
        <item>
            <shape 
                android:shape="rectangle">
                <gradient 
                    android:angle="270" 
                    android:endColor="#a0a67637" 
                    android:startColor="#a0e0b071" />
                <stroke 
                    android:width="1dp" 
                    android:color="#5c3708" />
                <corners 
                    android:radius="5dp" />
                <padding 
                    android:bottom="10dp" 
                    android:left="10dp" 
                    android:right="10dp" 
                    android:top="10dp" />
            </shape>
        </item>
    </layer-list>
</item>


</selector>

** 一些提示 **

*更改按钮文字onClick

<强> 1 即可。在Drawable文件夹中创建一个名为&#34; text_color.xml&#34;

的XML文件

将以下代码粘贴到其中 -

<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_pressed="true"
android:color="#000000" />
<item
android:state_pressed="false"
android:color="#01DFD7" />
 </selector>

<强> 2 即可。把它放在你的按钮中来定义XML 机器人:文字颜色=&#34; @可绘制/ text_color&#34;

*更快地调整图片大小的方法?

使用this tool或Android资产工作室(google it)

*如何为我的按钮制作自定义背景?

尝试this online tool:)

答案 1 :(得分:0)

首先,你在xml文件中写道:

   <ToggleButton
                        android:id="@+id/tgTextReader"
                        android:layout_width="60dp"
                        android:layout_height="36dp"
                        android:background="@drawable/bw_toggle_on_selector"
                        android:focusable="false"
                        android:focusableInTouchMode="false"
                        android:textOff=""
                        android:textOn="" />

然后在res /中创建文件夹
可绘制的文件夹 写xml文件名是bw_toggle_on_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- When selected, use grey -->
    <item android:drawable="@drawable/a"
          android:state_checked="true" />
    <!-- When not selected, use white-->
    <item android:drawable="@drawable/b"
        android:state_checked="false"/>

 </selector>

此文件保留在drawable foloder中。 并在res /
中创建一个新文件夹 绘制,nodpi 两个图像保持在那里。例如图像a,图像b。 啤酒花成功运作。感谢

答案 2 :(得分:0)

实际上ToggleButton有“android:button”属性。所以你可以使用选择器的“android:button”属性,并使用“android:background”为ToggleButton提供背景颜色。但是使用切换按钮我们可以获得重力问题,这样你就可以使用复选框而不是切换按钮。 / p>

<CheckBox
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:layout_weight="1.0"
android:layout_margin="5dp"
android:onClick="onToggleClicked"
android:textSize="0sp"
android:checked="false"
android:padding="5dp"
android:button="@drawable/soundfocuslone1"
android:background="ur_background_color_code or drawable"/>