• Android为ViewPager添加切换动画——自己定义ViewPager


    转载请注明出处:http://blog.csdn.net/allen315410/article/details/44224517

    在上篇博客中,我写了一个使用属性动画为ViewPager加入切换动画的方法。而且能够兼容到Android3.0以下版本号的设备上。那么关于为ViewPager加入动画的方式还会有第二种实现方案。就是自己定义一个自己带动画效果的ViewPager,关于上篇博客,还没来得及查看的朋友能够点击这里进行查看。以下。我们将新建一个project。来说说如何自己定义一个自带切换动画效果的ViewPager。


    分析

    首先我们分析一下实现自己定义ViewPager自带切换动画效果时,我们须要拿到一些什么?第一,我们知道ViewPager来回切换的时候。事实上就是不同的View在屏幕上切换。所以我们在自己定义ViewPager的时候须要拿到当前正在切换的2个View。第二,既然我们要为ViewPager加入动画。那么我们就须要自己定义动画。好,以上两个点都是在这个自己定义ViewPager中被须要的东西,我们一步步来创建和获取到吧。

    接下来。我新建一个类ViewPagerWithTransformer继承自ViewPager。来实现自己定义的ViewPager。首先。我们重写一下ViewPager中的一个方法,代码例如以下。我们在方法中打印一下方法中的參数,在布局文件里使用这个自己定义的ViewPager。在Activity中为这个ViewPager添加数据适配器。加入3个ImageView到ViewPager中,实现ViewPager上的切换,代码能够见上一篇博客中MainActivity中。

    @Override
    protected void onPageScrolled(int position, float offset, int offsetPixels) {
    	super.onPageScrolled(position, offset, offsetPixels);
    	Log.i("TAG", "position = " + position + ",offset = " + offset + ",offsetPixels = " + offsetPixels);
    }

    上面方法中的參数已经被打印了,LOG输出日志在以下,首先看一下从第0页滑动到第1页的LOG:


    然后,再看一下从第1页滑动到第0页的LOG:


    分析一下上面的LOG日志:

    当第0页-->第1页:position从0-->1;offset从0-->1;offsetPixels从0-->屏幕最大宽度

    当第1页-->第0页:position从1-->0;offset从1-->0;offsetPixels从0-->屏幕最大宽度

    明显能够感知,仅仅有position代表的是当前正在切换View的位置,offset表示View的偏移比重,offsetPixels表示View实际的偏移量(px)。


    获取切换中的View对象

    【错误】上面我们分析我们再自己定义一个带动画切换的ViewPager时,须要得到正在切换中的2个View对象。那么我们该怎么在代码中获取到这2个View的对象呢?大家知道,上篇博客中我们使用了ViewPager的源代码。ViewPager的父类是ViewGroup,我们知道在ViewGroup中想要获取View对象的话,有个getChildAt(int index)方法能够得到View对象。这种方法在ViewGroup中使用是没有问题的,然后在ViewPager中使用就会出错了。由于ViewPager中加入了缓存机制。一个ViewPager默认仅仅能缓存2-3个View的对象,当有很多其它的View对象被载入到ViewPager中时。ViewPager会舍弃掉前面一个View对象,这样就导致我们不能通过getChildAt(position)、getChildAt(position-1)、getChildAt(position+1)方法来获取上一个、当前、下一个View对象了,显然position代表的View对象不止两三个,而是无限的。

    【错误】通过getChildAt(position)显然获取不到我们想要的对象了,既然不能使用position的话。ViewGroup中另一个getCurrentItem()获取当前View的角标和getChildCount()方法获取View数量的方法。是不是能够用呢?我们先在onPageScrolled()方法中打印一下LOG日志吧。


    我们能够看到,getCurrentItem的值一直在不断的变化着,当我们打开第1页时。getCurrentItem=0,这是我们能够依据这个getCurrentItem的值带入getChildAt(getCurrentItem-1)、getChildAt(getCurrentItem)、getChildAt(getCurrentItem+1)中。确实能够获取到上一个View。当前View、下一个View。

    然后不幸的是,当我们手指从屏幕中放开的时候。getCurrentItem变成了1。这时前面通过getChildAt(getCurrentItem)获取到的View就不正确了。

    所以依据getCurrentItem()获取View也是不正确的。

    【正确】通过上面2种方法均不能准确的获取到当前的View对象了。我们再来细看一下position这个參数。结合上面的LOG输入看一下。当我们在ViewPager中使得第0页滑向第1页的时候。position是没有变化的,此时pisition=0;当我们从第1页滑到第0页的时候,position还没没有变化,此时position=0;由此我们是不是还是能够依据position来确定View的对象。我们如果position代表第0页的View,那么position+1就是代表第1页的View了。以此类推就能够得到所有的View了。以下,我们就能够在代码中去实现我们这种想法了。也特别的简单,就是创建一个Map集合用来为View做一个缓存机制,我们使用position作为键,使用view的对象作为值,而且向外提供一个加入View缓存的方法和一个移除View缓存的方法。当我们为ViewPager提供适配器PagerAdapter时,能够在instantiateItem(ViewGroup container, int position)方法中将View对象设置进View的缓存集合中。在destroyItem(ViewGroup container, int position, Object object)方法中将View从缓存集合中移除。详细部分代码例如以下:

    // 保存ViewPager上View的对象
    private Map<Integer, View> mViewCache = new HashMap<Integer, View>();
    
    /**
     * 设置View的缓存
     * 
     * @param position
     * @param viewCache
    */
    public void setViewCache(Integer position, View viewCache) {
    	mViewCache.put(position, viewCache);
    }
    
    /**
     * 从View的缓存集合中移除指定position的View
     * 
     * @param position
     */
    public void removeViewCache(Integer position) {
    	mViewCache.remove(position);
    }


    切换动画的实现

    上面攻克了一个头疼的问题。如果获取正在切换中的View对象,这个问题已经在上面解决掉了,那么以下就仅仅剩下动画了。

    我们在这个案例模仿上篇博客中的DepthPageTransformer动画效果吧。我们自己定义两种动画。一个Scale动画和一个Translate动画,使两个动画交替一起运行就能够模仿出DepthPageTransformer这种平移缩放的动画效果出来,代码非常easy,不单独贴出了。以下有完整的代码的。


    完整的代码

    自己定义ViewPager的源代码。ViewPagerWithTransformer.java
    public class ViewPagerWithTransformer extends ViewPager {
    
    	// 左边的View
    	private View mLeftView;
    	// 右边的View
    	private View mRightView;
    	// 平移动画的梯度值
    	private float mTranslate;
    	// 缩放动画的梯度值
    	private float mScale;
    	// 最小缩放比例
    	private static final float MIN_SCALE = 0.6f;
    	// 保存ViewPager上View的对象
    	private Map<Integer, View> mViewCache = new HashMap<Integer, View>();
    
    	/**
    	 * 设置View的缓存
    	 * 
    	 * @param position
    	 * @param viewCache
    	 */
    	public void setViewCache(Integer position, View viewCache) {
    		mViewCache.put(position, viewCache);
    	}
    
    	/**
    	 * 从View的缓存集合中移除指定position的View
    	 * 
    	 * @param position
    	 */
    	public void removeViewCache(Integer position) {
    		mViewCache.remove(position);
    	}
    
    	public ViewPagerWithTransformer(Context context, AttributeSet attrs) {
    		super(context, attrs);
    		// TODO Auto-generated constructor stub
    	}
    
    	@Override
    	protected void onPageScrolled(int position, float offset, int offsetPixels) {
    		super.onPageScrolled(position, offset, offsetPixels);
    		mLeftView = mViewCache.get(position);
    		mRightView = mViewCache.get(position + 1);
    		animStack(mLeftView, mRightView, offset, offsetPixels);
    	}
    	
    	private void animStack(View left, View right, float offset, int offsetPixels) {
    		// TODO Auto-generated method stub
    		if (right != null) {
    			// 从第0页——》到第1页,offset:0~1。缩放比例mScale:0.6~1
    			mScale = (1 - MIN_SCALE) * offset + MIN_SCALE;
    			//平移的距离
    			mTranslate = -getWidth() - getPageMargin() + offsetPixels;
    
    			//使用NineOldAndroids编写属性动画
    			ViewHelper.setScaleX(right, mScale);
    			ViewHelper.setScaleY(right, mScale);
    			ViewHelper.setTranslationX(right, mTranslate);
    		}
    		if (left != null) {
    			// 左边的页永远在最上面
    			left.bringToFront();
    		}
    	}
    }
    在布局文件里申明,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" >
    
        <com.example.viewpagerwithtransformeranim.ViewPagerWithTransformer
            android:id="@+id/viewpager"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >
        </com.example.viewpagerwithtransformeranim.ViewPagerWithTransformer>
    
    </RelativeLayout>
    在Activity中使用这个控件。MainActivity.java
    public class MainActivity extends Activity {
    
    	private int[] imgRes = new int[] { R.drawable.guide_image1, R.drawable.guide_image2, R.drawable.guide_image3 };
    	private List<ImageView> imgList = new ArrayList<ImageView>();
    	private ViewPagerWithTransformer mViewPager;
    
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		requestWindowFeature(Window.FEATURE_NO_TITLE);
    		setContentView(R.layout.activity_main);
    		mViewPager = (ViewPagerWithTransformer) findViewById(R.id.viewpager);
    		mViewPager.setAdapter(new PagerAdapter() {
    
    			@Override
    			public boolean isViewFromObject(View arg0, Object arg1) {
    				return arg0 == arg1;
    			}
    
    			@Override
    			public int getCount() {
    				return imgRes.length;
    			}
    
    			@Override
    			public Object instantiateItem(ViewGroup container, int position) {
    				ImageView mImageView = new ImageView(MainActivity.this);
    				mImageView.setBackgroundResource(imgRes[position]);
    				mImageView.setScaleType(ScaleType.CENTER_CROP);
    				imgList.add(mImageView);
    				//给ViewPager设置View缓存
    				mViewPager.setViewCache(position, mImageView);
    				container.addView(mImageView);
    				return mImageView;
    			}
    
    			@Override
    			public void destroyItem(ViewGroup container, int position, Object object) {
    				//移除ViewPager的View缓存
    				mViewPager.removeViewCache(position);
    				container.removeView(imgList.get(position));
    			}
    		});
    	}
    }
    好,所有源代码在上面了,注意一下,在给ViewPager设置的适配器PagerAdapter里面重写instantiateItem方法时。一定要记得调用mViewPager.setViewCache(position, mImageView)方法,给ViewPager设置View缓存。然后在重写destroyItem方法中调用mViewPager.removeViewCache(position)方法移除View缓存。

    感谢CSDN博客专家鸿洋无私奉献的教程。教程视频地址:http://www.imooc.com/learn/226


  • 相关阅读:
    luogu p1268 树的重量——构造,真正考验编程能力
    luogu p2330[SCOI05] 繁忙的都市——瓶颈生成树
    生成树的个数——基尔霍夫定理(Matrix-Tree Theorem)
    子序列最大和
    有关pascal的填充语句小技巧
    P2320 [HNOI2006]鬼谷子的钱袋
    DP专题——括号序列
    简单的迷宫(bfs)noj1793
    G:献给阿尔吉侬的花束(可能超时)
    ytu 2335: 0-1背包问题
  • 原文地址:https://www.cnblogs.com/yjbjingcha/p/8430867.html
Copyright © 2020-2023  润新知