CODEWITHSUNDEEP
androidandroid-animationandroid-progressbarandroid-assets
ihsanhf
ihsanhf

Reputation: 440

Circular progressbar

I want to create a circular progressbar, like in this image below

Circle Progress Bar

I don't know what the method that creates this progressbar is. And I don't know what assets should be prepared.

Upvotes: 7

Views: 14063

Answers (5)

Mani
Mani

Reputation: 3467

try this method to draw a bitmap and set it to image view. use it in a dialog to create a circular progress dialog.

private void circularImageBar(ImageView iv2, int i) {


    Bitmap b = Bitmap.createBitmap(300, 300,Bitmap.Config.ARGB_8888);
    Canvas canvas = new Canvas(b); 
    Paint paint = new Paint();

        paint.setColor(Color.parseColor("#c4c4c4"));
        paint.setStrokeWidth(10);
        paint.setStyle(Paint.Style.STROKE);
        canvas.drawCircle(150, 150, 140, paint);

        paint.setColor(Color.parseColor("#FFDB4C"));
        paint.setStrokeWidth(10);   
        paint.setStyle(Paint.Style.FILL);
        final RectF oval = new RectF();
        paint.setStyle(Paint.Style.STROKE);
        oval.set(10,10,290,290);

        canvas.drawArc(oval, 270, ((i*360)/100), false, paint);
        paint.setStrokeWidth(0);    
        paint.setTextAlign(Align.CENTER);
        paint.setColor(Color.parseColor("#8E8E93")); 
        paint.setTextSize(140);

        canvas.drawText(""+i, 150, 150+(paint.getTextSize()/3), paint); 

        iv2.setImageBitmap(b);
}

Upvotes: 1

Sripathi
Sripathi

Reputation: 1780

Try the following link.. I will be helpful for you.. We need to customize the views to create a new one.. Instead of customizing our own view we can add library projects and and use the views..

Follow this for library project,

http://www.androidviews.net/2013/03/holo-circular-progressbar/

http://www.androidviews.net/2013/02/circular-seekbar/

And this for customizing our own view,

http://www.vogella.com/articles/AndroidCustomViews/article.html

Upvotes: 1

bbarm
bbarm

Reputation: 113

I think you can use an ArcView Link.

It will help you.

Upvotes: 1

itsrajesh4uguys
itsrajesh4uguys

Reputation: 4638

Have a look at this sample you will be having nice sample here:

Todd-Davies | ProgressWheel

It will be look like following images.

Sample 1 Sample 2 Sample 3 Sample 4

Hope this will help you.

Upvotes: 14

Shailendra Singh Rajawat
Shailendra Singh Rajawat

Reputation: 8242

you can do this by creating a custom view . about assets i guess all you need is some color codes . create a class extends View . add method setProgress(int) . in OnDraw() draw one filled circle . and one arc from 0 to _progress . drawText progress at center . you can find sample code easily . search for it .

Upvotes: 0

Related Questions