canvas教程

MaterialDesign学习之ProgreesBar(2)

字号+ 作者:H5之家 来源:H5之家 2016-02-11 16:00 我要评论( )

如果圆的radius有大小则根据尺寸来绘画没有就根据空间大小来设定大小(一开始肯定是0,然后慢慢自增,也就是我们那个灰色圈渐渐变大的效果) 当增长到一定程度了,就开始绘画空心圆部分的操作,空心圆也是渐渐掏空

如果圆的radius有大小则根据尺寸来绘画没有就根据空间大小来设定大小(一开始肯定是0,然后慢慢自增,也就是我们那个灰色圈渐渐变大的效果)
当增长到一定程度了,就开始绘画空心圆部分的操作,空心圆也是渐渐掏空,直至完全达到控件实体的大小动画才停止。整个变化过彻骨结束之后把判断是否为第一次的firstAnimationOver状态改变

整个过程invalidate();使得逻辑不断执行。

int arcD = 1; int arcO = 0; float rotateAngle = 0; int limite = 0; /** * Draw second animation of view * @param canvas */ (Canvas canvas){ if(arcO == limite) arcD+=6; if(arcD >= 290 || arcO > limite){ arcO+=6; arcD-=6; } if(arcO > limite + 290){ limite = arcO; arcO = limite; arcD = 1; } rotateAngle += 4; canvas.rotate(rotateAngle,getWidth()/2, getHeight()/2); Bitmap bitmap = Bitmap.createBitmap(canvas.getWidth(), canvas.getHeight(), Bitmap.Config.ARGB_8888); Canvas temp = new Canvas(bitmap); Paint paint = new Paint(); paint.setAntiAlias(true); paint.setColor(backgroundColor); // temp.drawARGB(0, 0, 0, 255); temp.drawArc(new RectF(0, 0, getWidth(), getHeight()), arcO, arcD, true, paint); Paint transparentPaint = new Paint(); transparentPaint.setAntiAlias(true); transparentPaint.setColor(getResources().getColor(android.R.color.transparent)); transparentPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR)); temp.drawCircle(getWidth()/2, getHeight()/2, (getWidth()/2)- Utils.dpToPx(4, getResources()), transparentPaint); canvas.drawBitmap(bitmap, 0, 0, new Paint()); }

131-160,非第一次绘制时的实现,这边我来解释下重要部分的逻辑。

if(arcO == limite) arcD+=6; if(arcD >= 290 || arcO > limite){ arcO+=6; arcD-=6; } if(arcO > limite + 290){ limite = arcO; arcO = limite; arcD = 1; }

大圆弧最大值为290,满了就收缩,到底到头了都增长,用2个变量做差值反向计算,290为边界值

canvas.rotate(rotateAngle,getWidth()/2, getHeight()/2);

旋转操作,每一次角度自增4

分析:

就是第一次进去画一个从圆心缩放的效果,然后之后都是走290圆弧增大缩小的无限循环计算绘画,计算这部分逻辑还是有点搞脑子的,大家可以仔细思考思考。

源码:https://github.com/ddwhan0123/BlogSample/blob/master/MaterialDesignProgress.zip

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Canvas与ValueAnimator

    Canvas与ValueAnimator

    2017-04-28 18:00

  • 21天学习android开发教程之SurfaceView与多线程的混搭

    21天学习android开发教程之SurfaceView与多线程的混搭

    2017-04-27 12:00

  • PolygonDrawingUtil

    PolygonDrawingUtil

    2017-04-26 18:02

  • Android开发基本常识及技巧

    Android开发基本常识及技巧

    2017-04-13 16:02

网友点评
l