Sharp edge with custom drawable clip path

Question

I am trying to draw a circular drawable which consists of horizontal divisions of different color. But the circular path that i clip from the drawable creates a circle which has broken circumference.

Here is the snippet for onDraw() from Drawable

@Override
public void draw(@NonNull Canvas canvas) {

    // get drawable dimensions
    Rect bounds = getBounds();

    int width = bounds.right - bounds.left;
    int height = bounds.bottom - bounds.top;

    mPath.reset();
    mPath.addCircle(width/2, height/2, width/2, Path.Direction.CW);
    canvas.clipPath(mPath);

    int barHeight = height / themeColors.length;
    mRectF.left = 0;
    mRectF.top = 0;
    mRectF.right = width;
    mRectF.bottom = height;
    //Draw Rect. consisting of multiple rects acc. to height
    for (int i = 0; i < themeColors.length; i++) {
        mPaint.setColor(themeColors[i]);

        canvas.drawRect(0, i*barHeight, width, (i+1)*barHeight , mPaint);
    }

    //Draw stroke border
    if(mStrokeWidth!=0)
        canvas.drawCircle(width/2, height/2, width/2, mStrokePaint);

}

How do i go about developing the drawable such that the edges are smooth ? Can this be done with just xml drawable ?

EDIT: I tried using PorterDuff modes with paint, but they did not work as given.