Custom ImageView to show touched portion only

Here is a custom ImageView (TouchImageView), override onTouchEvent(MotionEvent event) and onDraw(Canvas canvas) methods, to make it display the touched portion only.

package com.example.androidtouchimageview;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapShader;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Shader;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.ImageView;

public class TouchImageView extends ImageView {

 private float radius = 0;
 private Paint paint = null;

 private float x;
 private float y;
 private boolean touched = false;

 public TouchImageView(Context context) {
  super(context);
  // TODO Auto-generated constructor stub
 }

 public TouchImageView(Context context, AttributeSet attrs) {
  super(context, attrs);
  // TODO Auto-generated constructor stub
 }

 public TouchImageView(Context context, AttributeSet attrs, int defStyleAttr) {
  super(context, attrs, defStyleAttr);
  // TODO Auto-generated constructor stub
 }

 @Override
 public boolean onTouchEvent(MotionEvent event) {
  int action = event.getAction();
  touched = (action == MotionEvent.ACTION_DOWN 
    || action == MotionEvent.ACTION_MOVE);
  x = event.getX();
  y = event.getY();
  
  int w = getWidth();
  int h = getHeight();
  if(w>=h){
   radius = h * event.getSize();
  }else{
   radius = w * event.getSize();
  }
  
  invalidate();
  return true;
 }

 @Override
 protected void onDraw(Canvas canvas) {
  if (paint == null) {
   Bitmap bm = Bitmap.createBitmap(
    getWidth(), 
    getHeight(),
    Bitmap.Config.ARGB_8888);
   Canvas originalCanvas = new Canvas(bm);
   super.onDraw(originalCanvas);

   Shader shader = new BitmapShader(bm, 
    Shader.TileMode.CLAMP,
    Shader.TileMode.CLAMP);

   paint = new Paint();
   paint.setShader(shader);
  }

  canvas.drawColor(getSolidColor());
  if (touched) {
   canvas.drawCircle(x, y, radius, paint);
  }
 }

}

Layout

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:orientation="vertical"
    tools:context="com.example.androidtouchimageview.MainActivity" >

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="lesapplication.blogspot.com"
        android:textSize="28dp"
        android:textStyle="bold" />
    
    <com.example.androidtouchimageview.TouchImageView
        android:id="@+id/image1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher" />
    
    <com.example.androidtouchimageview.TouchImageView
        android:id="@+id/image2"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/ic_launcher" />

</LinearLayout>

Tweet