超简单实现ViewPage引导页动画

先上效果
这里写图片描述

public class MainActivity extends FragmentActivity {

    private ViewPager viewPager;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager = (ViewPager) findViewById(R.id.vp);

        MyFragmentStatePagerAdapter adapter = new MyFragmentStatePagerAdapter(getSupportFragmentManager());

        viewPager.setPageTransformer(true, new MyTrans());
        viewPager.setAdapter(adapter);
    }

    class MyFragmentStatePagerAdapter extends FragmentStatePagerAdapter{

        public MyFragmentStatePagerAdapter(FragmentManager fm) {
            super(fm);
        }
        @Override
        public Fragment getItem(int arg0) {
            //实例化5个fragment
            Fragment f = new TranslatePageFragment();
            Bundle bundle = new Bundle();
            bundle.putInt("position", arg0);
            f.setArguments(bundle);

            return f;
        }
        @Override
        public int getCount() {
            return 4;
        }
    }
}
public class TranslatePageFragment extends Fragment {

    private int[] icons = {
        R.drawable.mm0,
        R.drawable.mm1,
        R.drawable.mm2,
        R.drawable.mm3
    };

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.viewpager_main, null);
        ImageView iv = (ImageView) view.findViewById(R.id.iv);
        Bundle bundle = getArguments();
        int position = bundle.getInt("position");

        iv.setImageResource(icons[position]);

        return view;
    }

}
public class MyTrans implements PageTransformer {

    /***
     * 每一个view在滑动的过程当中都会回调这个方法
     * view:当前滑动的
     * 
     */
    @SuppressLint("NewApi")
    @Override
    public void transformPage(View view, float position) {

        if(position < -1){
            //不可见
            view.setAlpha(0);

        }else if(position <= 1){
            //可见
            view.setAlpha(1);
            ImageView iv = (ImageView) view.findViewById(R.id.iv);
            //第一种效果:朝反方向行驶一段距离
            //iv.setTranslationX(-position*0.6f*view.getWidth());

            //第二种效果:缩放 position 0~-1
            //view.setScaleX(Math.max(0.9f,1-Math.abs(position)));
            //view.setScaleY(Math.max(0.9f,1-Math.abs(position)));

            //第三种效果:立体翻转----外翻
            //旋转角度90f----旋转中心点
            /*view.setPivotX(position<0f?view.getWidth():0f);
            view.setPivotY(view.getHeight()*0.5f);
            view.setRotationY(position*90f);
            */

            //第四种效果:绕着正中间旋转
            view.setPivotX(view.getWidth()*0.5f);
            view.setPivotY(view.getHeight()*0.5f);
            view.setRotationY(-position*40f);


        }else{
            //不可见
            view.setAlpha(0);
        }

    }

}

就是这么简单,就是这么任性轻松搞定,做个记录

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值