Android——ViewPager滑动背景渐变（自定义view，ViewPager）

效果：

ActivityBackgroundImage,java（自定义视图）

package com.example.chenshuai.test322;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

import java.util.List;

/**
 * Created by chenshuai on 2016/4/22.
 */
public class ActivityBackgroundImage extends View {

    private int mPosition;
    private float mDegree;
    private List<Drawable> mDrawableLists;
    private int mPrePosition = 0;
    private Drawable mNext;

    //自己写的方法 生成set方法
    //设置背景图片的drawble
    public void setmDrawableLists(List<Drawable> mDrawableLists) {

        this.mDrawableLists = mDrawableLists;

        mNext = mDrawableLists.get(1);//设置下一个背景图片的drawable
    }
    //设置图片位置?
    public void setmPosition(int mPosition) {

        this.mPosition = mPosition;
    }
    //设置图片
    public void setmDegree(float mDegree) {

        this.mDegree = mDegree;
    }

    //生成构造方法
    public ActivityBackgroundImage(Context context) {
        super(context);
    }

    public ActivityBackgroundImage(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public ActivityBackgroundImage(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    public ActivityBackgroundImage(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    //自绘控件的意思是，这个控件上的内容是用onDraw函数绘制出来的。
    @Override
    protected void onDraw(Canvas canvas) {
        Log.i("111", "onDraw");

        //自定义属性
        if (null == mDrawableLists) {
            return;
        }

        //透明度
        int alpha1 = (int) (255 - (mDegree * 255));

        //边框
        Drawable fore = mDrawableLists.get(mPosition);
        fore.setBounds(0, 0, getWidth(), getHeight());
        mNext.setBounds(0, 0, getWidth(), getHeight());

        if (mPrePosition != mPosition) {//边界判断

            if (mPosition != mDrawableLists.size() - 1) {

                mNext = mDrawableLists.get(mPosition + 1);

            } else {

                mNext = mDrawableLists.get(mPosition);

            }

        }

        fore.setAlpha(alpha1);//淡出

        mNext.setAlpha(255);

        mNext.draw(canvas);

        fore.draw(canvas);

        mPrePosition = mPosition;
        super.onDraw(canvas);
    }
}

activity_activityhuadong.xml

<?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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.chenshuai.test322.Activityhuadong">

    <com.example.chenshuai.test322.ActivityBackgroundImage
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/img"/>

    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/viewpager">
    </android.support.v4.view.ViewPager>

</RelativeLayout>

vp.xml

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

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="第几个"
        android:textSize="30sp"
        android:gravity="center"
        android:id="@+id/txt"/>

</LinearLayout>

Activityhuadong.java

package com.example.chenshuai.test322;

import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

public class Activityhuadong extends AppCompatActivity {

    private ActivityBackgroundImage mImg;
    private ViewPager mViewPager;
    private List<View> mViewLists;
    private List<Drawable> mDrawableLists;
    private static final int ALL = 5;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_activityhuadong);

        initViews();
        //设置图片列表? 准备数据?
        mImg.setmDrawableLists(mDrawableLists);

        //设置ViewPager适配器?
        mViewPager.setAdapter(new MyAdapter());
        //加监听
        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                mImg.setmPosition(position);
                mImg.setmDegree(positionOffset);
                mImg.invalidate();
            }

            @Override
            public void onPageSelected(int position) {

            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });

    }

    private void initViews()
    {
        mImg = (ActivityBackgroundImage) findViewById(R.id.img);

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

        mViewLists = new ArrayList<View>();

        mDrawableLists = new ArrayList<Drawable>();

        for (int i = 0; i < ALL; i++) {

            View view = getLayoutInflater().inflate(R.layout.vp, null);

            mViewLists.add(view);

            if (i % 2 == 0) {

                mDrawableLists.add(getResources().getDrawable(R.drawable.df, null));

            } else {

                mDrawableLists.add(getResources().getDrawable(R.drawable.hh,null));

            }

        }
    }
    //用PagerAdapter
    class MyAdapter extends PagerAdapter{

        // 获取要滑动的控件的数量，在这里我们以滑动的广告栏为例，那么这里就应该是展示的广告图片的ImageView数量
        @Override
        public int getCount() {
            return mViewLists.size();
        }

        // 来判断显示的是否是同一张图片，这里我们将两个参数相比较返回即可
        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        //PagerAdapter只缓存三张要显示的图片，如果滑动的图片超出了缓存的范围，就会调用这个方法，将图片销毁
        //覆盖destroyItem方法
        @Override
        public void destroyItem(ViewGroup container, int position, Object object) {
            ((ViewPager)container).removeView(mViewLists.get(position));

        }

        // 当要显示的图片可以进行缓存的时候，会调用这个方法进行显示图片的初始化，
        // 我们将要显示的ImageView加入到ViewGroup中，然后作为返回值返回即可
        //覆盖instantiateItem方法
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            View v = mViewLists.get(position);

           TextView textView = (TextView) v.findViewById(R.id.txt);

           textView.setText("第" + position + "个");

            ((ViewPager)container).addView(v);

            return v;
        }
    }
}