Android Project Scratch award details (i)Objective
In the last period we simply realized the function of an artboard, the user can scribble on the above, in fact, scraping award is also the case, the user scraping the prize is also a random graffiti.Principle of scraping and scraping award
A total of two layers of canvas, the bottom canvas to hold the picture of the winning information, the upper canvas is a cover layer, we will be the bottom canvas as the information layer, the upper canvas is called as a covering layer.
Users re-cover layer painting, we will user paint traces from the cover layer erase, display the content of the information layer, then achieved a simple scratch award.
Based on the code of the previous period, let's explain it.
In the previous issue in the comments I also have a hint to what the code is today's content, let's take a look at it.
Setting the background map
First of all, we need to set the background of the information layer, the background image is random, remember to put the picture in the Drawable folder
//背景图 BitmapDrawable bitmap = (BitmapDrawable) getResources().getDrawable(R.drawable.rewrite6);//从drawable文件夹中获得指定名称的该图片，并转型为bitmapdrawable，R.drawable.xxx background = bitmap.getBitmap();//bitmapdrawable通过getBItmap方法得到bitmap background = Bitmap.createScaledBitmap(background,width,height,true);//利用Bitmap的静态方法创建一个合适的bitmap（宽高都是之前onMeasure方法中获取的，不太清楚的同学请去上期回顾一下）
Draw a background image using canvas
Xfermode abroad has the great God called the transition mode, this translation is more appropriate but I am afraid not easy to understand, we can also call the image blending mode, because the so-called "transition" is actually a kind of image mixing, this method is similar to the setcolorfilter we talked about above.
Look at the API documentation and discover that there are three subclasses: Avoidxfermode, Pixelxorxfermode and Porterduffxfermode, these three subclasses are much more complex than the three subclasses of Setcolorfilter.
Because of the Avoidxfermode, Pixelxorxfermode have been marked as obsolete, so this time the main research is still in use Porterduffxfermode:
This class also has a constructor method with only one parameter Porterduffxfermode (Porterduff.mode Mode)
There are 18 modes in the mode, after Google added add and overlayl two modes, the following is the plot of 16 modes
How do we understand this picture? We just remember a little, first draw DST, and then draw SRC, some students say it is not easy to remember Ah, simple, teach you a formula, first draw the bottom (DST), and then draw on (SRC)
We're going to use dsc_out to explain
First draw DST, then painting src,src disappear, only the DST, this is actually the principle of eraser, we use this erase layer can be used to display the image of the information layer
After understanding the principle, we look at the OnDraw method, in the OnDraw method, using canvas to draw the background picture, where the order is the first picture of the information layer, and then to the cover layer, the cover layer will be mbitmap directly draw out, review, here is the use of double buffering technology, Canvas directly copied the Mbitmap, displayed in the view, Mbitmap is actually mcanvas on the above to draw the user's finger movement traces
Canvas.drawbitmap (background,0,0,null);//Draw the information layer
canvas.drawBitmap(mBitmap, 0,0, null);//画出遮盖层 mOutterPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OUT));//设置xfermode dst\_out mCanvas.drawPath(mPath, mOutterPaint);//mCanvas在mBitmap中画出用户的手指的移动痕迹