视差效果实现

视差效果实现效果图

1.先上效果图    源码当前使用的ReycleView当然也有使用listview版本的

使用ReycleView版本     使用ListView版本  

首先是自定义的两个view代码如下：

ParallaxRecycleView

package com.cock.parallaxrecyclerview.view;import android.content.Context;import android.support.v7.widget.RecyclerView;import android.util.AttributeSet;import com.cock.parallaxrecyclerview.holder.ParallaxViewHolder;/** * Author : Created by Luhailiang on 2016/8/29 12:11. * Email : [e-mail] */public class ParallaxRecyclerView extends RecyclerView {    private OnScrollListener scrollListener;    public ParallaxRecyclerView(Context context) {        super(context);        init();    }    public ParallaxRecyclerView(Context context, AttributeSet attrs) {        super(context, attrs);        init();    }    public ParallaxRecyclerView(Context context, AttributeSet attrs, int defStyle) {        super(context, attrs, defStyle);        init();    }    private void init() {        setOnScrollListener(defaultListener);    }    private OnScrollListener defaultListener = new OnScrollListener() {        @Override        public void onScrollStateChanged(RecyclerView recyclerView, int newState) {            super.onScrollStateChanged(recyclerView, newState);            if (scrollListener != null)                scrollListener.onScrollStateChanged(recyclerView, newState);        }        @Override        public void onScrolled(RecyclerView recyclerView, int dx, int dy) {            super.onScrolled(recyclerView, dx, dy);            for (int i = 0; i < recyclerView.getChildCount(); i++) {                ((ParallaxViewHolder) recyclerView.getChildViewHolder(recyclerView.getChildAt(i))).animateImage();            }            if (scrollListener != null)                scrollListener.onScrolled(recyclerView, dx, dy);        }    };    @Override    public void setOnScrollListener(OnScrollListener listener) {        if (listener != defaultListener)            this.scrollListener = listener;        else            super.setOnScrollListener(listener);    }}

ParallaxImageView

package com.cock.parallaxrecyclerview.view;import android.content.Context;import android.support.v7.widget.RecyclerView;import android.util.AttributeSet;import com.cock.parallaxrecyclerview.holder.ParallaxViewHolder;/** * Author : Created by Luhailiang on 2016/8/29 12:11. * Email : [e-mail] */public class ParallaxRecyclerView extends RecyclerView {    private OnScrollListener scrollListener;    public ParallaxRecyclerView(Context context) {        super(context);        init();    }    public ParallaxRecyclerView(Context context, AttributeSet attrs) {        super(context, attrs);        init();    }    public ParallaxRecyclerView(Context context, AttributeSet attrs, int defStyle) {        super(context, attrs, defStyle);        init();    }    private void init() {        setOnScrollListener(defaultListener);    }    private OnScrollListener defaultListener = new OnScrollListener() {        @Override        public void onScrollStateChanged(RecyclerView recyclerView, int newState) {            super.onScrollStateChanged(recyclerView, newState);            if (scrollListener != null)                scrollListener.onScrollStateChanged(recyclerView, newState);        }        @Override        public void onScrolled(RecyclerView recyclerView, int dx, int dy) {            super.onScrolled(recyclerView, dx, dy);            for (int i = 0; i < recyclerView.getChildCount(); i++) {                ((ParallaxViewHolder) recyclerView.getChildViewHolder(recyclerView.getChildAt(i))).animateImage();            }            if (scrollListener != null)                scrollListener.onScrolled(recyclerView, dx, dy);        }    };    @Override    public void setOnScrollListener(OnScrollListener listener) {        if (listener != defaultListener)            this.scrollListener = listener;        else            super.setOnScrollListener(listener);    }}

然后创建Adapter和ViewHolder

