android ViewFilpper（一）

布局与滑动：ViewFlipper在Android应用中的应用

最新推荐文章于 2024-05-08 10:24:55 发布

原创最新推荐文章于 2024-05-08 10:24:55 发布 · 2.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #distance #button #layout #encoding #float

android 同时被 2 个专栏收录

51 篇文章

订阅专栏

ViewFilpper

2 篇文章

订阅专栏

本文介绍了如何使用ViewFlipper在Android应用中实现多个View之间的滑动切换，并通过代码示例展示了如何在布局中添加控件及实现手势控制的滑动效果。

这篇文章写的是关于几个View之间的滑动

1、首先来看布局界面

main.java

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" 
    >
   <ViewFlipper
       	    android:id="@+id/viewfilpper" 
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:flipInterval="1000"
        android:inAnimation="@anim/left_in"
        android:outAnimation="@anim/left_out"
        android:persistentDrawingCache="animation"
    >
    <LinearLayout
        android:id="@+id/face"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
         >
        <TextView 
            android:text="fsdfasdfads"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
    <LinearLayout
        android:id="@+id/face2"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
         >
        <TextView 
            android:text="fsdfasdfads2222222222"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            />
    </LinearLayout>
    </ViewFlipper>
</LinearLayout>

在ViewFilpper中添加布局，这只是简单的布局，等会会在代码中在每个布局中添加控件

在res/anim中的xml文件

left_in.xml

<?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"
        android:duration="500"
        />
	<alpha
	    android:fromAlpha="0.0"
	    android:toAlpha="1.0"
	    android:duration="500"
	    />
</set>

left_out.xml

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

2、实现效果的java代码

MyViewFilpperActivity.java

package com.myviewfilpper;

import android.app.Activity;
import android.os.Bundle;
import android.view.GestureDetector.OnGestureListener;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.ViewFlipper;

public class MyViewFilpperActivity extends Activity implements OnGestureListener{
	LinearLayout linear,linear2;
	ViewFlipper flipper;
	Button button,button2 ;
	//定义手势检测器实例
		GestureDetector detector;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        linear = (LinearLayout) findViewById(R.id.face);
        linear2 = (LinearLayout) findViewById(R.id.face2);
        flipper = (ViewFlipper) findViewById(R.id.viewfilpper);
        button = new Button(this);
        button2 = new Button(this);
      //创建手势检测器
        detector = new GestureDetector(this,this);
        addView();
        addView2();
    }
    /**
     * 这个是往第一个布局文件中添加控件
     */
    private void addView(){
    	button.setText("frist"); 
    	button.setWidth(android.widget.LinearLayout.LayoutParams.WRAP_CONTENT);
    	button.setHeight(android.widget.LinearLayout.LayoutParams.WRAP_CONTENT);
    	linear.addView(button);
    }
    /**
     * 这个是往第二个布局文件中添加控件
     */
    private void addView2(){
    	button2.setText("second");
    	button2.setWidth(android.widget.LinearLayout.LayoutParams.WRAP_CONTENT);
    	button2.setHeight(android.widget.LinearLayout.LayoutParams.WRAP_CONTENT);
    	linear2.addView(button2);
    }

	@Override
	public boolean onDown(MotionEvent e) {
		return false;
	}
	//定义手势动作两点之间的最小距离
		final int FLIP_DISTANCE = 50;
	@Override
	public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
			float velocityY) {
		/**
		 * 如果第一个触点事件的x坐标大于第二个触点事件的x坐标超过FLIP_DISTANCE
		 * 也就是手势从右向左滑动
		 */
		if(e1.getX() - e2.getX() > FLIP_DISTANCE){
			//为flipper设置切换的动画效果
			flipper.showPrevious();
			return true;
		}
		/**
		 * 如果第二个触点事件的x坐标大于第一个触点事件的x坐标超过FLIP_DISTANCE
		 * 也就是手势从左向右滑动
		 */
		else if(e2.getX() - e1.getX() > FLIP_DISTANCE){
			
			//为flipper设置切换的动画效果
			flipper.showNext();
			return true;
		}
		return false;
	}

	@Override
	public void onLongPress(MotionEvent e) {
		
	}

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

	@Override
	public void onShowPress(MotionEvent e) {
		
	}

	@Override
	public boolean onSingleTapUp(MotionEvent e) {
		return false;
	}
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		// 将该activity上的触碰事件交给GestureDetector处理
		return detector.onTouchEvent(event);
	}
}

代码中有重要的注释，我就不多说