利用ViewFlipper和GestureDetector实现两个layout之间动画切换

先来看看效果：

手指往左边滑动就是把第二个布局从右边切换到主界面

手指从上往下滑动就是把第一个布局从上面切回到主界面

MainActivity的布局，这里使用一个ViewFlipper来放要切换的view：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">

   <ViewFlipper
       android:id="@+id/viewFlipper"
       android:layout_width="match_parent"
       android:layout_height="match_parent"></ViewFlipper>

</LinearLayout>

第一个布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorPrimary">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第一个布局"
        android:textSize="100sp"
        android:textColor="#ffffff"/>

</LinearLayout>

第二个布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorAccent">


    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="第二个布局"
        android:textSize="100sp"
        android:textColor="#ffffff"/>
</LinearLayout>

然后就从右边切入的动画：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="100%p"
        android:toXDelta="0%p"
        android:duration="500"
        />
</set>

退回到界面上面的动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="0%p"
        android:toYDelta="-100%p"
        android:duration="500"
        />


</set>

由上往下的动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="-100%p"
        android:toYDelta="0%p"
        android:duration="500"
        />
</set>

从主界面退回到右边的动画

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0%p"
        android:toXDelta="100%p"
        android:duration="500"
        />
</set>

activity里面的代码：

package com.jackie.location;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.GestureDetector;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ViewFlipper;

public class MainActivity extends AppCompatActivity{

    private GestureDetector detector;
    private ViewFlipper flipper;
    private LayoutInflater inflater;
    private View firstLayout, secondLayout;
    private int layoutNo = 1;//当前layout，用来判断是否滑到了第二个布局，滑到了第二个布局就不能再往左边滑了
    private static int LAYOUT_NUMBER = 2;//全部layout的数量
    private static int FIRST_LAYOUT_NUMBER = 1;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        flipper = (ViewFlipper)findViewById(R.id.viewFlipper);
        inflater = LayoutInflater.from(this);
        firstLayout = inflater.inflate(R.layout.first_layout, null);
        secondLayout = inflater.inflate(R.layout.second_layout, null);
        flipper.addView(firstLayout);//将两个layout添加到ViewFlipper中
        flipper.addView(secondLayout);

        MyGestureListener listener = new MyGestureListener();
        detector = new GestureDetector(this, listener);

    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        //重写onaTouchEvent方法，把触摸事件传递到detector
        Log.d("TAG", "Activity onTouchEvent");
        return detector.onTouchEvent(event);
    }


    private class MyGestureListener implements GestureDetector.OnGestureListener{

        @Override
        public boolean onDown(MotionEvent e) {
            return false;
        }

        @Override
        public void onShowPress(MotionEvent e) {

        }

        @Override
        public boolean onSingleTapUp(MotionEvent e) {
            return false;
        }

        @Override
        public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) {
            return false;
        }

        @Override
        public void onLongPress(MotionEvent e) {

        }

        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {

            Log.d("TAG", "fling happened");
            //判断滑动距离和当前的layout
            if(e1.getX() -  e2.getX()> 120 && layoutNo < LAYOUT_NUMBER){
                layoutNo++;
                flipper.setInAnimation(MainActivity.this, R.anim.in_from_right);
                flipper.setOutAnimation(MainActivity.this, R.anim.out_to_above);
                flipper.showNext();

            }else if(e2.getY() - e1.getY() > 120 && layoutNo > FIRST_LAYOUT_NUMBER){
                layoutNo--;
                flipper.setInAnimation(MainActivity.this, R.anim.in_from_above);
                flipper.setOutAnimation(MainActivity.this, R.anim.out_to_right);
                flipper.showPrevious();
            }
            return true;
        }
    }
}