Android 画圆弧canvas.drawArc() 详解

阳光穿透心脏的1/2处 2021-09-12 06:46 1270阅读 0赞

public void drawArc(@NonNull RectF oval, float startAngle, float sweepAngle, boolean useCenter,
                @NonNull Paint paint) {
            drawArc(oval.left, oval.top, oval.right, oval.bottom, startAngle, sweepAngle, useCenter,
                    paint);
        }

要实现这个方法，我们要传5个参数进去。

# 第一个参数：RectF oval #

oval 参数的作用是：定义的圆弧的形状和大小的范围

/**
    * 这是一个居中的圆
    */
            float x = (getWidth() - getHeight() / 2) / 2;
            float y = getHeight() / 4;
    
            RectF oval = new RectF( x, y,
                    getWidth() - x, getHeight() - y);

![oval 参数的作用是：定义的圆弧的形状和大小的范围][oval]

# 第二个参数：float startAngle #

这个参数的作用是设置圆弧是从哪个角度来顺时针绘画的

canvas.drawArc(oval,-90,120,false,mPaint);

![\-90][-90]

canvas.drawArc(oval,90,110,false,mPaint);

![90][]

//设置为-180的时候也是这样
    canvas.drawArc(oval,180,140,false,mPaint);

![180][]

//设置为360的时候也是这样
    canvas.drawArc(oval,0,140,false,mPaint);

*  ![140][]

##  ##

# 第三个参数：float sweepAngle #

这个参数的作用是设置圆弧扫过的角度 ，我们从上面的代码就可以知道其中的作用了。

**第四个参数：boolean useCenter**

这个参数的作用是设置我们的圆弧在绘画的时候，是否经过圆形

值得注意的是，这个参数在我们的 mPaint.setStyle(Paint.Style.STROKE); 设置为描边属性的时候，是看不出效果的。

/**
            *这里我是偷懒了，建议不要在onDraw()方法里初始化对象
            */
            Paint p = new Paint();//这个是画矩形的画笔，方便大家理解这个圆弧
            p.setStyle(Paint.Style.STROKE);
            p.setColor(Color.RED);
    
            mPaint.setAntiAlias(true);//取消锯齿
            mPaint.setStyle(Paint.Style.FILL);//设置画圆弧的画笔的属性为描边(空心)，个人喜欢叫它描边，叫空心有点会引起歧义
            mPaint.setStrokeWidth(mCircleWidth);
            mPaint.setColor(Color.CYAN);
    
            /**
             * 这是一个居中的圆
             */
            float x = (getWidth() - getHeight() / 2) / 2;
            float y = getHeight() / 4;
    
            RectF oval = new RectF( x, y,
                    getWidth() - x, getHeight() - y);
    
            canvas.drawArc(oval,360,140,false,mPaint);//画圆弧，这个时候，绘制没有经过圆心
            canvas.drawRect(oval, p);//画矩形

![false][]

//当我们设置为true的时候，绘制的时候就经过圆心了
    canvas.drawArc(oval,360,140,true,mPaint);

![true][]

**第五个参数：Paint paint**

这个参数的作用是设置我们的画笔对象的属性

mPaint.setAntiAlias(true);//取消锯齿
            mPaint.setStyle(Paint.Style.FILL);//设置画圆弧的画笔的属性为描边(空心)，个人喜欢叫它描边，叫空心有点会引起歧义
            mPaint.setStrokeWidth(mCircleWidth);
            mPaint.setColor(Color.CYAN);

这里还是要强调一下，当 p.setStyle(Paint.Style.STROKE)的时候，我们的第四个参数boolean useCenter，是看不到效果的。

下面是代码全文

public class CustomProgress extends View{
    
        private Paint mPaint;
    
        /**
         * 圆的宽度
         */
        private int mCircleWidth = 3;
    
        public CustomProgress(Context context) {
            this(context, null);
        }
    
        public CustomProgress(Context context, AttributeSet attrs) {
            this(context, attrs, 0);
        }
    
        public CustomProgress(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
            mPaint = new Paint();
        }
    
        @Override
        protected void onDraw(Canvas canvas) {
            mPaint.setAntiAlias(true);//取消锯齿
            mPaint.setStyle(Paint.Style.FILL);
            mPaint.setStrokeWidth(mCircleWidth);
            mPaint.setColor(Color.CYAN);
    
            /**
             * 这是一个居中的圆
             */
            float x = (getWidth() - getHeight() / 2) / 2;
            float y = getHeight() / 4;
    
            RectF oval = new RectF( x, y,
                    getWidth() - x, getHeight() - y); 
    
            canvas.drawArc(oval,360,140,true,mPaint);
        }
    }

[oval]: /images/20210802/a8d5712d45bc4888b727e2d2a711718f.png
[-90]: /images/20210802/1194576183a741c6aad0f777dd58b16f.png
[90]: /images/20210802/09f778ad1dde4df68bb66d9482d20dc2.png
[180]: /images/20210802/7d66e9c7801b44108e19eaba0b0d37a2.png
[140]: /images/20210802/ebfa7012d74b43828f3ff4fac4959d30.png
[false]: /images/20210802/0226474f25b644738d2e3f0b12547212.png
[true]: /images/20210802/431f01da2011472b9ad43f8a410b985b.png