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; } } }