整合大量开源库温习基础项目（四）伸缩实现OverscrollScale以及MaterialLoadingProgressBar

转载请注明出处：王亟亟的大牛之路

运行效果：（还是有点卡顿，大致看得到内容）

这一次的菜单的UI在上一篇文章中已经做了修改，上一篇的样子：

因为没想到要做些什么东西，所以大致的放了这几个栏目，这一片先把我们新加入的库来讲一下。

Gradle:

  compile 'com.dodola:listviewext:1.0'
  compile('com.lsjwzh:materialloadingprogressbar:0.5.8-RELEASE')

支持伸缩的ListView : https://github.com/dodola/OverscrollScale

自定义进度条View:https://github.com/lsjwzh/MaterialLoadingProgressBar

都是相当轻量级的两个自定义控件，使用也非常简单。

---

CircleProgressBar

我们来简单的分析一下这个自定义View

//继承于ImageView，也就是说没有了我们Dialog的一些父类的方法，什么都是自己画的
public class CircleProgressBar extends ImageView

常见的构造方法，内部都是一个private void init(Context context, AttributeSet attrs, int defStyleAttr)方法。

    public CircleProgressBar(Context context) {
        super(context);
        init(context, null, 0);

    }

    public CircleProgressBar(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs, 0);

    }

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

初始化参数：

    private void init(Context context, AttributeSet attrs, int defStyleAttr) {
        final TypedArray a = context.obtainStyledAttributes(
                attrs, R.styleable.CircleProgressBar, defStyleAttr, 0);
        final float density = getContext().getResources().getDisplayMetrics().density;

        mBackGroundColor = a.getColor(
                R.styleable.CircleProgressBar_mlpb_background_color, DEFAULT_CIRCLE_BG_LIGHT);

        mProgressColor = a.getColor(
                R.styleable.CircleProgressBar_mlpb_progress_color, DEFAULT_CIRCLE_BG_LIGHT);
        mColors = new int[]{mProgressColor};

        mInnerRadius = a.getDimensionPixelOffset(
                R.styleable.CircleProgressBar_mlpb_inner_radius, -1);

        mProgressStokeWidth = a.getDimensionPixelOffset(
                R.styleable.CircleProgressBar_mlpb_progress_stoke_width, (int) (STROKE_WIDTH_LARGE * density));
        mArrowWidth = a.getDimensionPixelOffset(
                R.styleable.CircleProgressBar_mlpb_arrow_width, -1);
        mArrowHeight = a.getDimensionPixelOffset(
                R.styleable.CircleProgressBar_mlpb_arrow_height, -1);
        mTextSize = a.getDimensionPixelOffset(
                R.styleable.CircleProgressBar_mlpb_progress_text_size, (int) (DEFAULT_TEXT_SIZE * density));
        mTextColor = a.getColor(
                R.styleable.CircleProgressBar_mlpb_progress_text_color, Color.BLACK);

        mShowArrow = a.getBoolean(R.styleable.CircleProgressBar_mlpb_show_arrow, false);
        mCircleBackgroundEnabled = a.getBoolean(R.styleable.CircleProgressBar_mlpb_enable_circle_background, true);


        mProgress = a.getInt(R.styleable.CircleProgressBar_mlpb_progress, 0);
        mMax = a.getInt(R.styleable.CircleProgressBar_mlpb_max, 100);
        int textVisible = a.getInt(R.styleable.CircleProgressBar_mlpb_progress_text_visibility, 1);
        if (textVisible != 1) {
            mIfDrawText = true;
        }

        mTextPaint = new Paint();
        mTextPaint.setStyle(Paint.Style.FILL);
        mTextPaint.setColor(mTextColor);
        mTextPaint.setTextSize(mTextSize);
        mTextPaint.setAntiAlias(true);
        a.recycle();
        mProgressDrawable = new MaterialProgressDrawable(getContext(), this);
        super.setImageDrawable(mProgressDrawable);
    }

