viewpager切换效果

经常看到一些应用使用viewpager切换页面时效果非常炫酷,其实在Android中viewpager提供了一个方法用于设置页面切换时的效果setPageTransformer,然后重写void transformPage(View page, float position)就可以实现。
参数 page表示动画作用在当前的页面
position:可以理解为0表示当前页面,1表示当前页面的右边一个页面,-1表示左边一个页面。
举个栗子:当前情况是第一页->第二页
那么第一页的position变化是0->-1,第二页的变化是1->0
先上效果图吧

接着看下代码实现

/**
 * viewpager切换页面时动画
 */
public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private ViewPager viewPager;
    private ViewPaagerAdapter adapter;
    private ArrayList<View> viewlist=new ArrayList<>();//承载图片
    private int []imgList={R.drawable.img1,R.drawable.img2,R.drawable.img3,R.drawable.img4,R.drawable.img5,
            R.drawable.img6,  R.drawable.img7,R.drawable.img8};//图片数组


    private static final int TYPE_1=1;
    private static final int TYPE_2=2;
    private static final int TYPE_3=3;

    private Button btScal,btScalCenter,bt3D;



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);

        setView();

        viewPager= (ViewPager) findViewById(R.id.viewpager);

        adapter=new ViewPaagerAdapter(this,viewlist);
        viewPager.setAdapter(adapter);
//        viewPager.setOffscreenPageLimit(10);

    }


    public void setView() {//初始化view及设置viewpager切换时显示的图片

        btScal= (Button) findViewById(R.id.btScal);
        btScalCenter= (Button) findViewById(R.id.btScalCenter);
        bt3D= (Button) findViewById(R.id.bt3D);

        btScal.setOnClickListener(this);
        btScalCenter.setOnClickListener(this);
        bt3D.setOnClickListener(this);

        for (int i = 0; i < imgList.length; i++) {
            View view= LayoutInflater.from(this).inflate(R.layout.layout,null,false);
            ImageView img= (ImageView) view.findViewById(R.id.img);
            img.setBackgroundResource(imgList[i]);
            viewlist.add(view);
        }


    }

    public void setTransForm(int number){
        if (TYPE_1==number) {
            /**
             * 缩放效果
             */
            viewPager.setPageTransformer(true, new ViewPager.PageTransformer() {
                @Override
                public void transformPage(View page, float position) {
                    final float normalizedposition = Math.abs(Math.abs(position) - 1);
                    page.setScaleX(normalizedposition / 2 + 0.5f);
                    page.setScaleY(normalizedposition / 2 + 0.5f);
                }
            });
        }
        /**
         * 切换时从中心点放大
         */
        else if(TYPE_1==number){
            viewPager.setPageTransformer(false, new ViewPager.PageTransformer() {
                @Override
                public void transformPage(View page, float position) {
                    int width=page.getWidth();
                    int height=page.getHeight();
                    if (position>0&&position<=1) {
                        page.setTranslationX(-width*position);
                        page.setPivotX(width/2);
                        page.setPivotY(height/2);
                        page.setScaleX(1-position);
                        page.setScaleY(1-position);

                    }
                }
            });

        }

        else if(TYPE_1==number){
            /**
             * 3d旋转
             */
            viewPager.setPageTransformer(true, new ViewPager.PageTransformer() {
                @Override
                public void transformPage(View page, float position) {
                    int width=page.getWidth();
                    int pivot=0;
                    if (position<0 && position>=-1) {
                        pivot=width;

                    }else if(position>0 && position<=1){
                        pivot=0;

                    }
                    page.setPivotX(pivot);
                    page.setRotationY(90*position);
                }
            });

        }

    }


    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btScal:
                setTransForm(TYPE_1);
                break;
            case R.id.btScalCenter:
                setTransForm(TYPE_2);
                break;
            case R.id.bt3D:
                setTransForm(TYPE_3);
                break;

            default:
                break;
        }
    }
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值