Android控件之利用selector自定义的带文字的图片按钮

经常用Android编程的人肯定会发现，Android提供的Button和ImageButton控件使得按钮可以带上图片和文字，也就是
（1）Button用android:background属性可以给按钮添加背景图片，android:text属性可以给按钮添加文字。但是有一点很明显的缺陷就是不能改变按钮的背景图片；
（2）ImageButton用android:src属性可以给按钮添加背景图片，android:text属性不能给按钮添加文字。很明显缺陷就是不能给按钮添加文字；

为了解决上面的困扰，所以这篇文章就产生了。
首先，我先贴上代码。

//-------------------main.xml-----------------------
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/ic_launcher"
        android:text="Button" />

    <ImageButton
        android:id="@+id/imageButton1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@layout/selector"
        android:text="Button" />

    <ImageButton
        android:id="@+id/imageButton2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@layout/selector" />

</LinearLayout>

//-------------------selector.xml-----------------------
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true"
        android:drawable="@drawable/other" />
        
    <item android:state_pressed="false"
        android:drawable="@drawable/ic_launcher" />
</selector>

这里你会看到原来多了一个<selector>元素的缘故。Android中的Selector主要是用来改变ListView和Button控件的默认背景。接下来自然而然就是要详解下<selector>。

一、ListView下的selector
（1）ListView下的selector的属性

<?xml version="1.0" encoding="utf-8" ?>     
<selector xmlns:android="http://schemas.android.com/apk/res/android">   
<!-- 默认时的背景图片-->    
  <item android:drawable="@drawable/pic1" />  
<!-- 没有焦点时的背景图片 -->    
  <item android:state_window_focused="false"     
        android:drawable="@drawable/pic1" />       
<!-- 非触摸模式下获得焦点并单击时的背景图片 -->    
  <item android:state_focused="true" android:state_pressed="true"   android:drawable= "@drawable/pic2" />   
<!-- 触摸模式下单击时的背景图片-->    
<item android:state_focused="false" android:state_pressed="true"   android:drawable="@drawable/pic3" />    
<!--选中时的图片背景-->    
  <item android:state_selected="true"   android:drawable="@drawable/pic4" />     
<!--获得焦点时的图片背景-->    
  <item android:state_focused="true"   android:drawable="@drawable/pic5" />     
</selector> 

（2）ListView下的selector使用xml文件的方法
1.方法一：在listview中配置android:listSelector="@drawable/xxx
或者在listview的item中添加属性android：background="@drawable/xxx"
2.方法二：Drawable drawable = getResources().getDrawable(R.drawable.xxx);
ListView.setSelector(drawable);但是这样会出现列表有时候为黑的情况，需要加上：android:cacheColorHint="@android:color/transparent"使其透明。
相关属性：
android:state_selected是选中
android:state_focused是获得焦点
android:state_pressed是点击
android:state_enabled是设置是否响应事件,指所有事件
根据这些状态同样可以设置button的selector效果。也可以设置selector改变button中的文字状态。

二、Button下的selector

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:color="#FFF" />
    <item android:state_focused="true" android:color="#FFF" />
    <item android:state_pressed="true" android:color="#FFF" />
    <item android:color="#000" />
</selector>

Button还可以实现更复杂的效果，例如渐变

drawable/selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">       
<item android:state_pressed="true">//定义当button 处于pressed 状态时的形态。 
          <shape>
           <gradient android:startColor="#8600ff" /> 
           <stroke android:width="2dp" 
                 android:color="#000000" /> 
           <corners android:radius="5dp" />  
           <padding android:left="10dp" 
                android:top="10dp" 
                android:bottom="10dp" 
                android:right="10dp"/>  
           </shape>
</item> 
<item android:state_focused="true">//定义当button获得 focus时的形态 
            <shape> 
           <gradient android:startColor="#eac100"/> 
           <stroke android:width="2dp" 
               android:color="#333333"/> 
            <corners android:radius="8dp" />   
            <padding android:left="10dp" 
                android:top="10dp" 
                android:bottom="10dp" 
                android:right="10dp"/> 
        </shape>
 </item>
</selector> 

最后，需要在包含 button的xml文件里添加两项。例如main.xml 文件，需要在<Button />里加两项
android：focusable="true" android:background="@drawable/selector"

说明:
gradient -- 对应颜色渐变。 startcolor、endcolor就不多说了。 android:angle 是指从哪个角度开始变。
solid -- 填充。
stroke -- 描边。
corners -- 圆角。
padding -- 定义内容离边界的距离。