android viewpager实现3d画廊效果

最新推荐文章于 2026-05-24 15:35:03 发布

原创最新推荐文章于 2026-05-24 15:35:03 发布 · 2.2k 阅读

本内容遵循CC 4.0 BY-SA版权协议

本文介绍了如何在Android中通过设置缓存、调整`android:clipChildren`属性、处理滑动事件、设置图片间隔以及利用`ViewPager.PageTransformer`接口创建3D画廊效果，详细讲解了各个步骤的实现方法和相关代码示例。

一缓存设置

修改viewPager的缓存页面数量

    viewPager.setOffscreenPageLimit(int numbers);

viewpager当前页面两侧缓存/预加载的页面数目。当页面切换时，当前页面相邻两侧的numbers页面不会被销毁。
默认numbers = 1；默认缓存3页。
博客参考 http://blog.csdn.net/manoel/article/details/40122999

二 android:clipChildren 属性的应用

需要在父view和子view里同时设置

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:clipChildren="false"
    android:layout_height="match_parent">

    <android.support.v4.view.ViewPager
        android:clipChildren="false"
        android:layout_gravity="center"
        android:id="@+id/vp_demo"
        android:layout_width="180dp"
        android:layout_height="300dp"/>

</LinearLayout>

作用同时显示多张图片

三左右两边图片不响应滑动，设置把activity触摸事件传递给viewPager

 @Override
    public boolean onTouchEvent(MotionEvent event) {
        return viewPager.onTouchEvent(event);
    }

四给图片之间设置间距

  @Override
        public Object instantiateItem(ViewGroup container, int position) {
            ImageView imageView = new ImageView(container.getContext());
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            if (position !=0 || position != pics.length-1){
                imageView.setPadding((int) getResources().getDimension(R.dimen.picdis),0,(int) getResources().getDimension(R.dimen.picdis),0);
            }
            imageView.setImageResource(pics[position]);
            container.addView(imageView);
            return imageView;
        }

五 3D gallery 效果，ViewPager.PageTransformer接口的使用

使用该接口来实现 page切换的过渡动画
可以设置旋转、透明、缩放、平移

    public interface PageTransformer {  
           /** 
            * Apply a property transformation to the given page. 
            * 
            * @param page Apply the transformation to this page 
            * @param position Position of page relative to the current front-and-center 
            *                 position of the pager. 0 is front and center. 1 is one full 
            *                 page position to the right, and -1 is one page position to the left. 
            */  
           public void transformPage(View page, float position);  
       }

可以看到该接口只有一个方法，第一个是我们的view，第二个是position~~
当我们滑动时：会打印出当前ViewPager中存活的每个View以及它们的position的变化~~注意是每一个，所以建议别只log position，不然你会觉得莫名其妙的输出~~
position的可能性的值有，其实从官方示例的注释就能看出：

[-Infinity,-1) 已经看不到了

(1,+Infinity] 已经看不到了

[-1,1]

重点看[-1,1]这个区间，其他两个的View都已经看不到了~~

假设现在ViewPager在A页现在滑出B页，则:

A页的position变化就是( 0, -1]

B页的position变化就是[ 1 , 0 ]

知道了我们滑动时position的变化~~那么就开始设计我们的个性的切换效果；
参考资料
http://blog.csdn.net/lmj623565791/article/details/40411921