I want to erase by area where the finger is detected on the gray square bitmap but it don't works.
I display a bitmap with ic_launch as image then i display on the image a grey square Paint where i can to modify the color to the TRANSPARENT
What is the problem? Thank you
private Bitmap mBitmap;
private Canvas mCanvas;
private Path mPath;
private Paint mBitmapPaint;
private Paint mPaint;
public CaseView(Context c) {
super(c);
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeWidth(40);
mBitmap = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
for (int i = 0; i < 100; i++) {
for (int j = 0; j < 100; j++) {
mBitmap.setPixel(i, j, Color.GRAY);
}
}
mCanvas = new Canvas(mBitmap);
mPath = new Path();
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(0, 0, oldw, oldh);
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawRect(100, 100, 200, 200, mBitmapPaint);
canvas.drawPath(mPath, mPaint);
Bitmap _scratch = BitmapFactory.decodeResource(getResources(),
R.drawable.ic_launcher);
canvas.drawColor(Color.WHITE);
// logo
canvas.drawBitmap(_scratch, 0, 100, null);
for (int i = 0; i < 100; i++) {
for (int j = 0; j < 100; j++) {
if ((mX < 100 && mX >= 0) && (mY < 100 && mY >= 0)) {
mBitmap.setPixel((int) mY,(int) mX, Color.TRANSPARENT);
}
}
}
canvas.drawBitmap(mBitmap, 0, 100, mBitmapPaint);
Bitmap mutableBitmap = Bitmap.createBitmap(_scratch.getWidth(),
_scratch.getHeight(), Bitmap.Config.ARGB_8888);
mutableBitmap.setPixel(50, 50, 124);
canvas.drawBitmap(mutableBitmap, 0, 100, null);
int pixelColor = mBitmap.getPixel(50, 50);
int red = Color.red(pixelColor);
int green = Color.green(pixelColor);
Log.v("red", "red:" + red + " /green:" + green);
}
private float mX, mY;
private static final float TOUCH_TOLERANCE = 4;
private void touch_start(float x, float y) {
mPath.reset();
mPath.moveTo(x, y);
mX = x;
mY = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
mX = x;
mY = y;
}
}
private void touch_up() {
mPath.lineTo(mX, mY);
// commit the path to our offscreen
mCanvas.drawPath(mPath, mPaint);
// kill this so we don't double draw
mPath.reset();
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
Log.v("onTouchEvent", "x:" + x + "/y:" + y);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up();
invalidate();
break;
}
return true;
}
For Drawing you need to draw a path using one Paint class. But for erasing again you have to draw one path on your touch Coordinate like this
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
In android-sdk sample they had given a class FingerPaint that explain it very well
Related
I was using this class to draw like pen tool with multi color it is working good but when i change color ,it does not change color in between choosing color. i checked and try many solution they don't have any solution.
public class DrawingView extends View {
private static final float TOUCH_TOLERANCE = 4;
Paint mPaint;
//MaskFilter mEmboss;
//MaskFilter mBlur;
Bitmap mBitmap;
Canvas mCanvas;
Path mPath;
Paint mBitmapPaint;
ProgressDialog pd;
String color;
private ArrayList<Path> paths = new ArrayList<Path>();
private ArrayList<Paint> paints = new ArrayList<Paint>();
private ArrayList<Integer> colorlist = new ArrayList<Integer>();
private float mX, mY;
public DrawingView(Context context, String color) {
super(context);
// TODO Auto-generated constructor stub
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(10);
pd = new ProgressDialog(context);
mPath = new Path();
paths.add(mPath);
mBitmapPaint = new Paint();
paints.add(mPaint);
colorlist.add(Color.parseColor(color));
mBitmapPaint.setColor(Color.parseColor(color));
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
if (w > 0 && h > 0) {
mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
} else {
mBitmap = Bitmap.createBitmap(300, 250, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
}
}
#Override
public void draw(Canvas canvas) {
// TODO Auto-generated method stub
super.draw(canvas);
canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
// canvas.drawPath(mPath, mPaint);
int count = paints.size();
for (int i = 0; i < count; i++) {
mPaint.setColor(colorlist.get(i));
canvas.drawPath(paths.get(i), mPaint);
}
}
private void touch_start(float x, float y) {
mPath.reset();
mPath.moveTo(x, y);
mX = x;
mY = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
mX = x;
mY = y;
}
}
private void touch_up() {
mPath.lineTo(mX, mY);
// commit the path to our offscreen
mCanvas.drawPath(mPath, mPaint);
//mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SCREEN));
// kill this so we don't double draw
mPath.reset();
// mPath= new Path();
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up();
invalidate();
break;
}
return SMILEY;
}
}
i'm using this class to draw painting, i'm using this class in activity like this.
mDrawingView = new DrawingView(getApplicationContext(), color);
mDrawingPad.addView(mDrawingView);
mDrawingPad is a linear layout in which i'm creating view.
I got the solution of this problem from here
I made some changes according to this solution in my code and finally i found it.
public class DrawingView extends View {
private static final float TOUCH_TOLERANCE = 4;
Paint mPaint;
//MaskFilter mEmboss;
//MaskFilter mBlur;
Bitmap mBitmap;
Canvas mCanvas;
Path mPath;
Paint mBitmapPaint;
ProgressDialog pd;
String color;
ArrayList<Pair<Path, Paint>> p = new ArrayList<Pair<Path, Paint>>();
private ArrayList<Path> paths = new ArrayList<Path>();
private ArrayList<Paint> paints = new ArrayList<Paint>();
private float mX, mY;
public DrawingView(Context context, String color) {
super(context);
// TODO Auto-generated constructor stub
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
// mPaint.setColor(Color.parseColor(color));
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(10);
pd = new ProgressDialog(context);
mPath = new Path();
paths.add(mPath);
mBitmapPaint = new Paint();
paints.add(mPaint);
p.add(new Pair<Path, Paint>(mPath, mPaint));
//colorlist.put(mPath,color);
mBitmapPaint.setColor(Color.parseColor(color));
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
if (w > 0 && h > 0) {
mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
} else {
mBitmap = Bitmap.createBitmap(300, 250, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
}
}
#Override
public void draw(Canvas canvas) {
// TODO Auto-generated method stub
super.draw(canvas);
canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
// canvas.drawPath(mPath, mPaint);
for (Pair<Path, Paint> pp : p) {
canvas.drawPath(pp.first, pp.second);
}
}
private void touch_start(float x, float y) {
mPaint.setColor(ImageEditOptionActivity.pencolor);
mPath.reset();
mPath.moveTo(x, y);
mX = x;
mY = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
mX = x;
mY = y;
}
}
private void touch_up() {
mPath.lineTo(mX, mY);
// commit the path to our offscreen
mCanvas.drawPath(mPath, mPaint);
//mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SCREEN));
// kill this so we don't double draw
p.add(new Pair<Path, Paint>(mPath, mPaint));
mPath.reset();
mPath = new Path();
//colorlist.put(mPath,color);
mPaint = new Paint(mPaint);
p.add(new Pair<Path, Paint>(mPath, mPaint));
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up();
invalidate();
break;
}
return SMILEY;
}
}
this has been driving me a little crazy today. I've implimented this class which enables me to draw lines over an image file. however I want to be able to to add a template mask at creation time. Whatever I try i.e. within the class or from the calling class it causes a Null pointer exception, if however I put the call into a button in the calling class then I can get it to work?
here is the class I'm using. You can see the commented out section, if I call "coverScreen()" from here it causes the NPE. Also from the main Activity where I create the maskBoard if I call "coverScreen()" it causes NPE. But as mentioned if I add a button, and put the "coverScreen()" into this button onclick then it works?
public class MaskBoard extends View {
private String TAG = "Test APP - maskboard";
private int mx = -1;
private int my = -1;
private Bitmap mainImage = null;
private Bitmap bm = null;
private Paint mPaint = null;
public final int CLOSER = 50;
public final int CLOSE = 100;
private Bitmap mBitmap;
private Canvas mCanvas;
private Path mPath;
private Paint mBitmapPaint;
public MaskBoard(Context c, AttributeSet s) {
super(c, s);
String fileToMask = "/__temppic.png";
File imagePath = Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_PICTURES + "/temp/");
File imgFile = new File(imagePath+fileToMask);
if (imgFile.exists()) {
bm = BitmapFactory.decodeFile(imgFile.getAbsolutePath());
Log.i(TAG, "found image");
}
mPath = new Path();
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
mPaint = new Paint();
mPaint.setAntiAlias(false);
mPaint.setDither(true);
mPaint.setColor(0xFFFE0000); // FFFF0000
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(50);
/* coverScreen() */
setEraser();
}
public void coverScreen() {
Bitmap maskImage = BitmapFactory.decodeResource(getResources(), R.drawable.mask); //get mask image
maskImage = Bitmap.createScaledBitmap(maskImage, bm.getWidth(), bm.getHeight(), true);
mPaint.setXfermode(null);
mCanvas.drawBitmap(maskImage,0,0,mPaint);
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
}
public void setEraser() {
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
}
public void setPaint() {
mPaint.setXfermode(null);
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
Log.i(TAG, "onsizechanged");
mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
}
#Override
protected void onDraw(Canvas canvas) {
Log.i(TAG, "onDraw");
canvas.drawRect(0,0, getWidth(), getHeight(), mPaint);
canvas.drawColor(0xFFAAAAAA);
canvas.drawBitmap(bm, mx, my, null);
canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
canvas.drawPath(mPath, mPaint);
}
private float mX, mY;
private static final float TOUCH_TOLERANCE = 4;
private void touch_start(float x, float y) {
mPath.reset();
mPath.moveTo(x, y);
mX = x;
mY = y;
Log.i(TAG, " touchdown: X(" + x + "), Y(" + y + ")");
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
mX = x;
mY = y;
Log.i(TAG, " touchmove: X(" + x + "), Y(" + y + ")");
}
}
private void touch_up() {
mPath.lineTo(mX, mY);
// commit the path to our offscreen
mCanvas.drawPath(mPath, mPaint);
// kill this so we don't double draw
mPath.reset();
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
// coverScreen() ;
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up();
invalidate();
break;
}
return true;
}
}
I would make that:
How do you do that? I have fixed the position of draws, Is there an other method with TableLayout for example because i would integrated drawing with other views. Thank you.
public class CaseView extends View {
private static final float MINP = 1f;
private static final float MAXP = 1f;
private Bitmap mBitmap1, mBitmap2, mBitmap3, _scratch1 = null,
_scratch2 = null;
private Canvas mCanvas1;
private Canvas mCanvas2, mCanvas3;
private Path mPath1, mPath2;
private Paint mBitmapPaint1;
private Paint mBitmapPaint2, mBitmapPaint3;
private Paint mPaint1;
private Paint mPaint2, mPaint3;
private int IdImage;
private int positionTop = 0;
private int positionLeftOne = 0;
private int positionLeftTwo = 0;
private int positionLeftThree = 0, mHeightCase = 100,
widthBetweenCase = 0;
private String colorGold = "#E29F2B";
private boolean firstTime = false;
// private Bitmap image;
// private Paint paint;
boolean isErase;
public CaseView(Context ctx, AttributeSet attrs) {
super(ctx, attrs);
}
public CaseView(Context c, int resId, DisplayMetrics metrics) {
super(c);
this.positionTop = metrics.heightPixels / 2 - mHeightCase / 2;
int weightRest = metrics.widthPixels - 3 * mHeightCase;
this.widthBetweenCase = weightRest / 4;
this.positionLeftOne = widthBetweenCase;
this.positionLeftTwo = (widthBetweenCase * 2) + mHeightCase;
this.positionLeftThree = (widthBetweenCase * 3) + mHeightCase * 2;
firstTime = true;
mPaint1 = new Paint();
// mPaint1.setAntiAlias(true);
// mPaint1.setDither(true);
mPaint1.setColor(Color.TRANSPARENT);
mPaint1.setStyle(Paint.Style.STROKE);
mPaint1.setStrokeWidth(60);
mPaint2 = new Paint();
// mPaint2.setAntiAlias(true);
// mPaint2.setDither(true);
mPaint2.setColor(Color.TRANSPARENT);
mPaint2.setStyle(Paint.Style.STROKE);
mPaint2.setStrokeWidth(60);
// create a square
mBitmap1 = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
for (int i = 0; i < 100; i++) {
for (int j = 0; j < 100; j++) {
mBitmap1.setPixel(i, j, Color.parseColor(colorGold));
}
}
mBitmap2 = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
for (int i = 0; i < 100; i++) {
for (int j = 0; j < 100; j++) {
mBitmap2.setPixel(i, j, Color.parseColor(colorGold));
}
}
mCanvas1 = new Canvas(mBitmap1);
mCanvas2 = new Canvas(mBitmap2);
mPath1 = new Path();
mPath2 = new Path();
mBitmapPaint1 = new Paint(Paint.DITHER_FLAG);
mBitmapPaint2 = new Paint(Paint.DITHER_FLAG);
mBitmapPaint3 = new Paint(Paint.DITHER_FLAG);
IdImage = resId;
if (_scratch1 == null) {
_scratch1 = BitmapFactory.decodeResource(getResources(), IdImage);
}
if (_scratch2 == null) {
_scratch2 = BitmapFactory.decodeResource(getResources(), IdImage);
}
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
}
#Override
protected void onDraw(Canvas canvas) {
Log.v("", "onDraw");
canvas.drawColor(Color.WHITE);
// first case
canvas.drawBitmap(_scratch1, positionLeftOne, positionTop, null);
canvas.drawBitmap(mBitmap1, positionLeftOne, positionTop,
mBitmapPaint1);
// canvas.drawBitmap(mBitmap1, null, new Rect(0,0,100,100),
// mBitmapPaint1);
// second case
canvas.drawBitmap(_scratch2, positionLeftTwo,
positionTop, null);
canvas.drawBitmap(mBitmap2, positionLeftTwo,
positionTop, mBitmapPaint2);
// mBitmap = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
if ((mX < mHeightCase + positionLeftOne && mX >= positionLeftOne)
&& (mY < positionTop + mHeightCase && mY >= positionTop)) {
// Log.v("onDraw", "x:" + mX + "/y:" + mY);
mPaint1.setMaskFilter(null);
mPath1.reset();
Log.v("first case","clear at"+mX);
mPaint1.setXfermode(new PorterDuffXfermode(Mode.CLEAR));
// mBitmap.setPixel((int) mY,(int) mX, Color.TRANSPARENT);
// mBitmap1.eraseColor(Color.TRANSPARENT);
mCanvas1.setBitmap(mBitmap1);
canvas.drawBitmap(mBitmap1, positionLeftOne, positionTop, mBitmapPaint1);
invalidate();
} else if ((mX < positionLeftTwo+mHeightCase && mX >= positionLeftTwo)
&& (mY < positionTop + mHeightCase && mY >= positionTop)) {
// Log.v("onDraw", "x:" + mX + "/y:" + mY);
mPaint2.setMaskFilter(null);
mPath2.reset();
mPaint2.setXfermode(new PorterDuffXfermode(Mode.CLEAR));
// mBitmap.setPixel((int) mY,(int) mX, Color.TRANSPARENT);
mCanvas2.setBitmap(mBitmap2);
canvas.drawBitmap(mBitmap2, positionLeftTwo, positionTop, mBitmapPaint2);
invalidate();
} else {
mPaint1.setXfermode(null);
mPaint2.setXfermode(null);
}
super.onDraw(canvas);
int pixelColor = mBitmap1.getPixel(50, 50);
int red = Color.red(pixelColor);
int green = Color.green(pixelColor);
Log.v("red", "red:" + red + " /green:" + green);
//invalidate();
}
private Bitmap prepareBitmap(Drawable drawable, int width, int height) {
Bitmap bitmap = Bitmap.createBitmap(width, height,
Bitmap.Config.ARGB_8888);
drawable.setBounds(0, 0, width, height);
Canvas canvas = new Canvas(bitmap);
drawable.draw(canvas);
return bitmap;
}
private float mX, mY;
private static final float TOUCH_TOLERANCE = 4;
private void touch_start(float x, float y) {
mPath1.reset();
mPath1.moveTo(x, y);
mPath2.reset();
mPath2.moveTo(x, y);
mX = x;
mY = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath1.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
mPath2.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
mX = x;
mY = y;
}
}
private void touch_up() {
mPath1.lineTo(mX, mY);
mPath2.lineTo(mX, mY);
// commit the path to our offscreen
mCanvas1.drawPath(mPath1, mPaint1);
mCanvas2.drawPath(mPath2, mPaint2);
// kill this so we don't double draw
mPath1.reset();
mPath2.reset();
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
Log.v("onTouchEvent", "x:" + x + "/y:" + y);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
if ((mX < positionLeftOne+mHeightCase && mX >= positionLeftOne)
&& (mY < positionTop + mHeightCase && mY >= positionTop)) {
mPath1.reset();
mPaint1.setMaskFilter(null);
mPaint1.setStrokeWidth(90);
mPaint1.setXfermode(new PorterDuffXfermode(Mode.CLEAR));
// mCanvas1.draw(x, y, 10, mPaint1);
isErase = true;
} else {
mPaint1.setXfermode(null);
isErase = false;
}
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
if (isErase) {
mCanvas1.drawCircle(x, y, 20, mPaint1);
}
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
if (isErase) {
mCanvas1.drawCircle(x, y, 20, mPaint1);
}
touch_up();
invalidate();
break;
}
return true;
}
}
Not quite sure what your actual question is.
If you simply wanna reach a view as in the image you'd be better off simply having a view in XML.
Create a horizontal LinearLayout, with 3 custom squares included and use the android:layout_weight attribute to let them fill up the space by themselves.
I want to do a game, a scratch game (mPaint1.setXfermode(new PorterDuffXfermode(Mode.CLEAR)); ) with 3 independants cases center on the screen. How to do that?
http://img822.imageshack.us/img822/868/35861879.png
Only one case on the screen display. When theses 3 cases are cleared then the score display in function of displayed images. Thank you.
public class MainActivity extends Activity {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView image = new ImageView(this);
image.setImageResource(R.drawable.ic_launcher);
CaseView caseOne=new CaseView(this, R.drawable.ic_launcher, 0);
//TableLayout table = (TableLayout)findViewById(R.id.matable);
TableRow tablerow = (TableRow)findViewById(R.id.marow);
//table.setLayoutParams(tableParams);
tablerow.addView(caseOne);
}
public class CaseView extends View {
private static final float MINP = 1f;
private static final float MAXP = 1f;
private Bitmap mBitmap1, _scratch = null;
private Canvas mCanvas1;
private Canvas mCanvas2, mCanvas3;
private Path mPath1;
private Paint mBitmapPaint1;
private Paint mPaint1;
private int IdImage;
private int positionTop = 0;
private String colorGold = "#E29F2B";
private boolean firstTime = false;
// private Bitmap image;
// private Paint paint;
boolean isErase;
public CaseView(Context ctx, AttributeSet attrs) {
super(ctx, attrs);
}
public CaseView(Context c, int resId, int positionTop) {
super(c);
this.positionTop = positionTop;
firstTime = true;
mPaint1 = new Paint();
mPaint1.setAntiAlias(true);
mPaint1.setDither(true);
mPaint1.setColor(Color.TRANSPARENT);
mPaint1.setStyle(Paint.Style.STROKE);
mPaint1.setStrokeWidth(60);
// create a square
mBitmap1 = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
for (int i = 0; i < 100; i++) {
for (int j = 0; j < 100; j++) {
mBitmap1.setPixel(i, j, Color.parseColor(colorGold));
}
}
mCanvas1 = new Canvas(mBitmap1);
mPath1 = new Path();
mBitmapPaint1 = new Paint(Paint.DITHER_FLAG);
// mBitmapPaint3 = new Paint(Paint.DITHER_FLAG);
IdImage = resId;
if (_scratch == null) {
_scratch = BitmapFactory.decodeResource(getResources(), IdImage);
}
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
}
#Override
protected void onDraw(Canvas canvas) {
// Log.v("", "onDraw");
canvas.drawColor(Color.WHITE);
// logo
canvas.drawBitmap(_scratch, 0, positionTop, null);
// canvas.drawBitmap(mBitmap1, null, new Rect(0,0,100,100),
// mBitmapPaint1);
canvas.drawBitmap(mBitmap1, 0, positionTop, mBitmapPaint1);
canvas.drawBitmap(_scratch, 0, 400, null);
canvas.drawBitmap(mBitmap2, 0, 400, mBitmapPaint2);
// mBitmap = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
if ((mX < 100 && mX >= 0)
&& (mY < positionTop + 100 && mY >= positionTop)) {
// Log.v("onDraw", "x:" + mX + "/y:" + mY);
mPaint1.setMaskFilter(null);
mPath1.reset();
mPaint1.setXfermode(new PorterDuffXfermode(Mode.CLEAR));
// mBitmap.setPixel((int) mY,(int) mX, Color.TRANSPARENT);
// mBitmap1.eraseColor(Color.TRANSPARENT);
mCanvas1.setBitmap(mBitmap1);
canvas.drawBitmap(mBitmap1, 0, positionTop, mBitmapPaint1);
invalidate();
} else {
mPaint1.setXfermode(null);
}
super.onDraw(canvas);
int pixelColor = mBitmap1.getPixel(50, 50);
int red = Color.red(pixelColor);
int green = Color.green(pixelColor);
Log.v("red", "red:" + red + " /green:" + green);
// invalidate();
}
private float mX, mY;
private static final float TOUCH_TOLERANCE = 4;
private void touch_start(float x, float y) {
mPath1.reset();
mPath1.moveTo(x, y);
mX = x;
mY = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath1.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
mPath2.quadTo(mX, mY, (x + mX) / 2, (y + mY) / 2);
mX = x;
mY = y;
}
}
private void touch_up() {
mPath1.lineTo(mX, mY);
mPath2.lineTo(mX, mY);
// commit the path to our offscreen
mCanvas1.drawPath(mPath1, mPaint1);
// kill this so we don't double draw
mPath1.reset();
}
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
Log.v("onTouchEvent", "x:" + x + "/y:" + y);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
if ((mX < 100 && mX >= 0)
&& (mY < positionTop + 100 && mY >= positionTop)) {
mPath1.reset();
mPaint1.setMaskFilter(null);
mPaint1.setStrokeWidth(90);
mPaint1.setXfermode(new PorterDuffXfermode(Mode.CLEAR));
// mCanvas1.draw(x, y, 10, mPaint1);
isErase = true;
} else {
mPaint1.setXfermode(null);
isErase = false;
}
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
if (isErase) {
mCanvas1.drawCircle(x, y, 20, mPaint1);
}
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
if (isErase) {
mCanvas1.drawCircle(x, y, 20, mPaint1);
}
touch_up();
invalidate();
break;
}
return true;
}
}
I have already seen fingurePaint.java from API demos. I want to implement touch smooth eraser to erase parts of the image by touch move in android.
fingurePaint told me to implement this
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
But this is not working to erase the image. It is working to erase something which is drawn by touch.
public class SandboxView extends View implements OnTouchListener {
public final Bitmap bitmap;
private final int width;
private final int height;
private Matrix transform = new Matrix();
private Vector2D position = new Vector2D();
private float scale = 1;
private float angle = 0;
public boolean isInitialized = false;
private TouchManager touchManager = new TouchManager(2);
final GestureDetector mGesDetect;
// Debug helpers to draw lines between the two touch points
private Vector2D vca = null;
private Vector2D vcb = null;
private Vector2D vpa = null;
private Vector2D vpb = null;
private float mX, mY;
private static final float TOUCH_TOLERANCE = 4;
private Path mPath;
private Canvas mCanvas;
private Paint mPaint;
private Paint mBitmapPaint;
public SandboxView(Context context, Bitmap bitmap) {
super(context);
this.bitmap = bitmap;
this.width = bitmap.getWidth();
this.height = bitmap.getHeight();
this.mGesDetect = new GestureDetector(context, new DoubleTapGestureDetector());
setOnTouchListener(this);
}
private float getDegreesFromRadians(float angle) {
return (float)(angle * 360.0 / Math.PI);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (!isInitialized) {
Bitmap mBitmap = bitmap.createBitmap(320, 480, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
mPaint = new Paint();
mPath = new Path();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setColor(0xFFFF0000);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(12);
mPaint.setAlpha(0);
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
mPaint.setAntiAlias(true);
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
int w = getWidth();
int h = getHeight();
position.set(w / 2, h / 2);
isInitialized = true;
}
if(isEraser==1){
canvas.drawColor(80000000);
canvas.drawBitmap(bitmap, transform, mBitmapPaint);
canvas.drawPath(mPath, mPaint);
}
else{
Paint paint = new Paint();
transform.reset();
transform.postTranslate(-width / 2.0f, -height / 2.0f);
transform.postRotate(getDegreesFromRadians(angle));
transform.postScale(scale, scale);
transform.postTranslate(position.getX(), position.getY());
canvas.drawBitmap(bitmap, transform, paint);
try {
/*paint.setColor(0xFF007F00);
canvas.drawCircle(vca.getX(), vca.getY(), 64, paint);
paint.setColor(0xFF7F0000);
canvas.drawCircle(vcb.getX(), vcb.getY(), 64, paint);
paint.setColor(0xFFFF0000);
canvas.drawLine(vpa.getX(), vpa.getY(), vpb.getX(), vpb.getY(), paint);
paint.setColor(0xFF00FF00);
canvas.drawLine(vca.getX(), vca.getY(), vcb.getX(), vcb.getY(), paint);*/
}
catch(NullPointerException e) {
// Just being lazy here...
}
}
}
private void touch_start(float x, float y) {
mPath.reset();
mPath.moveTo(x, y);
mX = x;
mY = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
mX = x;
mY = y;
}
}
private void touch_up() {
mPath.lineTo(mX, mY);
mCanvas.drawPath(mPath, mPaint);
mPath.reset();
}
#Override
public boolean onTouch(View v, MotionEvent event) {
if(isEraser ==1){
float x = event.getX();
float y = event.getY();
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up();
invalidate();
break;
}
return true;
}
else{
vca = null;
vcb = null;
vpa = null;
vpb = null;
mGesDetect.onTouchEvent(event);
try {
touchManager.update(event);
if (touchManager.getPressCount() == 1) {
vca = touchManager.getPoint(0);
vpa = touchManager.getPreviousPoint(0);
position.add(touchManager.moveDelta(0));
}
else {
if (touchManager.getPressCount() == 2) {
vca = touchManager.getPoint(0);
vpa = touchManager.getPreviousPoint(0);
vcb = touchManager.getPoint(1);
vpb = touchManager.getPreviousPoint(1);
Vector2D current = touchManager.getVector(0, 1);
Vector2D previous = touchManager.getPreviousVector(0, 1);
float currentDistance = current.getLength();
float previousDistance = previous.getLength();
if (previousDistance != 0) {
scale *= currentDistance / previousDistance;
}
angle -= Vector2D.getSignedAngleBetween(current, previous);
}
}
invalidate();
}
catch(Throwable t) {
// So lazy...
}
return true;
}
}
class DoubleTapGestureDetector extends GestureDetector.SimpleOnGestureListener {
#Override
public boolean onDoubleTap(MotionEvent e) {
colorseekbar.setVisibility(View.INVISIBLE);
opacityseekbar.setVisibility(View.INVISIBLE);
return true;
}
}
}
So please help me to erase the parts of image by using touch move.
Thanks in advance.
First Declar your paint with all property in your constructor.
Write this code in your onDraw() method
#Override
protected void onDraw(Canvas canvas)
{
System.out.println("come in on draw......");
canvas.drawColor(Color.TRANSPARENT);
canvas.drawBitmap(mBitmap, 0, 0, mPaint);
if(eraser==true)
mPaint.setColor(Color.TRANSPARENT):
else
mPaint.setColor(Color.RED):
canvas.drawPath(mPath, mPaint);
super.dispatchDraw(canvas);
}
second solution:
call below method in your touch_move() method
mBitmap.setPixel(x, y, Color.TRANSPARENT); This method will change your bitmap you have to pass only X,Y & COLOR
public void changeBitmap(int x, int y, Bitmap mBitmap)
{
Bitmap tempBitmap = Bitmap.createBitmap(mBitmap); //Edited code
tempBitmap.setPixel(x, y, Color.TRANSPARENT);
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mX);
float dy = Math.abs(y - mY);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
mPath.quadTo(mX, mY, (x + mX)/2, (y + mY)/2);
mX = x;
mY = y;
changeBitmap(x, y, your_bitmap)
}
}
Isn't it better to invert this case ? Just paint on your image with background color and after all when saving, merge those layers if needed.
Define a temporary canvas and bitmap then draw your path or line, circle, image anything on touch events and then pass this temporary bitmap to canvas in onDraw your work will done properly, and also if you want to do erasing then do your erasing on that temporary canvas.
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
TemporaryBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_4444);
TemporaryCanvas = new Canvas(TemporaryBitmap);
}
TemporaryCanvas.drawColor(0, PorterDuff.Mode.clear);
public void onDraw(Canvas canv){
canv.drawBitmap(TemporaryBitmap, matrix, paint);