`

ColorAnimationView 实现了滑动Viewpager 时背景色动态变化的过渡效果

阅读更多
用法在注释中:

import android.animation.Animator;
import android.animation.ArgbEvaluator;
import android.animation.ObjectAnimator;
import android.animation.ValueAnimator;
import android.content.Context;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.View;

/*
 * ColorAnimationView 实现了滑动 Viewpager 的时候背景色动态变化的过渡效果
 * 
 * ColorAnimationView colorAnimationView = (ColorAnimationView) findViewById(R.id.ColorAnimationView);
		ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);
		viewPager.setAdapter(adpter);
		colorAnimationView.setmViewPager(viewPager, resource.length);
        colorAnimationView.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                Log.e("TAG","onPageScrolled");
            }

            @Override
            public void onPageSelected(int position) {
                Log.e("TAG","onPageSelected");
            }

            @Override
            public void onPageScrollStateChanged(int state) {
                Log.e("TAG","onPageScrollStateChanged");
            }
        });
        
        
    <FrameLayout 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"
         tools:context="cn.taurusxi.guidebackgroundcoloranimation.sample.SampleActivity">

	    <com.*.ColorAnimationView
	        android:id="@+id/ColorAnimationView"
	        android:layout_width="match_parent"
	        android:layout_height="match_parent"/>
	
	    <android.support.v4.view.ViewPager
	        android:id="@+id/viewPager"
	        android:padding="30dp"
	        android:layout_width="match_parent"
	        android:layout_height="match_parent"/>

	</FrameLayout>
 * @author Administrator
 *
 */
public class ColorAnimationView extends View
		implements ValueAnimator.AnimatorUpdateListener, Animator.AnimatorListener {
	private static final int RED = 0xffFF8080;
	private static final int BLUE = 0xff8080FF;
	private static final int WHITE = 0xffffffff;
	private static final int GREEN = 0xff80ff80;
	private static final int DURATION = 3000;
	ValueAnimator colorAnim = null;

	private PageChangeListener mPageChangeListener;

	ViewPager.OnPageChangeListener onPageChangeListener;

	public void setOnPageChangeListener(ViewPager.OnPageChangeListener onPageChangeListener) {
		this.onPageChangeListener = onPageChangeListener;
	}



	/**
	 * 这是你唯一需要关心的方法
	 * @param mViewPager  你必须在设置 Viewpager 的 Adapter 这后,才能调用这个方法。
	 * @param count   ,viewpager孩子的数量
	 * @param colors int... colors ,你需要设置的颜色变化值~~ 如何你传人 空,那么触发默认设置的颜色动画
	 * */
	/**
	 * This is the only method you need care about.
	 * @param mViewPager  ,you need set the adpater before you call this.
	 * @param count   ,this param set the count of the viewpaper's child
	 * @param colors ,this param set the change color use (int... colors),
	 *               so,you could set any length if you want.And by default.
	 *               if you set nothing , don't worry i have already creat
	 *               a default good change color!
	 * */
	public void setmViewPager(ViewPager mViewPager, int count, int... colors) {
//		this.mViewPager = mViewPager;
		if (mViewPager.getAdapter() == null) {
			throw new IllegalStateException(
					"ViewPager does not have adapter instance.");
		}
		mPageChangeListener.setViewPagerChildCount(count);

		mViewPager.setOnPageChangeListener(mPageChangeListener);
		if (colors.length == 0) {
			createDefaultAnimation();
		} else {
			createAnimation(colors);
		}

	}

	public ColorAnimationView(Context context) {
		this(context, null, 0);

	}

	public ColorAnimationView(Context context, AttributeSet attrs) {
		this(context, attrs, 0);
	}

	public ColorAnimationView(Context context, AttributeSet attrs, int defStyleAttr) {
		super(context, attrs, defStyleAttr);
		mPageChangeListener = new PageChangeListener();
	}

	private void seek(long seekTime) {
		if (colorAnim == null) {
			createDefaultAnimation();
		}
		colorAnim.setCurrentPlayTime(seekTime);
	}

	private void createAnimation(int... colors) {
		if (colorAnim == null) {
			colorAnim = ObjectAnimator.ofInt(this,
					"backgroundColor", colors);
			colorAnim.setEvaluator(new ArgbEvaluator());
			colorAnim.setDuration(DURATION);
			colorAnim.addUpdateListener(this);
		}
	}

	private void createDefaultAnimation() {
		colorAnim = ObjectAnimator.ofInt(this,
				"backgroundColor", WHITE, RED, BLUE, GREEN, WHITE);
		colorAnim.setEvaluator(new ArgbEvaluator());
		colorAnim.setDuration(DURATION);
		colorAnim.addUpdateListener(this);
	}

	@Override public void onAnimationStart(Animator animation) {

	}

	@Override public void onAnimationEnd(Animator animation) {
	}

	@Override public void onAnimationCancel(Animator animation) {

	}

	@Override public void onAnimationRepeat(Animator animation) {

	}

	@Override public void onAnimationUpdate(ValueAnimator animation) {
		invalidate();
//		long playtime = colorAnim.getCurrentPlayTime();
	}

	private class PageChangeListener
			implements ViewPager.OnPageChangeListener {

		private int viewPagerChildCount;

		public void setViewPagerChildCount(int viewPagerChildCount) {
			this.viewPagerChildCount = viewPagerChildCount;
		}

		public int getViewPagerChildCount() {
			return viewPagerChildCount;
		}

		@Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

			int count = getViewPagerChildCount() - 1;
			if (count != 0) {
				float length = (position + positionOffset) / count;
				int progress = (int) (length * DURATION);
				ColorAnimationView.this.seek(progress);
			}
			// call the method by default
            if (onPageChangeListener!=null){
                onPageChangeListener.onPageScrolled(position,positionOffset,positionOffsetPixels);
            }

		}

		@Override public void onPageSelected(int position) {
            if (onPageChangeListener!=null) {
                onPageChangeListener.onPageSelected(position);
            }
		}

		@Override public void onPageScrollStateChanged(int state) {
            if (onPageChangeListener!=null) {
                onPageChangeListener.onPageScrollStateChanged(state);
            }
		}
	}
}
分享到:
评论

相关推荐

    实现滑动ViewPager渐变背景色

    在Android应用开发中,创建吸引用户的交互体验是至关重要的,其中滑动ViewPager的渐变背景色效果就是一个很好的例子。这个效果能为用户带来流畅而动态的视觉体验,提高应用程序的吸引力。本文将深入探讨如何实现这个...

    guildbackground:实现滑动ViewPager渐变背景色

    在描述中,虽然没有提供具体的效果图,但我们可以想象,当用户在`ViewPager`中滑动页面时,背景色会逐渐过渡,从当前页的颜色平滑地变化到下一页的颜色。这种效果通常通过自定义`ViewPager`的滑动监听器和动画实现。...

    3d滑动viewpager水平实现

    首先,要实现3D滑动效果,我们需要自定义一个ViewPager的子类,并重写其关键方法。通常,这包括`onPageScrolled`、`onPageSelected`和`onPageScrollStateChanged`。在这些方法中,我们可以根据页面滚动的状态和位置...

    竖向滑动viewpager和横向滑动viewpager混用

    在Android开发中,ViewPager是一个非常常用的组件,它用于展示可滑动的页面,通常用于实现Tab切换或轮播图效果。然而,标题“竖向滑动viewpager和横向滑动viewpager混用”揭示了一个更高级的应用场景,即在同一应用...

    android垂直滑动viewpager

    在标题"android垂直滑动viewpager"和描述中提到的需求,显然是要实现一个能够进行垂直滑动的ViewPager变体,这在某些特定的设计或应用需求中可能会非常有用。下面我们将详细探讨如何实现这个功能。 1. **自定义...

    Android实现实时滑动ViewPager的2种方式

    在某些场景下,我们可能需要实现一个实时滑动的效果,即在用户滑动ViewPager时,页面的切换能够立即响应,而不是等到滑动停止后才进行切换。本文将介绍两种实现实时滑动ViewPager的方法。 首先,我们来看一下给定的...

    Android 自定义ViewPager实现ViewPager背景的滑动

    背景图片自动滚动,根据计算,当ViewPager切换到最后一个页面时,背景也同时滑动到最后,如果背景图片宽度较小,ViewPager每次切换时,背景图片会滑动较小的距离,很多手机的桌面都是实现的相同效果。代码中自定义...

    墨迹天气上下滑动viewpager

    在实现这样的上下滑动效果时,开发者可能需要以下几点关键知识点: 1. **ViewPager的使用**:首先,理解ViewPager的基本用法,包括设置Adapter、添加PageTransformer等。Adapter负责提供每个页面的内容,...

    自定义滑动ViewPager

    在Android开发中,ViewPager是一个非常常用的组件,它允许用户通过左右滑动来浏览多个页面,通常用于实现TabLayout或者轮播图等效果。本实例主要探讨如何自定义一个滑动ViewPager,以满足特定需求,例如增加特殊动画...

    ViewPager无限循环左右滑动效果

    总结来说,实现ViewPager无限循环左右滑动效果的关键在于自定义一个适配器并处理边界条件,同时可能需要监听滑动事件以实现平滑的过渡。通过这种方式,用户可以在ViewPager中无限制地前后滑动,增加了用户体验的流畅...

    android纵向滑动viewpager

    在Android开发中,ViewPager是一种常用的组件,它允许用户通过左右滑动来切换不同的页面,通常用于实现类似相册、应用导航等效果。在“android纵向滑动viewpager”的主题中,我们关注的是如何使ViewPager支持垂直...

    类似竖直滑动ViewPager

    在Android开发中,`ViewPager` 是一个非常常用的组件,它允许用户通过左右滑动来浏览多个页面,通常用于实现Tab切换或轮播图等效果。然而,标题提到的"类似竖直滑动ViewPager"则是对传统`ViewPager`的一种扩展,即`...

    android viewpager滑动效果

    本项目“android viewpager滑动效果”专注于实现ViewPager的滑动动态效果,提供了预封装好的接口,使得开发者可以直接使用,无需从头实现复杂的动画逻辑。 ViewPager的滑动效果通常通过PageTransformer来实现,这是...

    自动或手动循环滑动ViewPager

    本教程将深入探讨如何实现一个具有自动定时滑动和手动循环滑动功能的ViewPager,以创建类似顶部广告栏的效果。 首先,我们需要理解ViewPager的基本用法。ViewPager继承自PagerAdapter,它通过Adapter来填充数据并...

    完美解决ViewPager嵌套的滑动问题

    当ViewPager 嵌套时,子ViewPager,不能优先处理滑动事件。 玩一下 网易新闻 客户端,多层嵌套,处理的很流畅,不过也有点小bug。此Demo完美解决ViewPager嵌套的滑动问题,但快速滑动父ViewPager,再滑动ViewPager...

    左右滑动ViewPager完整项目实例源码

    ViewPager是Android SDK中的一个强大视图,用于在水平方向上展示多个页面,通常用于实现平滑的页面滑动效果,常用于应用的引导页、图片轮播或者在TabLayout中展示多个片段(Fragment)。 【描述】"滑到最后一页再往...

    自定义ViewPager (禁止滑动和去除切换效果)

    自定义ViewPager (禁止滑动和去除切换效果) viewPager.setNoScroll(true);//禁止手动滑动

    ViewPager实现屏幕滑动效果源码

    在实现`ViewPager`的滑动效果时,有以下几个关键知识点: 1. **布局文件**:`ViewPager`通常放置在主布局文件中,如`activity_main.xml`。通过`&lt;androidx.viewpager.widget.ViewPager&gt;`标签添加,并指定其ID以便在...

    android_viewPager左右滑动_实现光标动态滑动效果

    总结起来,实现"android_viewPager左右滑动_实现光标动态滑动效果"的关键在于理解ViewPager的工作原理,创建自定义光标View,并在页面滑动时准确更新光标的位置。通过这样的实践,开发者可以创建出更加交互友好、...

    竖直滑动的viewpager

    然而,“直接调用该空间传入fragment可以实现竖直滑动切换效果”,这意味着开发者通过自定义或使用已有的库,修改了ViewPager的内部逻辑,使其能够接受并处理垂直滑动的输入,从而在垂直方向上切换Fragment或页面。...

Global site tag (gtag.js) - Google Analytics