Cách tạo Thẻ cào trong Android?

Question

Tôi cần tạo ứng dụng "Thẻ cào" cho dự án cuối cùng của mình ở trường và không thể tìm cách triển khai sự kiện gãi (Làm cách nào để tạo hình nền và đặt hình chữ nhật Xám lên trên) những hình chữ nhật đó, tôi sẽ thấy hình ảnh bên dưới)

Việc triển khai phải ở trong Android vì tôi chưa phát triển theo mục tiêu-C.

Tôi đã xem tham chiếu cho Thực hiện mục tiêu-C, nhưng không tốt vì tôi không hiểu nó.

Mã của tôi là:

public class FingerPaint extends Activity { 

    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.main); 

     try { 
      MyView myView = new MyView(this); 
      myView.requestFocus(); 
      myView.PaintObjectInit(); 
      // setContentView(myView); 

      LinearLayout upper = (LinearLayout) findViewById(R.id.LinearLayout01); 
      upper.addView(myView); 
     } catch (Exception e) { 
      // TODO: handle exception 
      e.printStackTrace(); 
     } 

     // MyImageView myImageView = new MyImageView(this); 
     // setContentView(myImageView); 
    } 
} 



public class MyView extends View { 

    private Paint mPaint; 
    private Bitmap mBitmap; 
    private Canvas mCanvas; 
    private Path mPath; 
    private Paint mBitmapPaint; 

    public MyView(Context context) { 
     super(context); 
     this.mPaint = new Paint(); 
     mPath = new Path(); 
     mBitmapPaint = new Paint(Paint.DITHER_FLAG); 
    } 

    protected void PaintObjectInit() { 
     mPaint.setAntiAlias(true); 
     mPaint.setDither(true); 
     //mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR)); 
     //mPaint.setColor(0xFFFF0000); 
     mPaint.setStyle(Paint.Style.STROKE); 
     mPaint.setStrokeJoin(Paint.Join.ROUND); 
     mPaint.setStrokeCap(Paint.Cap.ROUND); 
     mPaint.setStrokeWidth(12); 
    } 

    @Override 
    protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
     super.onSizeChanged(w, h, oldw, oldh); 

     try 
     { 


     //Bitmap bm1 = BitmapFactory.decodeResource(this.getResources(),R.drawable.scratch).copy(Bitmap.Config.ARGB_8888, true);; 
     //Bitmap bm2 = BitmapFactory.decodeResource(this.getResources(),R.drawable.main).copy(Bitmap.Config.ARGB_8888, true);; 

     //mBitmap = toTransparency(bm1, 0xFFAAAAAA, true, bm2); 

     mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888); 
     mCanvas = new Canvas(mBitmap); 
     } 
     catch (Exception e) { 
      // TODO: handle exception 
      e.printStackTrace(); 
     } 
    } 

    @Override 
    protected void onDraw(Canvas canvas) { 

     canvas.drawColor(0xFFAAAAAA); 
     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; 
    } 

    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(); 

     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; 
    } 
} 

Xin giúp về vấn đề này.

Answer 1

tôi đi qua vấn đề này thời gian gần đây và sau đó tôi đã tạo ra một thư viện cho điều này để mọi người có thể có một thực hiện nhanh chóng của quan điểm đầu, hy vọng điều này có thể giúp những người vẫn đang tìm kiếm câu trả lời https://github.com/winsontan520/Android-WScratchView

Answer 2

tôi tìm thấy thư viện này rất hữu ích.

https://github.com/sharish/ScratchView

Rất dễ dàng để tích hợp

<com.cooltechworks.views.ScratchImageView 
    android:id="@+id/sample_image" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@android:color/white" 
    android:src="@drawable/img_sample2" 
/> 

Answer 3

bạn có thể làm cho "Scratch Card" ứng dụng như cách này. bạn cần phải làm theo các mã dưới đây là mã làm việc. bạn chỉ cần yêu cầu hiểu và thực hiện logic của riêng bạn.

public class MainActJava extends AppCompatActivity { 

    @Override 
    public void onCreate(@Nullable Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.ic_launcher); 
     setContentView(new MyView(this, bitmap)); 
    } 

    public class MyView extends View implements View.OnTouchListener { 

     private static final float TOUCH_TOLERANCE = 4; 
     private Paint mPaint; 
     private Bitmap oBitmap; 
     private Bitmap holder; 
     private Canvas mCanvas; 
     private Path mPath; 
     private Paint mBitmapPaint; 
     private float mX, mY; 

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

     public MyView(Context context, Bitmap bitmap) { 
      super(context); 
      setOnTouchListener(this); 
      this.oBitmap = bitmap; 
      this.mPaint = new Paint(); 
      mPath = new Path(); 
      mBitmapPaint = new Paint(Paint.DITHER_FLAG); 
      init(); 
     } 

     protected void init() { 
      mPaint.setAntiAlias(true); 
      mPaint.setDither(true); 
      mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR)); 
      mPaint.setStyle(Paint.Style.STROKE); 
      mPaint.setStrokeJoin(Paint.Join.ROUND); 
      mPaint.setStrokeCap(Paint.Cap.ROUND); 
      mPaint.setStrokeWidth(35); 
     } 

     @Override 
     protected void onSizeChanged(int w, int h, int oldw, int oldh) { 
      super.onSizeChanged(w, h, oldw, oldh); 
      holder = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888); 
      mCanvas = new Canvas(holder); 
     } 

     @Override 
     protected void onDraw(Canvas canvas) { 
      onDrawing(canvas); 
     } 

     private void onDrawing(Canvas canvas) { 
      mCanvas.drawColor(0xFFAAAAAA); 
      mCanvas.drawPath(mPath, mPaint); 
      canvas.drawBitmap(oBitmap, getWidth()/2, getHeight()/2, mBitmapPaint); 
      canvas.drawBitmap(holder, 0, 0, mBitmapPaint); 
     } 

     private void touch_start(float x, float y) { 
      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); 
     } 


     @Override 
     public boolean onTouch(View view, 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 true; 
     } 
    } 
} 

Output: