Display curve shape progress in custom View

Question

I am working with custom view which is in a circle shape. Almost i have done it with creating a custom class and implemented that. But my problem is too show a different progress in a curve shape with different color and which is depends on dynamic data. Here is the image which i have implemented

I want like this https://i.sstatic.net/EckFO.jpg.

So my question is how to draw arc (curve shape) progress with different color and with dynamic data.

Help would be appreciated !!

Answer 1

Finally i have resolved this after making some changes in Custom CircleView class. For that i have counted a sweepAngle and startAngle for each region. Here is some part of code i am posting.

I had to show three different regions so i have taken three different Paints and declared variable for each regions. Like,

private float   absStart;
private float   absSweep;
private float   preStart;
private float   preSweep;
private float   vacStart;
private float   vacSweep;

private Paint   absPaint;
private Paint   prePaint;
private Paint   vacPaint;

Now init your all three regions paints. Here i just posting one of them

absPaint = new Paint();
absPaint.setStrokeCap(Paint.Cap.ROUND);
absPaint.setStyle(Paint.Style.STROKE);
absPaint.setStrokeJoin(Paint.Join.ROUND);
absPaint.setColor(Color.parseColor("#eb537a"));
absPaint.setStrokeWidth((float) 22.5);

Now to calculate the area of each region i had created a method named updateAngles() which have three float parameters

public void updateAngles(float absPercent, float prePercent, float vacPercent) {
    float total = absPercent + prePercent + vacPercent;
    absStart = 0;
    absSweep = (absPercent / total) * 360;
    preStart = absSweep;
    preSweep = (prePercent / total) * 360;
    vacStart = absSweep + preSweep;
    vacSweep = (vacPercent / total) * 360;

    Log.e("Angles are:", absStart + ":" + absSweep + ":" + preStart + ":" + preSweep + ":" + vacStart + ":" + vacSweep);
    invalidate();
}

This method will be called in your desired activity after initialize CircleView and call like cv.updateAngles(20,20,60); where cv is object of CircleView.

Now in onDraw() method you need to draw arc for each region.

 mInnerRectF.set(45, 45, 330, 330);
 canvas.drawArc(mInnerRectF, absStart, absSweep, false, absPaint);
 canvas.drawArc(mInnerRectF, preStart, preSweep, false, prePaint);
 canvas.drawArc(mInnerRectF, vacStart, vacSweep, false, vacPaint);

So this finally giving me a my desired output.

But if there is depend on different devices like mobile screen , 7 inch and 10 inch tablets then you should use DisplayMetrics for it.