Android Scratch card app

Question

I am doing a small project for college and wondering if someone can tell me how I would go about doing a scratch card app. This app should have one image overlaying another. The one on top should allow the user to remove the image depending on where they rub on the image and thus part of the image that was removed revealing the image underneath. Pretty much like a scratch card. Any help would be great!

This is the code im using at the moment .

            public class workinggraphics extends Activity 
 {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) 
{
    super.onCreate(savedInstanceState);
    //setContentView(R.layout.main);
    setContentView(new Panel(this));

    LinearLayout l1 = (LinearLayout) findViewById(R.id.LAYOUTTEST1);
    Panel p1 = new Panel(null);
}

    class Panel extends View{

        private Bitmap  mBitmap;
        private Canvas  mCanvas;
        private Path    mPath;
        private Paint   mPaint;
    //  private Paint nPaint;
        Bitmap bitmap;
        Canvas pcanvas ;
        int x = 0;
        int y =0;
        int r =0;
        public Panel(Context context) {
            super(context);

            Log.v("Panel", "STROKE");

            setFocusable(true);
            setBackgroundColor(Color.TRANSPARENT);
        /*  
            WallpaperManager wallpaperManager = WallpaperManager.getInstance(context);
            //WallpaperDrawable wallpaperDrawable=wallpaperManager.getDrawable();
            try {
                wallpaperManager.setBitmap(bmp);
            } catch (IOException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }*/
            //setBackgroundDrawable(bmp);
            // setting paint 
        /*  nPaint = new Paint();
            nPaint.setStyle(Paint.Style.FILL);*/

            mPaint = new Paint();
            mPaint.setAlpha(0);
            mPaint.setStyle(Paint.Style.FILL_AND_STROKE);
            mPaint.setStrokeCap(Paint.Cap.BUTT);
            mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));//.Mode.DST_IN));
            mPaint.setAntiAlias(false);

            // getting image from resources
            Resources r = this.getContext().getResources();

            Bitmap bm = BitmapFactory.decodeResource(getResources(),  R.drawable.mainscreen_background);
            Bitmap bm1 = BitmapFactory.decodeResource(getResources(),R.drawable.foreground_image);
            // converting image bitmap into mutable bitmap
            bitmap =  bm.createBitmap(bm.getWidth(), bm.getHeight(), Config.ARGB_8888);
            //bitmap = bm1.createBitmap(bm1.getWidth(),bm1.getHeight(),Config.ARGB_8888);
            pcanvas = new Canvas();
            pcanvas.setBitmap(bitmap);                   // drawXY will result on that Bitmap
            pcanvas.drawBitmap(bm, 0, 0, null);
            pcanvas.drawBitmap(bm1,0,0,null);


        }

        @Override
        protected void onDraw(Canvas canvas) {


            Rect cBK = new Rect();
            //canvas.set
            cBK.set(0,0,canvas.getWidth(),canvas.getHeight());

            //pcanvas.drawRect(cBK, nPaint);
            // draw a circle that is  erasing bitmap            
            pcanvas.drawCircle(x, y, r, mPaint);
            //pcanvas.drawLine(x, y, 0, 0, mPaint);

            canvas.drawBitmap(bitmap, 0, 0,null);

            super.onDraw(canvas);

        }



        @Override
        public boolean onTouchEvent(MotionEvent event) {

            // set paramete to draw circle on touch event
            x = (int) event.getX();
            y = (int) event.getY();

            r =20;
            // Atlast invalidate canvas
            invalidate();
            return true;
        }
    }
}

Now as you can see above there is a lot of comments for things we have tried. Ideally I would like to be able to create an instance of the Panel class, set the workinggraphics class contextview to a XML LinearLayout (OR SurfaceView w/e would be used I dont really know), and then just set a background image on the defined LinearLayout in XML to be revealed when the canvas erases the bitmap image we have set.

Anyway any suggestions would be appricated thanks alot in advanced!

Answer 1

I created a library call WScrarchView where you can implement scratch view just few lines in layout xml. Hope this can help those who still looking for the solution https://github.com/winsontan520/Android-WScratchView