手势滑动控制组建显示的FrameLayout

因为项目需要，自定义了一个通过手势滑动控制组件显示的FrameLayout布局。主要功能就是将各个组件放入此FrameLayout中，上层组件会覆盖下层组件，向左滑动上层组件，则该组件会启动一个translateAnimation动画从左边移出屏幕，同时被覆盖的下层组件会启动一个AlphaAnimation动画显示出来。再向右滑动，下层组建会隐藏，之前的上层组件会从左向右移入屏幕。

例如在该FrameLayout内放入一个textView显示文字和一个ImageView显示图片，向左滑动图片，则该imageView会从左边移出屏幕，同时被ImageView覆盖的textView会慢慢浮现出来，再向右滑动该textView，则textView会逐渐隐藏，而之前移出屏幕的ImageView会从左向右移动回原来的位置

先看效果图：

最开始的时候，imageView覆盖textView：

向左滑动图片，imageView开始向左平移，同时textView开始显现：

动画结束后，imageView移出了屏幕，textView显示：

示例代码如下：

首先是自定义FrameLayout类：

package com.example.myframelayout;
import android.content.Context;
import android.content.Intent;
import android.util.AttributeSet;
import android.view.GestureDetector.OnGestureListener;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.Animation.AnimationListener;
import android.view.animation.TranslateAnimation;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.View;
import android.view.WindowManager;
import android.widget.FrameLayout;
import android.widget.Toast;
//需要先点击才能滑动
public class MyFrameLayout extends FrameLayout implements  OnGestureListener{ 
	private Context mContext;
	private int mCurrentView;
	private int ANIM_DURATION=3000;
    private View mChild, mHistoryView;
    private View children[];
    private int mWidth;
    private int mPreviousMove;
    private GestureDetector mGestureDetector;
    private TranslateAnimation inLeft;
	private TranslateAnimation outLeft;
    private TranslateAnimation inRight;
	private TranslateAnimation outRight;
	private AlphaAnimation alpha1;
	private AlphaAnimation alpha2;
    private static final int NONE  = 1;
    private static final int LEFT  = 2;
    private static final int RIGHT = 3;
	public MyFrameLayout(Context context){
		super(context);
		mContext = context;
		init();
	}
    public MyFrameLayout(Context context,AttributeSet attrs){
    	super(context, attrs);
		mContext = context;	
		init();
        
    }
	public MyFrameLayout(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		mContext = context;
		init();
	}
	public void init(){
		mCurrentView=0;
		mGestureDetector=new GestureDetector(mContext, this);
		WindowManager wm = (WindowManager) getContext().getSystemService(Context.WINDOW_SERVICE);
		int window_width = wm.getDefaultDisplay().getWidth();
		    mWidth = wm.getDefaultDisplay().getWidth(); 
	        inLeft   = new TranslateAnimation(-mWidth,0,0,0);
	        outLeft  = new TranslateAnimation(0,-mWidth,0,0); 
	        alpha1=new AlphaAnimation(1,0);
	        alpha2=new AlphaAnimation(0,1);
	        inLeft.setDuration(ANIM_DURATION);
	        outLeft.setDuration(ANIM_DURATION);
	        alpha1.setDuration(3000);
	        alpha2.setDuration(5000);
	}
	@Override
	public boolean onDown(MotionEvent e) {
		// TODO Auto-generated method stub
		return false;
	}
	@Override
	public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
			float velocityY) {

		// TODO Auto-generated method stub
		int verticalMinDistance =0;  
		int minVelocity= 0;
		 if (e1.getX() - e2.getX() > verticalMinDistance && Math.abs(velocityX) > minVelocity) {  
		        // 切换Activity  
		         //Intent intent = new Intent(MainActivity.this, CardListActivity.class);  
		         //startActivity(intent);  
		         //overridePendingTransition(R.anim.in_from_right, R.anim.out_to_left);
		        //Toast.makeText(this, "向左手势", Toast.LENGTH_SHORT).show();
		         moveLeft();
		         return true;
		    } else if (e2.getX() - e1.getX() > verticalMinDistance && Math.abs(velocityX) > minVelocity) {  
		  
		        // 切换Activity  
		        //Intent intent = new Intent(MainActivity.this, CreateActivity.class);  
		        //startActivity(intent);  
		       // mContext.overridePendingTransition(R.anim.in_from_left, R.anim.out_to_right);
		        //Toast.makeText(mContext, "向右手势", Toast.LENGTH_SHORT).show();
		    	moveRight();
		        return true;
		    }else{
		    	
		    }
		return false;	
	}
	  protected void onFinishInflate() {
	        int count = getChildCount();
	        children = new View[count];
	        for (int i = 0; i < count; ++i) {
	            children[i] = getChildAt(i);
	            if (i != mCurrentView) {
	                children[i].setVisibility(View.GONE);
	            }
	        }
	    }
	  public void moveLeft() {
		   if(mCurrentView==0){
			   children[mCurrentView].startAnimation(outLeft);
			   children[mCurrentView+1].setVisibility(View.VISIBLE);
			   children[mCurrentView+1].startAnimation(alpha2);
			   children[mCurrentView].setVisibility(View.GONE);
			   mCurrentView=1;
		   }
	       /* if (mCurrentView < children.length - 1 && mPreviousMove != LEFT) {
	            children[mCurrentView+1].setVisibility(View.VISIBLE);
	            children[mCurrentView+1].startAnimation(inLeft);
	            children[mCurrentView].startAnimation(outLeft);
	            children[mCurrentView].setVisibility(View.GONE);
	            mCurrentView++;
	            mPreviousMove = LEFT;
	        }**/
	    }
	    public void moveRight() {
	    	 System.out.println("向右滑动");
	    	if(mCurrentView==1){
	    		//children[mCurrentView-1].setVisibility(View.VISIBLE);
	    		children[mCurrentView-1].startAnimation(inLeft);
	    		children[mCurrentView].setVisibility(View.GONE);
	    		children[mCurrentView].startAnimation(alpha1);
	    		children[mCurrentView-1].setVisibility(View.VISIBLE);
	    		mCurrentView=0;
	    	}
	       /* if (mCurrentView > 0 && mPreviousMove != RIGHT) {
	            children[mCurrentView-1].setVisibility(View.VISIBLE);
	            children[mCurrentView-1].startAnimation(inRight);
	            children[mCurrentView].startAnimation(outRight);
	            children[mCurrentView].setVisibility(View.GONE);
	            mCurrentView--;
	            mPreviousMove = RIGHT;
	        }**/
	    }
	@Override
	public void onLongPress(MotionEvent e) {
		// TODO Auto-generated method stub
		
	}
	@Override
	public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,
			float distanceY) {
		// TODO Auto-generated method stub
		return false;
	}
	@Override
	public void onShowPress(MotionEvent e) {
		// TODO Auto-generated method stub
		
	}
	@Override
	public boolean onSingleTapUp(MotionEvent e) {
		// TODO Auto-generated method stub
		return false;
	}
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		mGestureDetector.onTouchEvent(event);
		return true;
	}
	@Override
    public boolean onInterceptTouchEvent(MotionEvent event) {
        return mGestureDetector.onTouchEvent(event);
    }

}

在Activity中使用，先看布局文件，很简单，就是把该FrameLayout在activity的布局文件中定义，然后把需要的组件定义在FrameLayout内即可

     "
     
   

最后是Activity的代码，即显示该组件：

package com.example.myframelayout;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.ImageView;

public class MainActivity extends Activity {
    private MyFrameLayout frame;
    private ImageView image;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		frame=(MyFrameLayout)findViewById(R.id.frame);
		image=(ImageView)findViewById(R.id.image);
	}


}

以上就是整个自定义的FrameLayout，不只是imageView和TextView，还可以是其它组件，只要放在该FrameLayout内，即可实现通过手势滑动来控制各层组件的显示

源代码地址：源代码