package com.cock.parallaxrecyclerview.holder;import android.support.v7.widget.RecyclerView;import android.view.View;import com.cock.parallaxrecyclerview.view.ParallaxImageView;/** * Author : Created by Luhailiang on 2016/8/29 12:14. * Email : [e-mail] */public abstract class ParallaxViewHolder extends RecyclerView.ViewHolder        implements ParallaxImageView.ParallaxImageListener {    private ParallaxImageView backgroundImage;    public abstract int getParallaxImageId();    public ParallaxViewHolder(View itemView) {        super(itemView);        backgroundImage = (ParallaxImageView) itemView.findViewById(getParallaxImageId());        backgroundImage.setListener(this);    }    @Override    public int[] requireValuesForTranslate() {        if (itemView.getParent() == null) {            // Not added to parent yet!            return null;        } else {            int[] itemPosition = new int[2];            itemView.getLocationOnScreen(itemPosition);            int[] recyclerPosition = new int[2];            ((RecyclerView) itemView.getParent()).getLocationOnScreen(recyclerPosition);            return new int[]{itemView.getMeasuredHeight(), itemPosition[1], ((RecyclerView) itemView.getParent()).getMeasuredHeight(), recyclerPosition[1]};        }    }    public void animateImage() {        getBackgroundImage().doTranslate();    }    public ParallaxImageView getBackgroundImage() {        return backgroundImage;    }}

package com.cock.parallaxrecyclerview.adapter;import android.content.Context;import android.support.v7.widget.RecyclerView;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;import com.cock.parallaxrecyclerview.R;import com.cock.parallaxrecyclerview.holder.ParallaxViewHolder;import com.squareup.picasso.Picasso;import java.util.ArrayList;/** * Author : Created by Luhailiang on 2016/8/29 12:22. * Email : [e-mail] */public class MyRecyclerAdapter extends RecyclerView.Adapter<MyRecyclerAdapter.ViewHolder> {    private Context context;    private LayoutInflater inflater;    private int getItemLayoutId ;    private ArrayList<Integer> mData;    public MyRecyclerAdapter(Context context, int getItemLayoutId, ArrayList<Integer> mData) {        this.context = context;        this.inflater = LayoutInflater.from(context);        this.getItemLayoutId = getItemLayoutId;        this.mData = mData;    }    @Override    public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int position) {        return new ViewHolder(inflater.inflate(getItemLayoutId, viewGroup, false));    }    @Override    public void onBindViewHolder(ViewHolder viewHolder, int position) {        Picasso.with(context).load(mData.get(position)).into(viewHolder.getBackgroundImage());        viewHolder.getTextView().setText("测试数据第" + position);        // Important to call this method        viewHolder.getBackgroundImage().reuse();    }    @Override    public int getItemCount() {        return mData.size();    }    /**     * # CAUTION:     * ViewHolder must extend from ParallaxViewHolder     */    public static class ViewHolder extends ParallaxViewHolder {        private final TextView textView;        public ViewHolder(View v) {            super(v);            textView = (TextView) v.findViewById(R.id.label);        }        @Override        public int getParallaxImageId() {            return R.id.backgroundImage;        }        public TextView getTextView() {            return textView;        }    }}

最后在MainActivity中调用

package com.cock.parallaxrecyclerview.activity;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.support.v7.widget.LinearLayoutManager;import com.cock.parallaxrecyclerview.R;import com.cock.parallaxrecyclerview.adapter.MyRecyclerAdapter;import com.cock.parallaxrecyclerview.view.ParallaxRecyclerView;import java.util.ArrayList;/** * Author : Created by Luhailiang on 2016/8/29 12:22. * Email : [e-mail] */public class MainActivity extends AppCompatActivity {    private ArrayList<Integer> list = new ArrayList<Integer>();    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initData();        ParallaxRecyclerView recyclerView = (ParallaxRecyclerView) findViewById(R.id.recyclerView);        recyclerView.setLayoutManager(new LinearLayoutManager(this));        recyclerView.setHasFixedSize(true);        recyclerView.setAdapter(new MyRecyclerAdapter(this, R.layout.item, list));    }    private void initData() {        for (int i = 0; i < 20; i++) {            list.add(R.mipmap.image1);            list.add(R.mipmap.image2);            list.add(R.mipmap.image3);            list.add(R.mipmap.image4);            list.add(R.mipmap.image5);        }    }}