以上都是从styleable XML中获取的一些参数（那如果没有这里设置就是我们代码中一系列的Set，如果都没设置那么就是默认值了）。

//版本判断
 private boolean elevationSupported() {
        return android.os.Build.VERSION.SDK_INT >= 21;
    }

在onMeasure方法中会调用elevationSupported（），对自定义View进行操作，顺便提一下自定义View的绘制。

onMeasure()，onLayout()，onDraw()这三个函数：1.View本身大小多少，这由onMeasure()决定；2.View在ViewGroup中的位置如何，这由onLayout()决定；3.绘制View，onDraw()定义了如何绘制这个View。

在onLayout()里有一大堆对位置的计算的内容就不贴了，知道他干什么就行。

在我们的onDraw中绘制进度部分

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (mIfDrawText) {
            String text = String.format("%s%%", mProgress);
            int x = getWidth() / 2 - text.length() * mTextSize / 4;
            int y = getHeight() / 2 + mTextSize / 4;
            canvas.drawText(text, x, y, mTextPaint);
        }
    }

然后就是一堆传参的方法了

public void setVisibility(int visibility) //设置是否可见

public void setCircleBackgroundEnabled(boolean enableCircleBackground)//设置是否存在图片背景（默认有）

public boolean circleBackgroundEnabled()//判断是否有背景

public boolean isShowProgressText()//判断是否显示进度文字

public void setShowProgressText(boolean mIfDrawText)//设置是否显示进度文字

public int getMax()//获取进度最大值

public void setMax(int max)//设置进度最大值

public int getProgress()//获取进度

public void setProgress(int progress)//设置进度

---

ListViewExt

我们再说一下ListViewExt

//没有出现什么惊叹的自定义控件正常的继承ListView（废话不然哪只这么点代码）
public class ListViewExt extends ListView

//构造方法里都调用了init方法，设置了监听事件，设置了边缘回弹以及边缘大小
 public ListViewExt(Context context) {
        super(context);
        this.init();
    }

    public ListViewExt(Context context, AttributeSet attrs) {
        super(context, attrs);
        this.init();
    }

    public ListViewExt(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        this.init();
    }

    private void init() {
        this.setOverScrollMode(2);
        this.setFadingEdgeLength(0);
        this.setOnScrollListener(this.mScrollListenerWrapper);
    }

重要的逻辑与判断都在onTouchEvent方法中实现，包括判断是否到底，是否拉伸，是否在最上方等

具体如何做到拉伸，收缩的看同包内的ListViewEnhance .class这个类

   public boolean onTouchEvent(MotionEvent ev) {
        int y = (int)ev.getY();
        switch(ev.getActionMasked()) {
        case 0:
        case 5:
            ListViewEnhance.onTouchDown(this, ev);
            this.mDownMotionY = y - (this.mLastY - this.mDownMotionY);
            this.mLastY = y;
            break;
        case 1:
        case 6:
            this.mLastY = y;
            if(this.mIsTouching) {
                this.mIsTouching = false;
            }
            break;
        case 2:
            int offset = y - this.mDownMotionY;
            if(!this.mIsTouching) {
                ListViewEnhance.onTouchDown(this, ev);
            }

            this.mInertia = y - this.mDownMotionY;
            if(ListViewEnhance.needListScale(this, offset)) {
                this.mLastY = y;
                return true;
            }

            if(this.mScrollState == 1 && y != this.mLastY) {
                this.mLastY = y;
            }
            break;
        case 3:
            if(this.mIsTouching) {
                this.mIsTouching = false;
                ListViewEnhance.resetScale(this);
            }
        case 4:
        }

        return super.onTouchEvent(ev);
    }

---

具体使用实例，可以看源码，源码地址：https://github.com/ddwhan0123/SoyiGit

观众老爷欢迎点个赞，谢谢！