ScrollView实现图片拉伸效果，仿QQ好友动态头部效果

一.功能介绍

自定义ScrollView实现图片拉伸效果,下拉放大头部图片,监听滑动,改变标题头部是个图片,下面是个WebView,滑动改变标题状态;

二.代码介绍

1.自定义ScrollView ,重写onTouchEvent()方法,监听触摸下拉 上滑位置,实现图片放大以及回弹;

@Override
    public boolean onTouchEvent(MotionEvent ev) {
        if (zoomViewWidth <= 0 || zoomViewHeight <=0) {
            zoomViewWidth = zoomView.getMeasuredWidth();
            zoomViewHeight = zoomView.getMeasuredHeight();
        }
        if (zoomView == null || zoomViewWidth <= 0 || zoomViewHeight <= 0) {
            return super.onTouchEvent(ev);
        }
        switch (ev.getAction()) {
            case MotionEvent.ACTION_MOVE:
                if (!mScaling) {
                    if (getScrollY() == 0) {
                        y = ev.getY();//滑动到顶部时，记录位置
                    } else {
                        break;
                    }
                }
                int distance = (int) ((ev.getY() - y)*mScaleRatio);
                if (distance < 0) break;//若往下滑动
                mScaling = true;
                setZoom(distance);
                return true;
            case MotionEvent.ACTION_UP:
                mScaling = false;
                replyView();
                break;
        }
        return super.onTouchEvent(ev);
    }

2.重写oonScrollChanged()方法,监听滑动

 @Override
    protected void onScrollChanged(int l, int t, int oldl, int oldt) {
        super.onScrollChanged(l, t, oldl, oldt);
        if (onScrollListener != null) {

            if (oldt < y ) {
                // 手指向上滑动，屏幕内容下滑
                onScrollListener.onScroll(oldt,t,false);

            } else if (oldt > y ) {
                // 手指向下滑动，屏幕内容上滑
                onScrollListener.onScroll(oldt,t,true);
            }

        }
    }

3.滑动监听,改变标题状态

//获取dimen属性中 标题和头部图片的高度
        final float title_height = getResources().getDimension(R.dimen.title_height);
        final float head_height = getResources().getDimension(R.dimen.head_height);

        //滑动事件回调监听（一次滑动的过程一般会连续触发多次）
        head_zoomscrollview.setOnScrollListener(new HeadZoomScrollView.OnScrollListener() {
            @Override
            public void onScroll(int oldy, int dy, boolean isUp) {
                float move_distance = head_height - title_height;
                if (!isUp && dy <= move_distance) {
                    //手指往上滑,距离未超过头部高度
                    iv_back.setImageResource(R.mipmap.back_white);
                    biaoti.setBackgroundColor(Color.argb((int) 0, 0, 0, 0));
                } else if (!isUp && dy > move_distance) {
                    // 手指往上滑,距离超过头部高度
                    iv_back.setImageResource(R.mipmap.back_black);
                    biaoti.setBackgroundColor(Color.argb((int) 255, 255, 255, 255));

                } else if (isUp && dy > move_distance) {
                    //返回顶部，但距离头部位置大于头部高度

                } else if (isUp && dy <= move_distance) {
                    //返回顶部，但距离头部位置小于头部高度
                    iv_back.setImageResource(R.mipmap.back_white);
                    biaoti.setBackgroundColor(Color.argb((int) 0, 0, 0, 0));
                }
            }
        });

滑动监听,改变标题栏渐变透明

/**
     * 滑动监听,标题改动
     */
    private void intseco() {

        //获取dimen属性中 标题和头部图片的高度
        final float title_height = getResources().getDimension(R.dimen.title_height);
        final float head_height = getResources().getDimension(R.dimen.head_height);

        //滑动事件回调监听（一次滑动的过程一般会连续触发多次）
        head_zoomscrollview.setOnScrollListener(new HeadZoomScrollView.OnScrollListener() {
            @Override
            public void onScroll(int oldy, int dy, boolean isUp) {
                float move_distance = head_height - title_height;
                if (!isUp && dy <= move_distance) {
                    //手指往上滑,距离未超过头部高度
                    iv_back.setImageResource(R.mipmap.back_white);
                    biaoti.setBackgroundColor(Color.argb((int) 0, 0, 0, 0));
                    TitleAlphaChange(dy,move_distance);
                } else if (!isUp && dy > move_distance) {
                    // 手指往上滑,距离超过头部高度
                    iv_back.setImageResource(R.mipmap.back_black);

                } else if (isUp && dy > move_distance) {
                    //返回顶部，但距离头部位置大于头部高度
                    iv_back.setImageResource(R.mipmap.back_black);
                    biaoti.setBackgroundColor(Color.argb((int) 255, 255, 255, 255));

                } else if (isUp && dy <= move_distance) {
                    //返回顶部，但距离头部位置小于头部高度
                    iv_back.setImageResource(R.mipmap.back_white);
                    biaoti.setBackgroundColor(Color.argb((int) 0, 0, 0, 0));
                    TitleAlphaChange(dy,move_distance);
                }
            }
        });
    }
    private void TitleAlphaChange(int dy, float mHeaderHeight_px) {//设置标题栏透明度变化
        float percent = (float) Math.abs(dy) / Math.abs(mHeaderHeight_px);
        //如果是设置背景透明度，则传入的参数是int类型，取值范围0-255
        //如果是设置控件透明度，传入的参数是float类型，取值范围0.0-1.0
        //这里我们是设置背景透明度就好，因为设置控件透明度的话，返回ICON等也会变成透明的。
        //alpha 值越小越透明
        int alpha = (int) (percent * 255);
        biaoti.setBackgroundColor(Color.argb((int) alpha, 255, 255, 255));
    }

效果演示

demo下载地址:

https://download.csdn.net/download/shanshan_1117/10288895

点击打开链接