Android draw a half circle with borders-ThrowExceptions

Exception or error:

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

How to solve:

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>

###

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:

enter image description here

Leave a Reply

Your email address will not be published. Required fields are marked *