tarofess
tarofess

Reputation: 200

Line isn't drawn in canvas

I want to draw line into a picture I took, but line isn't drawn. how to use Canvas is wrong? I think I don't understand how to use Canvas probably. where do I fix? please teach me.

PhotoMemoActivity

public class PhotoMemoActivity extends Activity {
    Uri _uri;
    Canvas _canvas;
    DrawCanvas _drawCanvas;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_photo_memo);
        takePicture();
        _drawCanvas = new DrawCanvas(getApplicationContext());
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data){
        if(requestCode == 0){
            if(resultCode == RESULT_OK){
                ImageView imageView = (ImageView)findViewById(R.id.picture);
                imageView.setImageURI(_uri);
                Bitmap bitmap = ((BitmapDrawable)imageView.getDrawable()).getBitmap();
                Bitmap drawableBitmap = bitmap.copy(Bitmap.Config.ARGB_8888, true);
                _canvas = new Canvas(drawableBitmap);
            }
        }
    }

    public void takePicture(){
        String fileName = System.currentTimeMillis() + ".png";
        ContentValues values = new ContentValues();
        values.put(MediaStore.Images.Media.TITLE, fileName);
        values.put(MediaStore.Images.Media.MIME_TYPE, "image/png");
        _uri = getContentResolver().insert(MediaStore.Images.Media.EXTERNAL_CONTENT_URI, values);

        Intent intent = new Intent();
        intent.setAction(MediaStore.ACTION_IMAGE_CAPTURE);
        intent.putExtra(MediaStore.EXTRA_OUTPUT, _uri);
        startActivityForResult(intent, 0);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.photo_memo, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        if (id == R.id.action_settings) {
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event){
        float firstX=0, firstY=0, lastX, lastY, x, y;

        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                firstX = event.getX();
                firstY = event.getY();
                break;
            case MotionEvent.ACTION_MOVE:
                lastX = event.getX();
                lastY = event.getY();
                _drawCanvas.draw(firstX, firstY, lastX, lastY, _canvas);
                break;
            default:
                break;
        }
        return true;
    }

}

DrawCanvas

public class DrawCanvas extends ImageView {

    public DrawCanvas(Context context){
        super(context);
    }

    public void draw(float firstX, float firstY, float lastX, float lastY, Canvas canvas){
        Paint p = new Paint();
        p.setStyle(Paint.Style.FILL);
        p.setColor(Color.GREEN);
        p.setStrokeWidth(10);
        canvas.drawLine(firstX, firstY, lastX, lastY, p);
        invalidate();
    }
}

Upvotes: 0

Views: 121

Answers (1)

Developer Paul
Developer Paul

Reputation: 1510

You're almost there you just need to combine your ideas. Make a single view that will handle drawing the taken picture and the drawing of a line ontop of the picture.

So just use your class "DrawCanvas". I'd look into the documents for a View and the general idea of creating a custom view, which is what you want to do here. Views already have a "onDraw" call, so just override it and add your own touch handling.

public class DrawCanvas extends ImageView {

private Bitmap curBitmap;
private Paint paint;
private Paint pathPaint;
private Path curPath;

public DrawCanvas(Context context){
    super(context);
}

private void initialize() {

pathPaint = new Paint();
pathPaint.setAntiAlias(true);
pathPaint.setStrokeWidth(2);
pathPaint.setStrokeSize(14);
pathPaint.setColor(Color.BLACK);

curPath = new Path();
paint = new Paint();
paint.setAntiAlias(true);
paint.setFilterBitmap(true);
paint.setDither(true);

//create the bitmap.
curBitmap = Bitmap.createBitmap(getWidth(), getHeight(), ARGB_8888);


}

public void onDraw(Canvas canvas) {
  //draw bitmap first. 
  canvas.drawBitmap(bitmap, x, y, paint);
  //draw the line
  canvas.drawPath(curPath, pathPaint);
}

@Override
public boolean onTouchEvent(MotionEvent event){


    switch (event.getAction()){
        case MotionEvent.ACTION_DOWN:
            //move to the current path
            curPath.moveTo(event.getX(), event.getY());
            break;
        case MotionEvent.ACTION_MOVE:
            curPath.lineTo(event.getX(), event.getY());
            break;
        case MotionEvent.ACTION_UP:
              //do something when the person lets go. 
        default:
            break;
    }
   // redraw the view. 
    invalidate();
    return true;
}


  public void setBitmapToDraw(Bitmap bitmap) {
    this.curBitmap = bitmap;
    invalidate();
  }

}

Then in your activity. Just set the bitmap in the view.

...other code....
   @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data){
        if(requestCode == 0){
            if(resultCode == RESULT_OK){
                ImageView imageView = (ImageView)findViewById(R.id.picture);
                imageView.setImageURI(_uri);
                Bitmap bitmap = ((BitmapDrawable)imageView.getDrawable()).getBitmap();
                Bitmap drawableBitmap = bitmap.copy(Bitmap.Config.ARGB_8888, true);
                drawView.setBitmapToDraw(drawableBitmap);
            }
        }
    }

See these links:

Android Bitmap

Android Path

Android

Android Canvas

Upvotes: 1

Related Questions