Android draw a half circle with borders

Question

I wanted to know if there is possible to draw a circle that has half of it filled, something like below:

enter image description here

if possible, later on I would like to fill this cirlce or make it empty with just borders left, which is fine but is there anyway to add animation to it? like from an empty circle to half filled or fully filled circle to happen with a transition?

thanks in advance

yes it is possible, I'm kinda busy so can't write you a full answer. But you'll have to build a custom `Drawable` @Override the `draw(Canvas)` method, call methods on the `canvas` object to make the circle and call `invalidateSelf()` whenever you want to re-draw (due to animation). Good luck. — Budius, Sep 02 '14 at 09:43
You might check [this answer](http://stackoverflow.com/questions/24858531/filling-a-circle-gradually-from-bottom-to-top-android/24866667#24866667). You'll have to adjust the math to rotate the circle 90°. Also, if this is only for API 19 and above, it's even simpler using `Path#op()` methods. — Mike M., Sep 02 '14 at 09:45
@Budius thanks mate, pointing me to the right direction would be enough, I'll look into that. — arash moeen, Sep 02 '14 at 09:47
@Indiandroid basically I want to use this for rating, so it changes on user intercation so I assume gif is not gonna work, but thanks anyway — arash moeen, Sep 02 '14 at 09:48
@MikeM. That seems to be what I want, I'll look into it and will update ya, thanks mate — arash moeen, Sep 02 '14 at 09:49

score 0 · Answer 1 · answered Sep 02 '14 at 09:46

try to assign a customized background to it, like:

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >

    <gradient
        android:angle="0"
        android:endColor="#FF000000"
        android:startColor="#00000000" />

</shape>

score 0 · Answer 2 · edited May 23 '17 at 12:30

Answer by sample code:

Also checkout this answer: https://stackoverflow.com/a/22568222/1052261

public class CircleView extends View {

    public CircleView(final Context context, final AttributeSet attrs) {
        super(context, attrs);
        _paint = new Paint();
        _paint.setColor(context.getResources().getColor(R.color.colorPrimary));
        _paint.setAntiAlias(true);

        _paintCenter = new Paint();

        _paintCenter.setColor(Color.BLUE);
        _paintCenter.setAntiAlias(true);

        _timeRingSize = Utils.convertDpToPixel(context, 10);
    }

    @Override
    protected void onDraw(final Canvas canvas) {
        final float height = canvas.getHeight();
        final float width = canvas.getWidth();

        float radious = width > height ? height * 0.5F : width * 0.5F;

        final float centerX = canvas.getWidth() * 0.5F;
        final float centerY = canvas.getHeight() * 0.5F;

        canvas.drawCircle(centerX, centerY, radious, _paint);

        RectF rectF = new RectF();
        rectF.set(centerX - radious, centerY - radious, centerX + radious, centerY + radious);

        canvas.drawArc(rectF, 0, 90, true, _paintCenter);
    }

    private final float _timeRingSize;
    private Paint _paintCenter;
    private Paint _paint;
}

Output:

Android draw a half circle with borders

2 Answers2