May 6, 2011

Handle onTouchEvent in SurfaceView

Here Override onTouchEvent() in SurfaceView to handle user touch event.

Handle onTouchEvent in SurfaceView

package com.TestSurefaceView;

import java.util.Random;
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.SurfaceHolder;
import android.view.SurfaceView;

public class TestSurefaceView extends Activity {
 
 MySurfaceView mySurfaceView;
 
   /** Called when the activity is first created. */
   @Override
   public void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       mySurfaceView = new MySurfaceView(this);
       setContentView(mySurfaceView);
   }
  
   @Override
 protected void onResume() {
  // TODO Auto-generated method stub
  super.onResume();
  mySurfaceView.onResumeMySurfaceView();
 }

 @Override
 protected void onPause() {
  // TODO Auto-generated method stub
  super.onPause();
  mySurfaceView.onPauseMySurfaceView();
 }

 class MySurfaceView extends SurfaceView implements Runnable{
    
    Thread thread = null;
    SurfaceHolder surfaceHolder;
    volatile boolean running = false;
    
    private Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
    Random random;
    
    volatile boolean touched = false;
    volatile float touched_x, touched_y;

  public MySurfaceView(Context context) {
   super(context);
   // TODO Auto-generated constructor stub
   surfaceHolder = getHolder();
   random = new Random();
  }
  
  public void onResumeMySurfaceView(){
   running = true;
   thread = new Thread(this);
   thread.start();
  }
  
  public void onPauseMySurfaceView(){
   boolean retry = true;
   running = false;
   while(retry){
    try {
     thread.join();
     retry = false;
    } catch (InterruptedException e) {
     // TODO Auto-generated catch block
     e.printStackTrace();
    }
   }
  }

  @Override
  public void run() {
   // TODO Auto-generated method stub
   while(running){
    if(surfaceHolder.getSurface().isValid()){
     Canvas canvas = surfaceHolder.lockCanvas();
     //... actual drawing on canvas

     paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(3);
     
     int w = canvas.getWidth();
     int h = canvas.getHeight();
     int x = random.nextInt(w-1); 
     int y = random.nextInt(h-1);
     int r = random.nextInt(255);
     int g = random.nextInt(255);
     int b = random.nextInt(255);
     paint.setColor(0xff000000 + (r << 16) + (g << 8) + b);
     canvas.drawPoint(x, y, paint);
     
     if(touched){
      paint.setStrokeWidth(50);
      paint.setColor(Color.BLACK);
      canvas.drawPoint(touched_x, touched_y, paint);
     }
     
     surfaceHolder.unlockCanvasAndPost(canvas);
    }
   }
  }

  @Override
  public boolean onTouchEvent(MotionEvent event) {
   // TODO Auto-generated method stub
   
   touched_x = event.getX();
   touched_y = event.getY();
   
   int action = event.getAction();
   switch(action){
   case MotionEvent.ACTION_DOWN:
    touched = true;
    break;
   case MotionEvent.ACTION_MOVE:
    touched = true;
    break;
   case MotionEvent.ACTION_UP:
    touched = false;
    break;
   case MotionEvent.ACTION_CANCEL:
    touched = false;
    break;
   case MotionEvent.ACTION_OUTSIDE:
    touched = false;
    break;
   default:
   }
   return true; //processed
  }
    
   }
}


Related Post:
- A basic implementation of SurfaceView
- Drawing on SurfaceView
- Detect multi-touch, on SurfaceView
- Draw path on SurfaceView's canvas

9 comments:

  1. nice to have someone do a basic surfaceview primer, particularly as it's tied in with threading. the desciption in the docs is short and cryptic.

    ReplyDelete
  2. Hi
    Excellent tutorial, thanks for sharing your knowledge, I have a
    query ... I add an opaque background and an image on the view (macro)...but when I
    take a photo not recorded...have any idea how to do this

    ReplyDelete
    Replies
    1. this is the image http://dl.dropbox.com/u/46059390/fotos/imageOverlayAndroid.JPG
      the upper image is in main.xml and the other in the same control.xml

      Delete
  3. Hi

    Thanks for the tutorial and can we add a surfaceview into the live camera view with the onTouch Event???

    ReplyDelete
  4. Hi.. thanks for the code.. it helps me to get started... i have a question. i try to do some modifications to meet my need. i deleted the random point drawing and changed it to draw lines. but when i executed on my Galaxy Tab it shows me that the line drew was blinking.. do you have any idea why this is happen? thanks...

    andre.. acl.fisika@gmail.com

    ReplyDelete
  5. how to create 8 points in surface view and the points must be flexible

    ReplyDelete

Infolinks In Text Ads