自訂控制項 imageview 雙擊顯示紅色邊框

標籤：自訂控制項   imageview   紅色邊框   雙擊   

在項目中用到了一個如下功能：雙擊自訂imageview控制項，然後控制項顯示一個紅色邊框，表示該控制項處於可編輯狀態，再次雙擊邊框消失，控制項不可再被編輯。現把雙擊和畫線部分單獨摘出來，希望能幫到別人。

首先是自訂控制項的代碼：

import android.content.Context;import android.graphics.Canvas;import android.graphics.Paint;import android.util.AttributeSet;import android.widget.ImageView;public class MyImageView extends ImageView {private boolean isDisplay = false;//是否顯示邊框private int imgId;//序列屬性/** 構造方法 **/public MyImageView(Context context) {super(context);}public MyImageView(Context context, AttributeSet attrs) {super(context, attrs);}/**編輯狀態片周圍畫一圈紅線**/protected void onDraw(Canvas canvas) {super.onDraw(canvas);if (isDisplay) {Paint paint = new Paint();paint.setColor(android.graphics.Color.RED);//線條顏色paint.setStrokeWidth(3);//線條寬度/** 畫四條線 **/canvas.drawLine(0, 1, this.getWidth() - 1, 1, paint);canvas.drawLine(1, 0, 1, this.getHeight() - 1, paint);canvas.drawLine(this.getWidth() - 2, 0, this.getWidth() - 2,this.getHeight() - 1, paint);canvas.drawLine(0, this.getHeight() - 2, this.getWidth() - 1,this.getHeight() - 2, paint);}}/** 設定邊框是否顯示 **/public void setDisplayable(boolean isEditable) {this.isDisplay = isEditable;postInvalidate();//調用onDraw，重新畫線}/** 擷取邊框是否顯示 **/public boolean getDisplayable() {return isDisplay;}/** 設定圖片ID **/public void setimgId(int img_ID) {this.imgId = img_ID;}/** 擷取圖片ID **/public int getimgId() {return imgId;}}

比較簡單，畫線是在onDraw方法中實現的，postInvalidate方法可以調用onDraw方法，每次更改isDisplay時都需要重新畫線。

下面是主程式碼：

import view.MyImageView;import android.app.Activity;import android.os.Bundle;import android.view.GestureDetector;import android.view.MotionEvent;import android.view.View;import android.view.View.OnTouchListener;public class MainActivity extends Activity {private MyImageView img1, img2, img3;private MyImageView imgArray[] = { img1, img2, img3 };private int imgNum = 3;//圖片數量private int currentId,lastId = 4;//當前圖片標識和上次操作的圖片標識private GestureDetector mGestureDetector;// 雙擊手勢監器private ImgClickListener imgClicklistener = new ImgClickListener();@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mGestureDetector = new GestureDetector(MainActivity.this,new LearnGestureListener());imgArray[0]=(MyImageView)findViewById(R.id.myImageView1);imgArray[1]=(MyImageView)findViewById(R.id.myImageView2);imgArray[2]=(MyImageView)findViewById(R.id.myImageView3);for(int i=0;i<imgNum;i++){imgArray[i].setimgId(i);imgArray[i].setOnTouchListener(imgClicklistener);imgArray[i].setClickable(true);//允許雙擊操作（必須要有）}}/* 單擊操作監聽 */private class ImgClickListener implements OnTouchListener {@Overridepublic boolean onTouch(View v, MotionEvent event) {switch (event.getAction() & MotionEvent.ACTION_MASK) {case MotionEvent.ACTION_DOWN:currentId = ((MyImageView) v).getimgId();// 擷取當前操作圖片的IDbreak;}mGestureDetector.onTouchEvent(event);// 執行雙擊手勢操作return false;}}/* 雙擊操作監聽 */class LearnGestureListener extends GestureDetector.SimpleOnGestureListener {@Overridepublic boolean onDoubleTap(MotionEvent arg0) {if (lastId != currentId) {/** 同一圖片在可編輯和不可編輯狀態切換 **/for (int i = 0; i < imgNum; i++) {imgArray[i].setDisplayable(false);}imgArray[currentId].setDisplayable(true);lastId = currentId;} else {/** 不同圖片在可編輯和不可編輯狀態切換**/if (imgArray[currentId].getDisplayable()) {for (int i = 0; i < imgNum; i++) {imgArray[i].setDisplayable(false);}} else {for (int i = 0; i < imgNum; i++) {imgArray[i].setDisplayable(false);}imgArray[currentId].setDisplayable(true);}}return false;}}}

基本原理比較簡單，就是把所有的控制項都存在數組中，這樣的話很多操作通過遍曆就可以實現，比較方便。初始化的時候給每一個圖片一個唯一的ID，在程式運行中通過該ID來識別操作的圖片是哪一個。在執行雙擊操作時首先會有一個ACTION_DOWN的操作，在這個操作執行的時候先把當前操作的圖片的ID記錄在currentId變數中，然後在雙擊操作執行的時候比較該ID和lastId變數，再進行相應的操作。
我的程式是在平板中實現的，跟在手機中實現的原理是完全一樣的，有問題可以留言
原始碼下載連結：點擊開啟連結 http://download.csdn.net/detail/yxg190221/7551473