English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Implementazione del controllo di ImageView personalizzato in Android per la zoom e lo spostamento delle immagini

Sintesi: Attraverso il controllo del componente ImageView personalizzato, nel layout xml chiamare il componente personalizzato per realizzare lo zoom delle immagini.

/**
* Il controllo dell'ImageView personalizzato, che può effettuare la zoomazione multi-punto e lo spostamento delle immagini
* 
* @author qiuwanyong
*/
public class MyImageView extends ImageView {
/**
* Costante di stato di inizializzazione
*/
public static final int STATUS_INIT = 1;
/**
* Costante di stato di ingrandimento dell'immagine
*/
public static final int STATUS_ZOOM_OUT = 2;
/**
* Costante di stato di riduzione dell'immagine
*/
public static final int STATUS_ZOOM_IN = 3;
/**
* Costante di stato di trascinamento dell'immagine
*/
public static final int STATUS_MOVE = 4;
/**
* Utilizzato per effettuare trasformazioni di movimento e ridimensionamento dell'immagine
*/
private Matrix matrix = new Matrix();
/**
* Oggetto Bitmap da visualizzare
*/
private Bitmap sourceBitmap;
/**
* Registra lo stato dell'operazione corrente, valori selezionabili: STATUS_INIT, STATUS_ZOOM_OUT, STATUS_ZOOM_IN e STATUS_MOVE
*/
private int currentStatus;
/**
* Larghezza del controllo ZoomImageView
*/
private int width;
/**
* Altezza del controllo ZoomImageView
*/
private int height;
/**
* Registra il valore dell'asse x del punto centrale quando entrambi i dita sono messi sulla schermata
*/
private float centerPointX;
/**
* Registra il valore dell'asse y del punto centrale quando entrambi i dita sono messi sulla schermata
*/
private float centerPointY;
/**
* Registra la larghezza dell'immagine corrente, questo valore cambia insieme all'immagine quando viene ridimensionata
*/
private float currentBitmapWidth;
/**
* Registra l'altezza dell'immagine corrente, questo valore cambia insieme all'immagine quando viene ridimensionata
*/
private float currentBitmapHeight;
/**
* Registra l'asse x dell'ultimo movimento del dito
*/
private float lastXMove = -1;
/**
* Registra l'asse y dell'ultimo movimento del dito
*/
private float lastYMove = -1;
/**
* Registra la distanza di movimento del dito nell'asse x della coordinate
*/
private float movedDistanceX;
/**
* Registra la distanza di movimento del dito nell'asse y della coordinate
*/
private float movedDistanceY;
/**
* Registra il valore di offset orizzontale dell'immagine sulla matrice
*/
private float totalTranslateX;
/**
* Registra il valore di offset verticale dell'immagine sulla matrice
*/
private float totalTranslateY;
/**
* Registra la scala totale dell'immagine sulla matrice
*/
private float totalRatio;
/**
* Registra la scala di zoom causata dal movimento delle dita
*/
private float scaledRatio;
/**
* Registra la scala iniziale dell'immagine
*/
private float initRatio;
/**
* Registra la distanza tra i due dita nell'ultima volta
*/
private double lastFingerDis;
/**
* Costruttore di ZoomImageView, imposta lo stato di operazione corrente su STATUS_INIT.
* 
* @param context
* @param attrs
*/
public MyImageView(Context context, AttributeSet attrs) {
super(context, attrs);
currentStatus = STATUS_INIT;
}
/**
* Impostare l'immagine da visualizzare.
* 
* @param bitmap
* Oggetto Bitmap da visualizzare
*/
public void setImageBitmap(Bitmap bitmap) {
sourceBitmap = bitmap;
invalidate();
}
@Override
protected void onLayout(boolean changed, int left, int top, int right,
int bottom) {
super.onLayout(changed, left, top, right, bottom);
if (changed) {
// Ottenere rispettivamente la larghezza e l'altezza di ZoomImageView
width = getWidth();
height = getHeight();
}
}
@SuppressLint("NewApi") @Override
public boolean onTouchEvent(MotionEvent event) {
if (initRatio == totalRatio) {
getParent().requestDisallowInterceptTouchEvent(false);
} else {
getParent().requestDisallowInterceptTouchEvent(true);
}
switch (event.getActionMasked()) {
case MotionEvent.ACTION_POINTER_DOWN:
if (event.getPointerCount() == 2) {
// Quando ci sono due dita premute sullo schermo, calcola la distanza tra le due dita
lastFingerDis = distanceBetweenFingers(event);
}
break;
case MotionEvent.ACTION_CANCEL:
case MotionEvent.ACTION_MOVE:
if (event.getPointerCount() == 1) {
// Solo quando un dito è premuto sullo schermo e spostato, è lo stato di trascinamento
float xMove = event.getX();
float yMove = event.getY();
if (lastXMove == -1 && lastYMove == -1) {
lastXMove = xMove;
lastYMove = yMove;
}
currentStatus = STATUS_MOVE;
movedDistanceX = xMove - lastXMove;
movedDistanceY = yMove - lastYMove;
// Esegui il controllo dei limiti, non è permesso trascinare l'immagine oltre i limiti
if (totalTranslateX + movedDistanceX > 0) {
movedDistanceX = 0;
} else if (width - (totalTranslateX + movedDistanceX) > currentBitmapWidth) {
movedDistanceX = 0;
}
if (totalTranslateY + movedDistanceY > 0) {
movedDistanceY = 0;
} else if (height - (totalTranslateY + movedDistanceY) > currentBitmapHeight) {
movedDistanceY = 0;
}
// Chiamare il metodo onDraw() per disegnare l'immagine
invalidate();
lastXMove = xMove;
lastYMove = yMove;
} else if (event.getPointerCount() == 2) {
// Due due dita preme sullo schermo e spostate, è lo stato di zoom
centerPointBetweenFingers(event);
if (fingerDis > lastFingerDis) {
currentStatus = STATUS_ZOOM_OUT;
currentStatus = STATUS_ZOOM_IN;
} else {
// Effettuare il controllo della multiplier di zoom, consentendo di ingrandire l'immagine al massimo di 4 volte, e di ridurla all'iniziale
}
if ((currentStatus == STATUS_ZOOM_OUT && totalRatio < 4 * initRatio)
|| (currentStatus == STATUS_ZOOM_IN && totalRatio > initRatio)) {
scaledRatio = (float) (fingerDis / lastFingerDis);
totalRatio = totalRatio * scaledRatio;
if (totalRatio > 4 * initRatio) {
totalRatio = 4 * initRatio;
else if (totalRatio < initRatio) {
}
totalRatio = initRatio;
}
// Chiamare il metodo onDraw() per disegnare l'immagine
invalidate();
lastFingerDis = fingerDis;
}
}
break;
case MotionEvent.ACTION_POINTER_UP:
if (event.getPointerCount() == 2) {
// Restituire i valori temporanei alla loro condizione originale quando il dito lascia lo schermo
lastXMove = -1;
lastYMove = -1;
}
break;
case MotionEvent.ACTION_UP:
// Restituire i valori temporanei alla loro condizione originale quando il dito lascia lo schermo
lastXMove = -1;
lastYMove = -1;
break;
default:
break;
}
return true;
}
/**
* Secondo il valore di currentStatus, determinare quale tipo di operazione di disegno effettuare sull'immagine.
*/
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
switch (currentStatus) {
case STATUS_ZOOM_OUT:
case STATUS_ZOOM_IN:
zoom(canvas);
break;
case STATUS_MOVE:
move(canvas);
break;
case STATUS_INIT:
initBitmap(canvas);
default:
if (sourceBitmap != null) {
canvas.drawBitmap(sourceBitmap, matrix, null);
}
break;
}
}
/**
* 对图片进行缩放处理。
* 
* @param canvas
*/
private void zoom(Canvas canvas) {
matrix.reset();
// 将图片按总缩放比例进行缩放
matrix.postScale(totalRatio, totalRatio);
float scaledWidth = sourceBitmap.getWidth() * totalRatio;
float scaledHeight = sourceBitmap.getHeight() * totalRatio;
float translateX = 0f;
float translateY = 0f;
// 如果当前图片宽度小于屏幕宽度,则按屏幕中心的横坐标进行水平缩放。否则按两指的中心点的横坐标进行水平缩放
if (currentBitmapWidth < width) {
translateX = (width - scaledWidth) / 2f;
} else {
translateX = totalTranslateX * scaledRatio + centerPointX
* (1 - scaledRatio);
// 进行边界检查,保证图片缩放后在水平方向上不会偏移出屏幕
if (translateX > 0) {
translateX = 0;
} else if (width - translateX > scaledWidth) {
translateX = width - scaledWidth;
}
}
// 如果当前图片高度小于屏幕高度,则按屏幕中心的纵坐标进行垂直缩放。否则按两指的中心点的纵坐标进行垂直缩放
if (currentBitmapHeight < height) {
translateY = (height - scaledHeight) / 2f;
} else {
translateY = totalTranslateY * scaledRatio + centerPointY
* (1 - scaledRatio);
// 进行边界检查,保证图片缩放后在垂直方向上不会偏移出屏幕
if (translateY > 0) {
translateY = 0;
else if (height - translateY > scaledHeight) {
translateY = height - scaledHeight;
}
}
// Sposta l'immagine dopo lo zoom per garantire che il punto centrale non cambi
matrix.postTranslate(translateX, translateY);
totalTranslateX = translateX;
totalTranslateY = translateY;
currentBitmapWidth = scaledWidth;
currentBitmapHeight = scaledHeight;
canvas.drawBitmap(sourceBitmap, matrix, null);
}
/**
* Effettua il trattamento di spostamento dell'immagine
* 
* @param canvas
*/
private void move(Canvas canvas) {
matrix.reset();
// Calcola il valore di spostamento totale in base alla distanza di movimento del dito
float translateX = totalTranslateX + movedDistanceX;
float translateY = totalTranslateY + movedDistanceY;
// Esegui lo zoom dell'immagine secondo il rapporto di zoom esistente
matrix.postScale(totalRatio, totalRatio);
// Sposta ulteriormente in base alla distanza di movimento
matrix.postTranslate(translateX, translateY);
totalTranslateX = translateX;
totalTranslateY = translateY;
canvas.drawBitmap(sourceBitmap, matrix, null);
}
/**
* Effettua operazioni di inizializzazione dell'immagine, inclusa la centratura dell'immagine e la compressione dell'immagine quando l'immagine è più grande dell'altezza e della larghezza dello schermo
* 
* @param canvas
*/
private void initBitmap(Canvas canvas) {
if (sourceBitmap != null) {
matrix.reset();
int bitmapWidth = sourceBitmap.getWidth();
int bitmapHeight = sourceBitmap.getHeight();
if (bitmapWidth > width || bitmapHeight > height) {
if (bitmapWidth - width > bitmapHeight - height) {
// Quando la larghezza dell'immagine è maggiore della larghezza dello schermo, riduci l'immagine in proporzione per farla apparire completamente
float ratio = width / (bitmapWidth * 1.0f);
matrix.postScale(ratio, ratio);
float translateY = (height - (bitmapHeight * ratio)) / 2f;
// Sposta in direzione y per garantire che l'immagine sia centrata
matrix.postTranslate(0, translateY);
totalTranslateY = translateY;
totalRatio = initRatio = ratio;
} else {
// Quando l'altezza dell'immagine è maggiore dell'altezza dello schermo, riduci l'immagine in proporzione per farla apparire completamente
float ratio = height / (bitmapHeight * 1.0f)}
matrix.postScale(ratio, ratio);
float translateX = (width - (bitmapWidth * ratio)) / 2f;
// Sposta in senso orizzontale per garantire che l'immagine sia centrata
matrix.postTranslate(translateX, 0);
totalTranslateX = translateX;
totalRatio = initRatio = ratio;
}
currentBitmapWidth = bitmapWidth * initRatio;
currentBitmapHeight = bitmapHeight * initRatio;
} else {
// Quando le dimensioni dell'immagine sono inferiori alle dimensioni dello schermo, mostra direttamente l'immagine al centro
float translateX = (width - sourceBitmap.getWidth()) / 2f;
float translateY = (height - sourceBitmap.getHeight()) / 2f;
matrix.postTranslate(translateX, translateY);
totalTranslateX = translateX;
totalTranslateY = translateY;
totalRatio = initRatio = 1f;
currentBitmapWidth = bitmapWidth;
currentBitmapHeight = bitmapHeight;
}
canvas.drawBitmap(sourceBitmap, matrix, null);
}
}
/**
* Calcola la distanza tra due dita.
* 
* @param event
* @return la distanza tra due dita
*/
@SuppressLint("NewApi") private double distanceBetweenFingers(MotionEvent event) {
float disX = Math.abs(event.getX(0) - event.getX(1));
float disY = Math.abs(event.getY(0) - event.getY(1));
return Math.sqrt(disX * disX + disY * disY);
}
/**
* 计算两个手指之间中心点的坐标。
* 
* @param event
*/
@SuppressLint("NewApi") private void centerPointBetweenFingers(MotionEvent event) {
float xPoint0 = event.getX(0);
float yPoint0 = event.getY(0);
float xPoint1 = event.getX(1);
float yPoint1 = event.getY(1);
centerPointX = (xPoint0 + xPoint1) / 2;
centerPointY = (yPoint0 + yPoint1) / 2;
}
}

布局中调用

以上所述是小编给大家介绍的Android通过自定义ImageView控件实现图片的缩放和拖动的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对呐喊教程网站的支持!

声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:notice#oldtoolbag.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立即删除涉嫌侵权内容。

Ti piacerebbe anche