Android - Wie kreisförmig vergrößern/verkleinern Sie einen Teil des Bildes?

Question

Ich versuche, dem Benutzer zu erlauben, das Bild zu berühren, und dann wird im Grunde eine kreisförmige Lupe zeigen, die es dem Benutzer erlauben wird, einen bestimmten Bereich auf dem Bild besser auszuwählen. Wenn der Benutzer die Berührung freigibt, verschwindet der vergrößerte Teil. Dies wird in mehreren Fotobearbeitungs-Apps verwendet und ich versuche, meine eigene Version davon zu implementieren. Der Code, den ich unten habe, vergrößert einen kreisförmigen Teil der Bildansicht, löscht oder löscht den Zoom jedoch nicht, sobald ich meinen Finger loslasse. Ich setze derzeit eine Bitmap auf eine Leinwand mit canvas = new Canvas(bitMap); und dann die Bildansicht mit takenPhoto.setImageBitmap(bitMap); Ich bin mir nicht sicher, ob ich den richtigen Weg gehe. Der OnTouch Code ist unten:

zoomPos = new PointF(0,0); 
     takenPhoto.setOnTouchListener(new OnTouchListener() { 

      @Override 
      public boolean onTouch(View v, MotionEvent event) { 
       int action = event.getAction(); 
        switch (action) { 
         case MotionEvent.ACTION_DOWN: 
          zoomPos.x = event.getX(); 
          zoomPos.y = event.getY(); 
          matrix.reset(); 
          matrix.postScale(2f, 2f, zoomPos.x, zoomPos.y); 
          shader.setLocalMatrix(matrix); 
          canvas.drawCircle(zoomPos.x, zoomPos.y, 20, shaderPaint); 
          takenPhoto.invalidate(); 
          break; 
         case MotionEvent.ACTION_MOVE: 
          zoomPos.x = event.getX(); 
          zoomPos.y = event.getY(); 
          matrix.reset(); 
          matrix.postScale(2f, 2f, zoomPos.x, zoomPos.y); 
          canvas.drawCircle(zoomPos.x, zoomPos.y, 20, shaderPaint); 
          takenPhoto.invalidate(); 
          break; 
         case MotionEvent.ACTION_UP: 
          //clear zoom here? 

          break; 
         case MotionEvent.ACTION_CANCEL: 
          break; 
         default: 
          break; 
      } 
        return true; 
      } 
      }); 

Answer 1

Anpassung Ihres Codes, konnte ich den folgenden Ansatz arbeiten.

In der OnTouch Funktion stellte einen globalen Punkt für die Bestimmung, wo der Benutzer berührt hat, und einen boolean gesetzt, um anzuzeigen, ob Zoomen momentan aktiv ist oder nicht:

@Override 
public boolean onTouch(View view, MotionEvent event) { 

    int action = event.getAction(); 

    zoomPos.x = event.getX(); 
    zoomPos.y = event.getY(); 

    switch (action) { 
    case MotionEvent.ACTION_DOWN: 
    case MotionEvent.ACTION_MOVE: 
     zooming = true; 
     this.invalidate(); 
     break; 
    case MotionEvent.ACTION_UP: 
    case MotionEvent.ACTION_CANCEL: 
     zooming = false; 
     this.invalidate(); 
     break; 

    default: 
     break; 
    } 

    return true; 
} 

, dann in der OnDraw-Methode, Sie verwenden Sie den Code für die Erstellung der in Teil gezoomt:

@Override 
protected void onDraw(Canvas canvas) { 

    super.onDraw(canvas); 

    if (zooming) { 
     matrix.reset(); 
     matrix.postScale(2f, 2f, zoomPos.x, zoomPos.y); 
     mPaint.getShader().setLocalMatrix(matrix); 

     canvas.drawCircle(zoomPos.x, zoomPos.y, 100, mPaint); 
    } 
} 

Beachten Sie, dass für den Shader, ich habe ein Bitmap-Shader verwendet als here beschrieben, die erstellt wurde:

mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.image); 
mShader = new BitmapShader(mBitmap, TileMode.CLAMP, TileMode.CLAMP); 

mPaint = new Paint(); 
mPaint.setShader(mShader); 

Answer 2

Der beste Weg, um alle Änderungen am Bild vorgenommen zufällt, das Bild aus der Quelldatei neu zu laden. Oder behalten Sie alternativ die ursprüngliche Matrixvariable a copy vor Beginn der Transformationen bei, während MotionEvent.ACTION_UP die ursprüngliche Matrix lädt.

Answer 3

Sie können es implementieren, indem Sie eine benutzerdefinierte Bildansicht verwenden, Erstellen Sie eine Klasse CodesforMagnifierImageView.java in Ihrem Paket. Sie können den Code für die jeweilige Klasse bei CodesforMagnifier.java sehen und einfach den folgenden Code in Ihrer Layout-Datei verwenden, anstatt für die Imageview

<com.yourpackage.CodesforMagnifierImageView 
    android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:src="@drawable/your image" />