Listen to the Wheat Academy Android development teacher said to achieve the effect of hand-flipping, mainly used in Viewflipper and Gesturedetector.
Viewflipper changes the current display, gesturedetector the monitor gesture.
The display for multiple pages is very cool.
Now I'll give you a brief explanation,
First create the project: Testflip, create the main activity:testflip.
Add the flipper information in the Res/layout/main.xml as follows:
Java code
1. <?xml version= "1.0" encoding= "Utf-8"?>
2. <linearlayout xmlns:android= "Http://schemas.android.com/apk/res/android"
3. android:orientation= "Vertical"
4. Android:layout_width= "Fill_parent"
5. android:layout_height= "Fill_parent"
6. >
7. <viewflipper android:id= "@+id/viewflipper01"
8. Android:layout_width= "Fill_parent" android:layout_height= "Fill_parent" >
9. </ViewFlipper>
10.</linearlayout>
The Testflip then implements the Ongesturelistener interface, implements all the abstract methods, and then starts to transform the class.
First, declare two private members.
Java code
1. Private Viewflipper Flipper;//viewflipper Instance
2. Private Gesturedetector detector;//Touch Monitor Instance
The member initialization is then added in the OnCreate method.
Java code
1. Detector = new Gesturedetector (this);//Initialize Touch probe
2. Flipper = (viewflipper) This.findviewbyid (R.ID.VIEWFLIPPER01);//Get Viewflipper instance
3.
4. Flipper.addview (Addtextview ("Step 1"));//Add view to Flipper queue
5. Flipper.addview (Addtextview ("Step 2"));
6. Flipper.addview (Addtextview ("Step 3"));
7. Flipper.addview (Addtextview ("Step 4"));
8. Flipper.addview (Addtextview ("Step 5"));
The Addtextview method is as follows:
Java code
1. Private View Addtextview (String text) {
2. TextView TV = new TextView (this);
3. Tv.settext (text);
4. tv.setgravity (1);
5. Return TV;
6.}
Flipper will arrange the view in your order of addition and display it through Flipper.shownext () and flipper.showprevious ().
You also need to rewrite one more method: Ontouchevent (Motionevent event), otherwise detector cannot detect touch, this method is very simple.
Java code
1. @Override
2. Public boolean ontouchevent (Motionevent event) {
3. Return This.detector.onTouchEvent (event);
4.}
Now start the motion monitoring and add the following to the Onfling method:
Java code
1. @Override
2. Public boolean onfling (Motionevent E1, motionevent E2, float Velocityx,
3. Float velocityy) {
4. This.flipper.showNext ();//Display the next view in Flipper
5. return true;
6.}
Now it's time to run a look at the effect. You will find that when the mouse is sliding the screen is simply a step 2 from step 1, and does not have that kind of picture sliding effect, and whether you swipe from left to right or swipe left is in the same order, now we modify some, let the effect more dazzling a little.
The Anim directory is created in the Res directory and 4 animation-based XML files are created, each named: Left_in.xml,left_out.xml,right_in.xml,right_left.xml
The contents are:
Left_in.xml:
Java code
1. <?xml version= "1.0" encoding= "Utf-8"?>
2. <set xmlns:android= "Http://schemas.android.com/apk/res/android" >
3. <translate android:fromxdelta= "100%p" android:toxdelta= "0"
4. android:duration= "/>"
5. <t>
Left_out.xml:
Java code
1. <?xml version= "1.0" encoding= "Utf-8"?>
2. <set xmlns:android= "Http://schemas.android.com/apk/res/android" >
3. <translate android:fromxdelta= "0" android:toxdelta= " -100%p"
4. android:duration= "/>"
5. <t>
Right_in.xml:
Java code
1. <?xml version= "1.0" encoding= "Utf-8"?>
2. <set xmlns:android= "Http://schemas.android.com/apk/res/android" >
3. <translate android:fromxdelta= " -100%p" android:toxdelta= "0"
4. android:duration= "/>"
5. <t>
Right_out.xml:
Java code
1. <?xml version= "1.0" encoding= "Utf-8"?>
2. <set xmlns:android= "Http://schemas.android.com/apk/res/android" >
3. <translate android:fromxdelta= "0" android:toxdelta= "100%p"
4. android:duration= "/>"
5. <t>
The main thing is to do a translation animation, Fromxdelta: The beginning of the animation x position, Toxdelta: The end of the animation x position, Duration: duration.
Then modify the Onfling method to read as follows:
Java code
1. @Override
2. Public boolean onfling (Motionevent E1, motionevent E2, float Velocityx,
3. Float velocityy) {
4. if (E1.getx ()-e2.getx () > 120) {//swipe from right to left
5.//Registration Flipper Effect
6. This.flipper.setInAnimation (Animationutils.loadanimation (this, r.anim.left_in));
7. This.flipper.setOutAnimation (Animationutils.loadanimation (this, r.anim.left_out));
8. This.flipper.showNext ();
9. return true;
Ten.} else if (E1.getx ()-E2.getx () <-120) {//swipe from left to right
This.flipper.setInAnimation (Animationutils.loadanimation (this, r.anim.right_in));
This.flipper.setOutAnimation (Animationutils.loadanimation (this, r.anim.right_out));
This.flipper.showPrevious ();
return true;
15.}
. return false;
17.}
Then re-run to see the effect, if the picture and so on, you can also add alpha effect in animation, as follows
Java code
1. <alpha android:fromalpha= "0.1" android:toalpha= "1.0"
2. android:duration= "/>"
A gesture page turn effect is done, use in the multi-content display effect will be very good.
More Android Development tutorials at: Http://www.maiziedu.com/course/android/
Android Development Tutorial: Android gesture Flip effect
