ViewPager和视差动画

ViewPager和视差动画

最近在做APP的启动页，总结下用到的知识。

ViewPager的几个回调

PagerAdapter

PagerAdapter

是

ViewPager

最重要的

Adapter

, 一个

ViewPager

下面的page的加载以及Page滑动都要靠它来完成。为了达到高效的滑动和最低的内存消耗，实际上

ViewPager

只会加载当前page以及其左右各一个page。当page滑动到n页，则会自动回调

instantiateItem

加载n-1和n+1页的page。若已经加载过的page已经脱离了这3个要加载的page，则会回调

destroyItem

来将其回收掉。

public class WelcomePageAdapter extends PagerAdapter{
public WelcomePageAdapter() {
}

@Override
public Object instantiateItem(ViewGroup container, int position) {
LogUtil.d(TAG, "instantiateItem.......position = " + position);
View view = MainActivity.this.createWelcomePageView(position);
return view;
}

@Override
public void destroyItem(ViewGroup container, int position, Object object)
{
container.removeView((View)object);
}

@Override
public int getCount() {
return 3;
}

@Override
public boolean isViewFromObject(View arg0, Object arg1) {
}
}

OnPageChangeListener

OnPageChangeListener

是滑动时page改变的回调，这几个接口都十分有用。

onPageSelected(int position)

在滑动完全停止，页面完全显示的时候回调，

position

即指当前页面的index（从0开始计数）。

onPageScrolled(int position, float positionOffset, int positionOffsetPixels)

在滑动过程中调用；

position

和

onPageSelected

中的参数是一样的含义；

positionOffset

指当前页滑动的比例（从0 - 1的浮点数）；

positionOffsetPixels

指当前页滑动的像素。

onPageScrollStateChanged(int state)

在滑动状态改变的时候调用；分别可能为

SCROLL_STATE_IDLE

，

SCROLL_STATE_DRAGGING

和

SCROLL_STATE_SETTLING

。

class GuidePageChangeListener implements ViewPager.OnPageChangeListener {
ArgbEvaluator mColorEvaluator;
int mPageWidth;
int mTotalScrollWidth;
int mGuideStartBackgroundColor;
int mGuideEndBackgroundColor;

public GuidePageChangeListener() {
mColorEvaluator = new ArgbEvaluator();
mPageWidth = MainActivity.this.getWindowManager().getDefaultDisplay().getWidth();
mTotalScrollWidth = mPageWidth * 2;
mGuideStartBackgroundColor = getResources().getColor(R.color.welcome_page_bg_1);
mGuideEndBackgroundColor = getResources().getColor(R.color.welcome_page_bg_2);
}

@Override
public void onPageSelected(int position)
{
}

@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels)
{
float ratio = (mPageWidth * position + positionOffsetPixels) / (float) mTotalScrollWidth;
Integer color = (Integer) mColorEvaluator.evaluate(ratio, mGuideStartBackgroundColor, mGuideEndBackgroundColor);
welcomeViewPager.setBackgroundColor(color);
}

@Override
public void onPageScrollStateChanged(int state)
{
}
}

背景渐变

在

ViewPager

滑动的过程，如何让背景在滑动过程产生顺滑的变化？

实际上，上面的代码已经实现了这一功能。要实现背景渐变，不得不提到属性动画和

ArgbEvaluator

。

以前的ViewAnimation只能改变View的一些属性，现在属性动画突破了这个限制。所有你想改变的属性，都可以改变。

ArgbEvaluator

实现了

TypeEvaluator

（继承

TypeEvaluator

还有

FloatArrayEvaluator

,

FloatEvaluator

,

IntArrayEvaluator

,

IntEvaluator

,

PointFEvaluator

,

RectEvaluator

），可以通过

ArgbEvaluator

来估算两个颜色之间任意部分的色值。

利用

ArgbEvaluator

和

OnPageChangeListener

我们就可以实现滑动中颜色的平滑过渡了。

参考博客：http://ryanhoo.github.io/blog/2014/07/16/step-by-step-implement-parallax-animation-for-splash-screen-of-zhihu/