问题描述

android imagebutton背景图片设置

gridview的布局xml有3个imagebutton，属性android：src="@drawable/on",(用background背景图片变形了，只能用src)，点击后图像重叠并且变形了，怎么办？
voice.xml

 <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false"
        android:drawable="@drawable/voice_on_unpress" /> <!-- pressed -->
    <item android:state_pressed="true"
        android:drawable="@drawable/voice_on_do" /> <!-- default -->
    <item android:state_pressed="true"
        android:drawable="@drawable/voice_on_do" /> <!-- default -->
    <item
        android:drawable="@drawable/voice_on_unpress" />
</selector>

voice_press.xml

 <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false"
        android:drawable="@drawable/voice_on_press" /> <!-- pressed -->
    <item android:state_pressed="true"
        android:drawable="@drawable/voice_on_do" /> <!-- default -->
    <item android:state_pressed="true"
        android:drawable="@drawable/voice_on_do" /> <!-- default -->
    <item
        android:drawable="@drawable/voice_on_press" />
</selector>

activity.java中

 search_voice.setOnClickListener(new View.OnClickListener() {
                    public void onClick(View arg0) {
                           if(flag){
                              Toast.makeText(getApplicationContext(), "语音开启",Toast.LENGTH_SHORT).show();
                              search_voice.setBackgroundResource(R.drawable.vocie_press);
                              flag = false;
                           }
                           else{
                               Toast.makeText(getApplicationContext(), "语音屏蔽",Toast.LENGTH_SHORT).show();
                              search_voice.setBackgroundResource(R.drawable.vocie);
                              flag = true;
                           }

                    }
                });

解决方案

图形变形是你image设置的scaletype引起，这涉及到图片剪裁的问题。如果图片四周是对称可伸缩，用9patch处理一下图片。

 <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false"
        android:drawable="@drawable/voice_on_unpress" /> <!-- pressed -->
    <item android:state_pressed="true"
        android:drawable="@drawable/voice_on_do" /> <!-- default -->
</selector>

解决方案二：

首先你就是想显示按钮的两个状态, voice on/off.
那么你在click listener中监听事件后直接设置响应的图片而不是selector。原本selector自己就有好几种状态的，在与你的背景肯定会重叠。

解决方法是在search_voice的layout中就把selector设置好，然后在click listener中设置对应的一张图片就好。

解决方案三：

设置scaletype属性或者用9patch处理图片

解决方案四：

刚解决了，啥话不说了上代码。默认背景用android:background="@drawable/voice"

voice.xml

 <selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="false" >
        <bitmap android:src="@drawable/voice_on_unpress" android:tileMode="disabled" android:gravity="top" />
    </item>
    <item android:state_pressed="true">
        <bitmap android:src="@drawable/voice_on_do" android:tileMode="disabled" android:gravity="top" />
    </item>
</selector>

voice_press.xml

 <item android:state_pressed="true" >
       <bitmap android:src="@drawable/voice_on_do" android:tileMode="disabled" android:gravity="top" />
    </item>
    <item android:state_pressed="false">
       <bitmap android:src="@drawable/voice_on_press" android:tileMode="disabled" android:gravity="top" />
    </item>

activity.java

private static flag ；
flag = FALSE；
 search_voice.setOnClickListener(new View.OnClickListener() {
                    public void onClick(View arg0) {
                         search_voice.setBackgroundResource(0);
                        if(flag){
                            Toast.makeText(getApplicationContext(), "语音开启",Toast.LENGTH_SHORT).show();
                            search_voice.setBackgroundResource(R.drawable.vocie_press);
                            flag = false;
                        }
                        else{
                            Toast.makeText(getApplicationContext(), "语音屏蔽",Toast.LENGTH_SHORT).show();
                            search_voice.setBackgroundResource(R.drawable.vocie);
                            flag = true;
                        }

                    }
                });

实现的没按下按钮时图片A，按着未放是图片B，松开按钮时图片C，如果再按下时图片B，松开时图片A。。。。。。