Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> Android開發 >> 關於android開發 >> UI組件之ImageView及其子類(二)ImageButton ,ZoomButton

UI組件之ImageView及其子類(二)ImageButton ,ZoomButton

編輯:關於android開發

UI組件之ImageView及其子類(二)ImageButton ,ZoomButton


從ImageButton這個字面意思上來看,它是一個圖片按鈕,那麼我們就可以使用它做一個我們想要的圖片按鈕了,但是我們在實際使用的過程當中,就會發現該按鈕的使用並沒有想像中的那麼簡單,需要再增加一些代碼或再配置XML才能實現圖片按鈕按下的效果

ImageButton 還直接派生了ZoomButton組件,只是Android默認提供了btn_minus,btn_plus兩個Drawable資源,只要為ZoomButton的android:src屬性分別指著兩個android提供的資源,即可實現“放大”,“縮小”按鈕,ZoomButton組件僅僅是android:src屬性默認使用的是android的資源,添加了一些方法可實現放大縮小。

 

android還提供了一個ZoomControls組件,該組件繼承了是LeanerLayout布局組件,把兩個放大縮小的按鈕水平線性的組合在一起,並允許分別為兩個按鈕綁定不同的事件監聽器

圖片按鈕正常狀態的效果:

 

第二個按鈕按下是的效果




 

實現圖片按鈕按下的效果有兩種方式可以實現:一是增加代碼,二配置XML。

一、在java中為圖片按鈕增加觸摸監聽的函數來實現圖片切換

 

 

[java] view plaincopy在CODE上查看代碼片派生到我的代碼片
  1. ImageButton btn = (ImageButton)findViewById(R.id.imageButton1);    
  2.        //在java代碼中修改按下按鈕時不同的狀態  
  3.        btn.setOnTouchListener(new View.OnTouchListener(){    
  4.         @Override  
  5.         public boolean onTouch(View v, MotionEvent event) {  
  6.              if(event.getAction() == MotionEvent.ACTION_DOWN){         
  7.                     //重新設置按下時的背景圖片    
  8.                     ((ImageButton)v).setImageDrawable(getResources().getDrawable(R.drawable.red));                                
  9.                  }else if(event.getAction() == MotionEvent.ACTION_UP){         
  10.                      //再修改為抬起時的正常圖片    
  11.                      ((ImageButton)v).setImageDrawable(getResources().getDrawable(R.drawable.purple));       
  12.                  }    
  13.             // TODO Auto-generated method stub  
  14.             return false;  
  15.         }         
  16.        });    

代碼比較簡單,就是當圖片按下時,修改按鈕的背景圖片,當抬起時再修改為正常的圖片顯示
二、通過給按鈕配置XML文件來實現圖片按鈕的背景切換效果
 

 

  1.   
  2.   
  3.        
  4.     
  5.         android:drawable="@drawable/red"  
  6.     />  
  7.           
  8.     
  9.         android:drawable="@drawable/purple"  
  10.     />  
  11.   


main.xml

 

 

 

 
  1.   
  2.  
  3.     android:id="@+id/root"  
  4.     android:layout_width="match_parent"  
  5.     android:layout_height="match_parent"  
  6.     android:orientation="vertical" >  
  7.       
  8.     
  9.         android:id="@+id/imageButton1"  
  10.         android:layout_width="wrap_content"  
  11.         android:layout_height="wrap_content"  
  12.         android:background="@drawable/blue" />  
  13.   
  14.     
  15.         android:id="@+id/imageButton2"  
  16.         android:layout_width="wrap_content"  
  17.         android:layout_height="wrap_content"  
  18.         android:background="@drawable/button_selector" />  
  19.   
  20.     
  21.         android:layout_width="wrap_content"  
  22.         android:layout_height="wrap_content"  
  23.         android:layout_gravity="center_horizontal"  
  24.         android:layout_margin="10dp"  
  25.         android:orientation="horizontal" >  
  26.        
  27.   
  28.         
  29.             android:id="@+id/zoomButton1"  
  30.             android:layout_width="wrap_content"  
  31.             android:layout_height="wrap_content"  
  32.             android:src="@android:drawable/btn_plus" />  
  33.   
  34.         
  35.             android:id="@+id/zoomButton2"  
  36.             android:layout_width="wrap_content"  
  37.             android:layout_height="wrap_content"  
  38.             android:src="@android:drawable/btn_minus" />  
  39.   
  40.       
  41.      
  42.   
  43.     
  44.         android:id="@+id/zoomControls1"  
  45.         android:layout_width="wrap_content"  
  46.         android:layout_height="wrap_content"  
  47.         android:layout_gravity="center_horizontal"  
  48.         android:orientation="horizontal" />  
  49.   
  50.   


需要特別注意的是:在ImageButton中,如果使用XML配置文件來設置圖片的效果的話,就不要再指定它的android:src=""屬性值了,否則圖片的按下效果就出不來了。
這兩種方法各有各的好處,在實際運用過種當種可以根據自己的需要進行選擇。

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved