Android Custom Control series application-Circular progress bar

I. Overview

In the previous blog post, we introduced the basics of the Android custom control family. Links: http://blog.csdn.net/qq_24908939/article/details/44589669

In this blog post, we will implement the circular progress bar by rewriting the OnDraw () method and the custom properties on the basis of the basic article, and the effect:

Ii. Steps of implementation

1. Writing Custom Components Mycircleprogress extended View

 Public class extends View {...    }

2. In the Mycircleprogress class, custom attributes

     Public intprogress = 0;//Progress actual value, current progress    /*** Custom control properties to flexibly set the size, color, type, etc. of the circular progress bar*/    Private intMR;//Circle radius, determines the circle size    Private intBgColor;//the background color of a circle or arc    Private intFgcolor;//The foreground color of a circle or arc, which is the color when drawn    Private intDrawStyle;//Draw Type fill circle progress bar, stroke draw arc progress bar            Private intStrokewidth;//the width of the arc in which the stroke is drawn    Private intMax//maximum value, setting the maximum value for progress  /*** Set Progress, this is a thread-safe control, due to the problem of multi-line, need to synchronize*/       Public synchronized voidSetprogress (intprogress) {        if(progress<0) {Progress=0; }Else if(progress>max) {Progress=Max; }Else{             This. Progress =progress; }            }     Public intGetmax () {returnMax }

3. Write Attrs.xml resources for custom attributes, which are placed in the Res/values directory with the following contents:

<?XML version= "1.0" encoding= "Utf-8"?><Resources>    <declare-styleablename= "Circleprogressbar">        <attrname= "BgColor"format= "Color"/>        <attrname= "Fgcolor"format= "Color"/>        <attrname= "R"format= "integer"/>        <attrname= "Strokewidth"format= "integer"/>        <attrname= "DrawStyle">            <enumname= "STROKE"value= "0"></enum>            <enumname= "FILL"value= "1"></enum>        </attr>        <attrname= "Max"format= "integer"/>    </declare-styleable></Resources>

4. Define constructors in the Mycircleprogress class, initialize properties

    Private voidInitproperty (AttributeSet attrs) {TypedArray Tarray=context.obtainstyledattributes (Attrs, R.styleable.circleprogressbar); MR=tarray.getinteger (r.styleable.circleprogressbar_r,10); BgColor=Tarray.getcolor (R.styleable.circleprogressbar_bgcolor, Color.gray); Fgcolor=Tarray.getcolor (R.styleable.circleprogressbar_fgcolor, color.red); DrawStyle=tarray.getint (R.styleable.circleprogressbar_drawstyle, 0); Strokewidth=tarray.getinteger (R.styleable.circleprogressbar_strokewidth, 10); Max=tarray.getinteger (R.styleable.circleprogressbar_max, 100); }     Publicmycircleprogress (Context context, AttributeSet attrs) {Super(context, attrs);  This. Context =context;  This. Paint =NewPaint ();  This. Paint.setantialias (true);//Anti- aliasing         This. Paint.setstyle (Style.stroke);//draw a hollow circle or hollow rectangleInitproperty (attrs); }

5. Add the Mycircleprogress component to the layout file in Mainactivity, as shown below

<Relativelayoutxmlns:android= "Http://schemas.android.com/apk/res/android"Xmlns:tools= "Http://schemas.android.com/tools"Xmlns:app= "Http://schemas.android.com/apk/res/com.jereh.mydrawcircleprogress"Android:layout_width= "Match_parent"Android:layout_height= "Match_parent"Android:paddingbottom= "@dimen/activity_vertical_margin"Android:paddingleft= "@dimen/activity_horizontal_margin"Android:paddingright= "@dimen/activity_horizontal_margin"Android:paddingtop= "@dimen/activity_vertical_margin"Tools:context=". Mainactivity "     >    <com.jereh.views.MyCircleProgressAndroid:id= "@+id/mycircleprogress"Android:layout_width= "Wrap_content"Android:layout_height= "Wrap_content"App:r= "$"App:strokewidth= "Ten"App:bgcolor= "#cccccc"App:fgcolor= "#ff0000"App:drawstyle= "FILL"App:max= " the"        /></Relativelayout>

6. Override the OnDraw method in the custom component mycircleprogress:

    protected  voidOnDraw (canvas canvas) {Super. OnDraw (canvas); intCenter = getwidth ()/2;//Center Position         This. Paint.setcolor (BgColor);  This. Paint.setstrokewidth (Strokewidth); Canvas.drawcircle (center, center, MR, This. Paint); //Draw a circle         This. Paint.setcolor (Fgcolor); if(drawstyle==0){             This. Paint.setstyle (Style.stroke); Opt=false; }Else{             This. Paint.setstyle (Style.fill); Opt=true; }        inttop = (center-MR); intBottom = (center +MR); RECTF Oval=NewRECTF (top, top, bottom, bottom); Canvas.drawarc (Oval,360*progress/,Max, opt, paint); } 

7, Write Mainactivity

 Public classMainactivityextendsActivity {Privatemycircleprogress Progressview; @Overrideprotected voidonCreate (Bundle savedinstancestate) {Super. OnCreate (savedinstancestate);        Setcontentview (R.layout.activity_main); Progressview=(mycircleprogress) Findviewbyid (r.id.mycircleprogress); Newprogressanimation (). Execute (); }    classProgressanimationextendsAsynctask<void, Integer, void>{@Overrideprotectedvoid Doinbackground (void ... params) {//constant changes in progress values             for(inti = 0; I < Progressview.getmax (); i++) {                Try{publishprogress (i); Thread.Sleep (100); } Catch(interruptedexception e) {e.printstacktrace (); }            }            return NULL; } @Overrideprotected voidonprogressupdate (Integer ... values) {//Update Progress ValuesProgressview.setprogress (values[0]);            Progressview.invalidate (); Super. Onprogressupdate (values); }    }}

Android Custom Control series application-Circular progress bar