Android Hand Draw & Canvas Details: DOF map creating

In the previous section we mentioned we can use the Canvas class to display Bitmaps on the screen, and we can get Bitmap from the Gesture layout or hand touch events.

Here we can going to talk about the study of Android hand draw touch event and the Canvas class, to see how we are going to create the DOF map.

The Canvas class is like a container on the screen. When we created a Canvas we will be able bind a Bitmap to it. A canvas with a Bitmap bound to it will be able to draw stuffs including the Bitmap itself.

So for the DOF map, firstly we "put" an empty screen sized Bitmap on our Canvas using the Canvas.drawBitmap(Bitmap, 0, 0, null);
"0,0" here means the left/top corner of the Bitmap to be drew at (0, 0); The last parameter is a Paint instance.
A Paint instance can specify how we draw the things, it is like a shading function, and it's important for us to get the "Blurred" DOF map.

As we mentioned, Canvas is also able to draw other things on the Bitmap like a circle.
We use the
Canvas.drawCircle(x, y, radius, Paint);
to get a styled circle on the Bitmap -- which can be placed at the touch point/stroke point of the user hand drawing.
Just draw a solid circle is not enough for us, we would like the user to paint the depth gradually -- the more he touches a place, the closer/farther that point becomes to the eye point.
We can do this with the Radial Gradient style in the Paint instance assigned to each drawCircle.

The Radial Gradient basically takes an initial color in the center, an end color on the circle boundary and interpolate linearly/smoothly (according to our call) inside the color.

With these, we will be able to draw things like this with the finger touch:

with assigned Alpha channel too.

The graduate change into black along the radius should allow the user to get better blur along the edges.

Hand Touch: 

Now we turn back and see how can we get a hand touch point of the user on the screen.

In our View class, we can override the onTouchEvent(MotionEvent event)function to make response to the user touch event on the screen.

To decide what is the action of the user (touch down, touch up, touch cancel(?)), we can get an Action handle (int) with the passed in event parameter.  Very like the glut mouse callbacks.

To entry each stroke the user has made and historical information we directly use the event.getX(int index) and event.getY(int index) to access stroke(i) position between a touch down and touch up event pair, as well as Pressures.

With the pressure correspond to the radius of our drawCircle and the (X, Y) position we got, we will be able to sketch on the Canvas.