Principle of page flip for Android

This article introducesPrinciples and Examples of page flip in Android.

 

The first method is as follows:

 

 

 

Implementation principle:

If the touch point of the current finger is a, the coordinate of Point a is (ax, ay). The coordinate between the triangle acb and the triangle cmb is a symmetric triangle and the straight line cp is an am vertical bisector, the coordinate of point B is (ax/2, ay/2 ).

If gf is perpendicular to om and cb is perpendicular to am, and cfg is similar to gfm, cf: gf = gf: mf cf = (gf * gf) the/mf gf length is the X-axis of the G point. The mf length is the X-axis of the G point.

The cf length can be used to obtain the coordinate of the C point. The C point and the G point can determine the straight line between the two points. When x = 0 in the straight line, the intersection of x and y is obtained.

 

 

 

Second page turning Effect

 

 

 

Implementation principle:

 Use the besell curve. The curve has four points: the starting point, the ending point (also called the anchor), and two separated intermediate points. Sliding two intermediate points will change the shape of the besell curve.

Based on the principle of the first paging effect, we can determine a, e, h, f, and g, where eh is parallel to cj and af is perpendicular to eh, then, if af is perpendicular to cj, then the triangle. If it is similar to the triangle cnf, ef: cf = gf: nf exists.

If n is set to ag, cf = (3/2) * ef exists. Then, the coordinate of point C can be used to find a straight line between two points.

The intersection of the line and Y axis can be calculated. The intersection of a, e, c, and j can be used to calculate the intersection of B in two straight lines. Similarly, the point k can be obtained.

 

The specific implementation steps in Android:

 

Start page display

1. Create screen-sized bmp

2. convert an image to a canvas

3. Get start page data

4. Draw the start page data in the canvas

5. Repeat onDraw in the current view to redraw the bmp object.

 

Page turning

1. Create two bmp files (bmp 1 and bmp 2) during initialization and convert them to canvas (canvas1 and canvas2)

2. Obtain the area where the gesture is touched for the first time (for example, when you click the screen position for the first time x <50 & y <50 indicates the upper left corner)

3. Determine the data to be displayed based on the first click area (for example, if you click "top left and bottom left" in the Left area for the first time, the operation is regarded as the next page)

4. Obtain the data on the next page and draw it out in canvas2.

5. Call the starting Animation Based on the region position obtained in 1 to move the view to the position of the first click of the gesture.

6. Obtain the coordinates of each movement of the gesture and calculate the coordinates of each point drawn based on the moving coordinates.

7. Refresh the view every time you move it.

 

Source code example download 1

Source code example download 2

 

Complete. Pai_^