Draw circle which is filled horizontally in Android

10
votes

To draw circles and pie charts in Android, we can use the AChartEngine Android framework as shown here.

However, how can we draw circles that is partly filled horizontally (or vertically) in Android? I mean circles which are filled, for example, from the bottom to the top according to the percentage specified in Java code.

Here is a preview of what we need:

Preview

2
androidcanvasdrawachartenginepie-chart
I've an example of one way to do that in my answer here. Actually, two ways, if you check the revision history for the initial post. My initial answer, however, only works in API 19 and above. – Mike M.
Your answer is better and so simple (one utility class). Thank you @MikeM. – Omar

2 Answers

7
votes

Try this lib Circle Progress.
Here is a sample from lib's author:

<com.github.lzyzsd.circleprogress.CircleProgress
    android:id="@+id/circle_progress"
    android:layout_marginLeft="50dp"
    android:layout_width="100dp"
    android:layout_height="100dp"
    custom:circle_progress="20"/>

circle

0
votes

Extend Drawable and let your draw method look like this:

public void draw(Canvas c) {
    float size = ...; // The size of your circle
    Paint color = new Paint();
    color.setColor(...); // Color of your circle
    c.drawCircle(size / 2, size / 2, size / 2, color);
    Path p = new Path();
    float ratio = ...; // How many of the circle you want to have filled
    float offset = size * (float) Math.sqrt(1-((double) (0.5-ratio) * 2)*((double) (0.5-ratio) * 2)) / 2;
    float angle = (float) Math.asin((double) (0.5-ratio) * 2);
    p.addArc(offset, size * (1-percent), size - offset, size, angle, Math.PI - angle);
    p.close();
    c.drawPath(p, color);
}