ViewFlipper实现ViewPager的页面切换效果

activity_main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ViewFlipper
        android:id="@+id/flipper"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >
    </ViewFlipper>

</LinearLayout>

MainActivity

package com.example.viewflipper;

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

public class MainActivity extends Activity {
	private ViewFlipper flipper;
	private int[] resId = { R.drawable.pic1, R.drawable.pic2, R.drawable.pic3,
			R.drawable.pic4 };
	private float startX;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		flipper = (ViewFlipper) findViewById(R.id.flipper);
		// 动态导入的方式,加入子view
		for (int i = 0; i < resId.length; i++) {
			flipper.addView(getImageView(resId[i]));
		}
		// 进入动画--取消自动播放功能
		// flipper.setInAnimation(this, R.anim.left_in);
		// flipper.setOutAnimation(this, R.anim.left_out);
		// flipper.setFlipInterval(3000);
		// ;
		// flipper.startFlipping();
	}

	// 通过id获取图片
	private ImageView getImageView(int resId) {
		ImageView imageView = new ImageView(this);
		// 铺满屏幕
		imageView.setBackgroundResource(resId);
		return imageView;
	}

	/**
	 * 处理手势事件
	 */
	@Override
	public boolean onTouchEvent(MotionEvent event) {
		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			// 获取起始点的x轴的坐标
			startX = event.getX();
			break;

		case MotionEvent.ACTION_MOVE:

			break;
		case MotionEvent.ACTION_UP:
			// 向右滑动
			if (event.getX() > startX + 100) {
				flipper.setInAnimation(this, R.anim.left_in);
				flipper.setOutAnimation(this, R.anim.rightf_out);
				// 显示前一页
				flipper.showPrevious();
			}
			// 向左边滑动
			if (event.getX() + 100 < startX) {
				flipper.setInAnimation(this, R.anim.right_in);
				flipper.setOutAnimation(this, R.anim.left_out);
				// 显示前一页
				flipper.showNext();
			}
			break;
		default:
			break;
		}
		return super.onTouchEvent(event);
	}

}

left_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="1000"
        android:fromXDelta="-100%p"
        android:toXDelta="0" />

</set>

left_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="1000"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />

</set>

right_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="1000"
        android:fromXDelta="100%p"
        android:toXDelta="0" />

</set>

rightf_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="1000"
        android:fromXDelta="0"
        android:toXDelta="100%p" />

</set>

版权声明:本文为博主原创文章,未经博主允许不得转载。

时间: 2024-08-11 09:41:14

ViewFlipper实现ViewPager的页面切换效果的相关文章

Gallery实现ViewPager的页面切换效果、以及实现图片画廊效果

activity_main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent"

实现ViewPager多页面滑动效果

 viewPager实现引导页 ViewPager多页面滑动效果 1.Android的左右滑动在实际编程经常能用到,比如查看多张图片,左右 切换tab页. 2.自android 3.0之后的SDK中提供了android-support-V4包用以实现 版本兼容,让老版本系统下的应用通过加入jar包实现扩展,其中有一 个可以实现左右滑动的类ViewPager 今天我们就用ViewPager类来实现引导页的实战案例 实现功能: 1.实现ViewPager多页面滑动效果. 2.下方的显示当前焦点页

android UI之ViewPager多页面滑动效果

  viewPager实现引导页 ViewPager多页面滑动效果 1.Android的左右滑动在实际编程经常能用到,比如查看多张图片,左右 切换tab页. 2.自android 3.0之后的SDK中提供了android-support-V4包用以实现 版本兼容,让老版本系统下的应用通过加入jar包实现扩展,其中有一 个可以实现左右滑动的类ViewPager 今天我们就用ViewPager类来实现引导页的实战案例 实现功能: 1.实现ViewPager多页面滑动效果. 2.下方的显示当前

UI界面之ViewPager多页面滑动效果的实现

viewPager实现引导页 ViewPager多页面滑动效果 1.Android的左右滑动在实际编程经常能用到,比如查看多张图片,左右 切换tab页. 2.自android 3.0之后的SDK中提供了android-support-V4包用以实现 版本兼容,让老版本系统下的应用通过加入jar包实现扩展,其中有一 个可以实现左右滑动的类ViewPager 今天我们就用ViewPager类来实现引导页的实战案例 实现功能: 1.实现ViewPager多页面滑动效果. 2.下方的显示当前焦点页的

在uwp仿IOS的页面切换效果

有时候我们需要编写一些迎合IOS用户使用习惯的uwp应用,我在这里整理一下仿IOS页面切换效果的代码. 先分析IOS的页面切换.用户使用左右滑动方式进行前进和后退,播放类似于FlipView的切换动画.导航到新页面时,使用页面前进的动画. UWP自带很多切换效果,位于 Windows.UI.Xaml.Media.Animation 中.与苹果的切换效果最接近的是 PaneThemeTransition (而不是EdgeUIThemeTransition). PaneThemeTransition

用Fragment实现Tab页面切换效果初步总结

前言: 最近在Android项目中需要在活动中实现多页面切换的功能,第一次是实现的过程中,是让Activity同时去加载三个界面的,通过点击tab按钮对页面设置隐藏和显示,实现页面切换效果,但是后面发现这种实现方式其实存在很多问题: 首先,同时去加载三个页面,切换Activity的速度会变慢,尤其是布局中如果有很多ImageView,ImageButton等使用到图片资源的控件时,切换效果非常不好: 其次,由于使用了很多图片资源,在退出Activity的时候,像Drawable,Bitmap等一

html5各种页面切换效果和模态对话框

页面动画:data-transition 属性可以定义页面切换是的动画效果.例如:<a href="index.html" data-transition="pop">I'll pop</a>data-transition 参数表:参数说明slide 从右侧向左滑入页面slideup 从底部向上滑入slidedown 从上向下滑入pop 从中心渐显展开fade 渐显flip 翻转备注:如果想要在目标页面中显示后退按钮,可以在链接中加入 dat

iOS开源项目 页面切换效果TransitionAnimation

RT:页面切换效果 https://github.com/xietao3/RMPZoomTransitionAnimatorDemo#rmpzoomtransitionanimatordemo 版权声明:本文为博主原创文章,未经博主允许不得转载.

js页面切换效果学习(基础)

css代码 .div1{ width: 130px; height: 130px; }.div2{ width: 20px;height:160px; margin-top: 0px; float: left;}body{ font-size: 12px;}.div2 li{ list-style-type: none; margin-top: 3px; background-color: wheat; height: 40px; text-align: center; padding-top: