【Android 开发技巧】利用 ViewPager，打造不一样的广告（月度账单）轮播切换效果

简述：

目前公司项目开发过程中，我负责的模块有涉及到一些页面UI需要用到类似Banner图轮播的效果，结合之前在公众号平台看过有类似实现的方式，然后在结合自身项目的需求，做了一些修改，使用到公司项目中来，本文只是做一些总结，积累。

效果图：

本文是利用ViewPager做类似风格的Banner图 。

引入：
compilecom.zhy:magic-viewpager:1.0.1``

布局文件：

<?xml version="1.0" encoding="utf-8"?>
<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"
    android:clipToPadding="false"
    android:fitsSystemWindows="true"
    >

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="220dp"
        android:clipChildren="false"
        android:layout_centerInParent="true"
        android:background="#aadc71ff"
        >
        <android.support.v4.view.ViewPager
            android:id="@+id/id_viewpager"
            android:layout_width="match_parent"
            android:layout_marginLeft="60dp"
            android:layout_marginRight="60dp"
            android:clipChildren="false"
            android:layout_height="180dp"
            android:layout_gravity="center"
            >
        </android.support.v4.view.ViewPager>

    </FrameLayout>



</RelativeLayout>
`

说明：
设置了ViewPager外层控件以及ViewPager都设置了Android:clipChildren=”false”。ViewPager的宽度是match_parent，左右设置了60dp的边距，就是为了显示出左右部分的Page.
接下来可以对ViewPager设置Adapter等相关属性

public class MainActivity extends AppCompatActivity {

    ViewPager mViewPager ;
    private PagerAdapter mAdapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    private void initView (){
        mViewPager = (ViewPager) findViewById(R.id.id_viewpager);
        //设置Page间间距
        mViewPager.setPageMargin(65);
        //设置Page缓存页数值
        mViewPager.setOffscreenPageLimit(6);
        //给ViewPager加特效(决定动画效果)
        mViewPager.setPageTransformer(true, (new AlphaPageTransformer(new ScaleInTransformer())));
        mViewPager.setAdapter(mAdapter = new PagerAdapter() {
            @Override
            public Object instantiateItem(ViewGroup container, int position) {
                View view = LayoutInflater.from(MainActivity.this).inflate(R.layout.layout_monthly_bills_item, null);

                container.addView(view);
                return view;
            }

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

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

            @Override
            public boolean isViewFromObject(View view, Object object) {
                return view == object;
            }
        });

    }
}

注意 ：

//设置Page间间距 
ViewPager.setPageMargin(65);

//设置Page缓存页数值
mViewPager.setOffscreenPageLimit(6);

//给ViewPager加特效(决定动画效果) 
mViewPager.setPageTransformer(true, (new AlphaPageTransformer(new ScaleInTransformer())));

DEMO下载：pan.baidu.com/s/1eRNFADW