Android SwipeRefreshLayout实现工作原理.

首先这个工具类是由V4包提供的,翻看里面的源码发现,原来这个工具视图[主要探讨视图]是通过自己创建了一个圆形VIew,并在圆形View里面添加了一个旋转的进度Drawable,当然旋转的并不是一个控件,仅仅是一个资源.并通过圆形View去设置了该Drawable,并将圆形图片添加到了SwieRefresh控件上.具体源码如下,通过该源码你可以找到MaterialProgressDrawable,自己手动实现一些进度,大致看了一下算法,还不错,如果你想依赖原生的,你就可以自己创建一个控件去设置这个背景.

mCircleView = new CircleImageView(getContext(), CIRCLE_BG_LIGHT, CIRCLE_DIAMETER/2);        mProgress = new MaterialProgressDrawable(getContext(), this);        mProgress.setBackgroundColor(CIRCLE_BG_LIGHT);        mCircleView.setImageDrawable(mProgress);//设置圆形进度资源        mCircleView.setVisibility(View.GONE);        addView(mCircleView);

然后MaterialProgressDrawable提供一些方便的api,

<pre name="code" class="java">setAlpha(float); // 设置渐变showArrow(boolean);// 设置箭头setStartEndTrim(float,float); // 开始和结束的长度这里默认是0.8f,参考源码:mProgress.setStartEndTrim(0f, Math.min(MAX_PROGRESS_ANGLE, strokeStart));setArrowScale(float); //缩放箭头

/*关键的旋转代码*/

<pre name="code" class="java">float rotation = (-0.25f + .4f * adjustedPercent + tensionPercent * 2) * .5f; // ACTION_MOVE的时候计算的一个旋转值,然后给该设置,当然你也可以自己定义.mProgress.setProgressRotation(rotation);// 设置旋转值.mProgress.start();//开始旋转mProgress.stop(); // 结束旋转.

下面是MaterialProcessDrawable部分算法源码:

// The minProgressArc is calculated from 0 to create an                    // angle that                    // matches the stroke width.                    final float minProgressArc = (float) Math.toRadians(                            ring.getStrokeWidth() / (2 * Math.PI * ring.getCenterRadius()));                    final float startingEndTrim = ring.getStartingEndTrim();                    final float startingTrim = ring.getStartingStartTrim();                    final float startingRotation = ring.getStartingRotation();                    // Offset the minProgressArc to where the endTrim is                    // located.                    final float minArc = MAX_PROGRESS_ARC - minProgressArc;                    final float endTrim = startingEndTrim + (minArc                            * START_CURVE_INTERPOLATOR.getInterpolation(interpolatedTime));                    ring.setEndTrim(endTrim);                    final float startTrim = startingTrim + (MAX_PROGRESS_ARC                            * END_CURVE_INTERPOLATOR.getInterpolation(interpolatedTime));                    ring.setStartTrim(startTrim);                    final float rotation = startingRotation + (0.25f * interpolatedTime);                    ring.setRotation(rotation);                    float groupRotation = ((720.0f / NUM_POINTS) * interpolatedTime)                            + (720.0f * (mRotationCount / NUM_POINTS));                    setRotation(groupRotation);//设置旋转值

/**  *画箭头  *  */private void drawTriangle(Canvas c, float startAngle, float sweepAngle, Rect bounds) {            if (mShowArrow) {                if (mArrow == null) {                    mArrow = new android.graphics.Path();                    mArrow.setFillType(android.graphics.Path.FillType.EVEN_ODD);                } else {                    mArrow.reset();                }                // Adjust the position of the triangle so that it is inset as                // much as the arc, but also centered on the arc.                float inset = (int) mStrokeInset / 2 * mArrowScale;                float x = (float) (mRingCenterRadius * Math.cos(0) + bounds.exactCenterX());                float y = (float) (mRingCenterRadius * Math.sin(0) + bounds.exactCenterY());                // Update the path each time. This works around an issue in SKIA                // where concatenating a rotation matrix to a scale matrix                // ignored a starting negative rotation. This appears to have                // been fixed as of API 21.                mArrow.moveTo(0, 0);                mArrow.lineTo(mArrowWidth * mArrowScale, 0);                mArrow.lineTo((mArrowWidth * mArrowScale / 2), (mArrowHeight                        * mArrowScale));                mArrow.offset(x - inset, y);                mArrow.close();                // draw a triangle                mArrowPaint.setColor(mColors[mColorIndex]);                c.rotate(startAngle + sweepAngle - ARROW_OFFSET_ANGLE, bounds.exactCenterX(),                        bounds.exactCenterY());                c.drawPath(mArrow, mArrowPaint);            }        }

这儿主要是画进度:

/**         * Draw the progress spinner         */        public void draw(Canvas c, Rect bounds) {            final RectF arcBounds = mTempBounds;            arcBounds.set(bounds);            arcBounds.inset(mStrokeInset, mStrokeInset);            final float startAngle = (mStartTrim + mRotation) * 360;            final float endAngle = (mEndTrim + mRotation) * 360;            float sweepAngle = endAngle - startAngle;            mPaint.setColor(mColors[mColorIndex]);            c.drawArc(arcBounds, startAngle, sweepAngle, false, mPaint);            drawTriangle(c, startAngle, sweepAngle, bounds);            if (mAlpha < 255) {                mCirclePaint.setColor(mBackgroundColor);                mCirclePaint.setAlpha(255 - mAlpha);                c.drawCircle(bounds.exactCenterX(), bounds.exactCenterY(), bounds.width() / 2,                        mCirclePaint);            }        }

 下面是我自己定义的CircleView,算法如下.:

mRefreshStart += mIsStart ? 3 : 10;//计算距离        mRefreshStop += mIsStart ? 10 : 3;        mRefreshStart = mRefreshStart % 360;//还原位置        mRefreshStop = mRefreshStop % 360;        int swipe = mRefreshStop - mRefreshStart;        swipe = swipe < 0 ? swipe + 360 : swipe; //计算扫过的角度.        canvas.drawArc(rectF,                mRefreshStart, swipe, false, mOutPaint);//画圆弧.        if (swipe >= 330) {//恢复加速            mIsStart = false;        } else if (swipe <= 10) {//开始加速            mIsStart = true;        }

GitHub地址:https://github.com/q422013/CircleView