Use Viewflipper for screen switching in Android

Screen switching refers to the same activity within the screen between the switch, Viewflipper inherited the Framelayout class, the role of Viewanimator class is to framelayout inside the view switch to provide animation effect. The following motion diagram:

The class has several functions that are related to animation:

Setinanimation: Sets the animation used when the view enters the screen, which has two versions, one that accepts a single parameter, The type is android.view.animation.Animation; one accepts two parameters, the type is context and int, respectively, the context object and the ResourceID that defines the animation.

Setoutanimation: Sets the animation used when the view exits the screen, with the same parameters as the Setinanimation function.

Shownext: Call this function to display the next view inside the framelayout.

Showprevious: Call this function to display the previous view inside the framelayout.

The following is an example of how an animation is implemented in the form of an axis:

From the bottom left corner of the screen is the mathematical axis of origin, the bottom border of the screen is the x axis, the left box is the Y axis, the current screen is shown in Figure two, if you want to look at figure one, you need to go from left to right (relative to the screen) to enter the screen, the x axis of the initial coordinates of -100%P When you move to the screen position, the x-axis changes to 0 (because the presentation is sliding horizontally, so the y-axis is not involved); to get to the screen, you need to go from right to left, and the x-axis from 100%p to 0. With a clear coordinate position, we want to achieve four animation effects, it will be very simple, You need to build a self-built Anim folder in the Res directory ) to demonstrate four animation effects:

In_leftright.xml --Enter the screen from left to right:

1 <?xml version= "1.0" encoding= "Utf-8"?>2 <set xmlns:android= "http://schemas.android.com /apk/res/android ">3     <translate4         android:duration="5         Android:fromxdelta= " -100%p"6         android:toxdelta= "0"/>7 </set>

Out_leftright.xml --go from left to right to the screen:

1 <?xml version= "1.0" encoding= "Utf-8"?>2 <set xmlns:android= "http://schemas.android.com /apk/res/android ">3     <translate4         android:duration="5         Android:fromxdelta= "0"6         android:toxdelta= "100%p"/>7 </set>

In_rightleft.xml --Enter the screen from right to left:

1 <?xml version= "1.0" encoding= "Utf-8"?>2 <set xmlns:android= "http://schemas.android.com /apk/res/android ">3     <translate4         android:duration="5         Android:fromxdelta= "100%p"6         android:toxdelta= "0"/>78 </set>

Out_rightleft.xml --out of the screen from right to left:

1 <?xml version= "1.0" encoding= "Utf-8"?>2 <set xmlns:android= "http://schemas.android.com /apk/res/android ">3     <translate4         android:duration="5         Android:fromxdelta= "0"6         android:toxdelta= " -100%p"/>7 </set>

The animation effect is set up to create

Layout file View_layout.xml (this time directly defines the animation of the three pictures directly through the LinearLayout layout to Viewflipper):

1<?xml version= "1.0" encoding= "Utf-8"?>2<linearlayout xmlns:android= "Http://schemas.android.com/apk/res/android"3android:orientation= "vertical" android:layout_width= "match_parent"4android:layout_height= "Match_parent" >5<Viewflipper6Android:id= "@+id/vf"7Android:layout_width= "Match_parent"8android:layout_height= "Match_parent" >9<LinearLayoutTenAndroid:layout_width= "Match_parent" Oneandroid:layout_height= "Match_parent" > A<ImageView -Android:layout_width= "Match_parent" -android:layout_height= "Match_parent" theandroid:src= "@mipmap/sample_1"/> -</LinearLayout> -<LinearLayout -Android:layout_width= "Match_parent" +android:layout_height= "Match_parent" > -<ImageView +Android:layout_width= "Match_parent" Aandroid:layout_height= "Match_parent" atandroid:src= "@mipmap/sample_2"/> -</LinearLayout> -<LinearLayout -Android:layout_width= "Match_parent" -android:layout_height= "Match_parent" > -<ImageView inAndroid:layout_width= "Match_parent" -android:layout_height= "Match_parent" toandroid:src= "@mipmap/sample_3"/> +</LinearLayout> -</ViewFlipper> the</LinearLayout>

Java function Implementation code in activity:

1 ImportAndroid.os.Bundle;2 Importandroid.support.annotation.Nullable;3 Importandroid.support.v7.app.AppCompatActivity;4 Importandroid.view.MotionEvent;5 ImportAndroid.view.View;6 ImportAndroid.widget.ViewFlipper;7 /**8 * Created by Panchengjia on 2016/11/28.9  */Ten  Public classFlipperactivityextendsAppcompatactivityImplementsview.ontouchlistener{ One     PrivateViewflipper VF; A     floatStartX;//declares the coordinates of x when the finger is pressed -     floatEndX;//declares the coordinates of x when the finger is released - @Override the     protected voidonCreate (@Nullable Bundle savedinstancestate) { -         Super. OnCreate (savedinstancestate); - Setcontentview (r.layout.viewflipper_layout); -Xfs(Viewflipper) Findviewbyid (R.ID.VF); +Vf.setontouchlistener ( This); -     } + @Override A      Public BooleanOnTouch (View V, motionevent event) { at         //determines whether the captured action is pressed, setting the x-coordinate of the pressed point Starx -         if(event.getaction () = =Motionevent.action_down) { -startx=event.getx (); -             //To determine if the captured action is lifted, set the release point x coordinate EndX -}Else if(event.getaction () = =motionevent.action_up) { -endx=event.getx (); in             //swipe the screen from right to left, the X value decreases, and the image is entered from the right side of the screen -             if(startx>EndX) { to                 //into and out of the animation +Vf.setinanimation ( This, r.anim.in_rightleft); -Vf.setoutanimation ( This, r.anim.out_rightleft); theVf.shownext ();//Show Next View *                 //swipe the screen from left to right, the X value increases, and the image is entered on the screen from the left side of the screen $}Else if(startx<EndX) {Panax NotoginsengVf.setinanimation ( This, r.anim.in_leftright); -Vf.setoutanimation ( This, r.anim.out_leftright); theVf.showprevious ();//Show Last View +             } A         } the         return true; +     } -}

In the practice here, the animation of the way the effect of the display bothered me for a long time, this just think of the form of the axis through the realization of the principle of animation, the moment of the painting, the whole people like clairvoyant, can't help but want to write a blog share to everyone, mutual encouragement!

Use Viewflipper for screen switching in Android