Android ImageButton简介

Button按钮上显示文字

ImageButton上则显示图片，为它指定android:text属性没用。可以指定android:src属性，可以使用静止图片或Drawable对象。


ImageButton派出了一个ZoomButton，可以代表放大、缩小两个按钮。默认提供了btn_minus、btn_plus两个Drawable资源。

Android还提供了一个ZoomControls组件，相当于同时组合了放大、缩小两个按钮，并允许分别为两个按钮绑定不同的事件监听器。

activity_main.xml文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >                  
   
    <!-- 普通图片按钮 -->
    <ImageButton 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/red"
        />
    
    <!-- 按下时显示不同图片的按钮 -->
    <ImageButton 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/button_selector"
        />
    
    <LinearLayout 
        android:orientation="horizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:layout_gravity="center_horizontal"
        >
        <!-- 分别定义2个ZoomButton，分别使用btn_minus和btn_plus图片 -->
        <ZoomButton 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/btn_zoom_down"
            android:src="@android:drawable/btn_minus"
            />
        <ZoomButton 
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/btn_zoom_up"
            android:src="@android:drawable/btn_plus"
            />
        </LinearLayout>
        
        <!-- 定义ZoomControls组件 -->
        <ZoomControls android:id="@+id/zoomControls"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            />
    
</LinearLayout>

red.xml：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle">
    
    <size 
        android:width="200dp"
        android:height="100dp"
        />
    
    <solid android:color="#CC0001"/>
</shape>

my_button_pressed.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle">
    
    <size 
        android:width="100dp"
        android:height="100dp"
        />
    <!--圆角半径 -->  
    <corners   
        android:topLeftRadius="10dp"  
        android:topRightRadius="10dp"  
        android:bottomLeftRadius="10dp"  
        android:bottomRightRadius="10dp"  
        />  
      
    <!-- 背景颜色 -->  
    <solid android:color="#B4CDE6"/>  
      
    <!-- 描边 -->  
    <stroke   
        android:width="2dp"  
        android:color="#000"  
        />  
      
    <!-- 内边距 -->  
    <padding   
        android:left="10dp"  
        android:right="10dp"  
        android:top="10dp"  
        android:bottom="10dp"  
        /> 

</shape>

my_button_default.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle"
    >
    
    <size 
        android:width="100dp"
        android:height="100dp"
        />
    
    <!--圆角半径 -->  
    <corners   
        android:topLeftRadius="10dp"  
        android:topRightRadius="10dp"  
        android:bottomLeftRadius="10dp"  
        android:bottomRightRadius="10dp"  
        />  
      
    <!-- 背景颜色 -->  
    <solid android:color="#4F71AE"/>  
      
    <!-- 描边 -->  
    <stroke   
        android:width="2dp"  
        android:color="#000"  
        />  
      
    <!-- 内边距 -->  
    <padding   
        android:left="10dp"  
        android:right="10dp"  
        android:top="10dp"  
        android:bottom="10dp"  
        /> 
    

</shape>

效果如图：