Android Custom ProgressBar (inherit from view)

GitHub already has so many beautiful progressbar, but still can not meet the artist mm appetite, but only according to the needs of the artist, customize a meet the requirements of the Progrssbar, the artist gives the following:

Good-looking is good-looking, but also requires the color of the above indicator with the progress to change, the Internet to find a really did not find fully meet the requirements, had to find a way.

Ideas: 1. Definitely inherit view or ProgressBar to rewrite, because I am not familiar with ProgressBar source code, inherit view to start customizing. Inheritance ProgressBar must be easier to implement, should be basic simply rewrite the OnDraw () method.

2. is to rewrite the view of OnDraw (), Onmeasure (), Ondetachedfromwindow (), Ontouchevent () and several other methods.

This is the point of thinking, the following first look at the final effect:

The angle of the corner of the simulator is a bit too garden, when used can be adjusted.

The source code is as follows:

Package Com.example.demo;import Android.content.context;import Android.content.res.resources;import Android.graphics.bitmap;import Android.graphics.bitmapfactory;import Android.graphics.canvas;import Android.graphics.color;import Android.graphics.paint;import Android.graphics.rectf;import Android.util.attributeset;import Android.util.displaymetrics;import Android.view.motionevent;import Android.view.view;import android.view.windowmanager;/** * @author rzq * @function Risk Index Indicator VIEW * */public class Indiactorvi EW extends View {/** * Public part */private static final int MAX = 100;private static final int round_degree = 8;private static Final int[] cursorcolors = new int[] {r.color.color_7ea1de,r.color.color_7aa7d6, R.COLOR.COLOR_73ADCD, R.color.color_ 6cb4c4,r.color.color_66bbba, R.color.color_63c6a8, R.color.color_63cd99,r.color.color_6bce90, R.color.color_ 7DCE8A, r.color.color_96cc84,r.color.color_b2c97d, r.color.color_d3c477, R.color.color_e9be72,r.color.color_ FAB76D, R.color.color_ffae68, R.Color.color_ff9c60,r.color.color_f87653, r.color.color_ff8a5a, r.color.color_f0674e,r.color.color_e85548};p rivate Context mcontext;private Resources res;private Paint mpaint;private displaymetrics dm;/** * Resource */private Bitmap BITM Approgress;private Bitmap bitmapindictor;/** * progress bar width high, coordinate */private float bitmapprogresswidth, bitmapprogressheight; Private float bitmapprogressx, bitmapprogressy;private float bitmapindictorwidth, bitmapindictorheight;/** * Mobile screen width high * * private int ScreenHeight, screenwidth;/** * Indicates the width height of the rectangle */private int rectwidth;private int rectheight;/** * Risk Index content */private int cursorposition = 0;private float precent = 0;private String drawText = "0/100";p ublic Indiactorview (context context, A Ttributeset attrs) {Super (context, attrs); this.mcontext = Context;this.res = Getresources (); Initview ();} private void Initview () {mpaint = new Paint (paint.anti_alias_flag);d m = new Displaymetrics (); WindowManager wm = (WindowManager) mcontext.getsystemservice (context.window_service); wm.getDefaultdisplay (). Getmetrics (DM), screenwidth = Dm.widthpixels;screenheight = Dm.heightpixels;rectwidth = dip2px (47); Rectheight = dip2px (+); bitmapprogress = Bitmapfactory.decoderesource (res,r.drawable.icon_indictor); bitmapIndictor = Bitmapfactory.decoderesource (res, r.drawable.san_jiao); bitmapprogresswidth = Bitmapprogress.getwidth (); Bitmapprogressheight = Bitmapprogress.getheight (); bitmapindictorwidth = Bitmapindictor.getwidth (); Bitmapindictorheight = Bitmapindictor.getheight (); bitmapprogressx = (screenwidth-bitmapprogresswidth)/2; Bitmapprogressy = Rectheight + bitmapindictorheight;}  /** * UPDATE Cursor position * * @param position */public void setposition (int position) {cursorposition = Position;precent = (Position * Bitmapprogresswidth)/Max;drawtext = new StringBuilder (). append (position). Append ("/100"). toString ();/** * Also set the paint color according to position */int offset = position/5;if (offset = =) {offset = offset-1;} Mpaint.setcolor (Res.getcolor (Cursorcolors[offset)); invalidate ();} @Overrideprotected VOID onmeasure (int widthmeasurespec, int heightmeasurespec) {int viewheight = (int) (Bitmapindictorheight + bitmapprogress Height + rectheight); setmeasureddimension ((int) screenwidth, viewheight);} @Overridepublic boolean ontouchevent (Motionevent event) {return super.ontouchevent (event);} @Overrideprotected void OnDraw (canvas canvas) {/** * cursor current x-coordinate */float Cursorx = (cursorposition > 0)? (BITMAPPROGRESSX + PRECENT-BITMAPINDICTORWIDTH/2): (BITMAPPROGRESSX + precent); Canvas.drawbitmap (BitmapProgress, BITMAPPROGRESSX, Bitmapprogressy,null); Canvas.drawbitmap (Bitmapindictor, Cursorx, rectheight, NULL);/** * Boundary judgment, Prevent out-of-screen */if (Cursorx + rectwidth >= screenwidth) {Cursorx = Cursorx-rectwidth + bitmapindictorwidth;} RECTF rect = new RECTF (Cursorx, 0, Cursorx + rectwidth, rectHeight-1); Canvas.drawroundrect (rect, Round_degree, round_deg REE, Mpaint); Mpaint.setcolor (Color.White); Mpaint.settextsize (dip2px (one)); float cursortextx = (Rectwidth- Mpaint.measuretext (DrawText))/2;float CursortExty = ((RECTHEIGHT/2)-((Mpaint.descent () + mpaint.ascent ())/2); Canvas.drawtext (DrawText, Cursorx + cursortextx, cu Rsortexty, mpaint);} /** * Frees up resources and may consume less memory */@Overrideprotected void Ondetachedfromwindow () {mcontext = Null;res = Null;mpaint = NULL;DM = Null;b Itmapindictor = Null;bitmapprogress = null;} /** * from the DP unit according to the resolution of the phone to be px (pixels) */private int dip2px (float dpvalue) {return (int) (Dpvalue * dm.density + 0.5f);}}

View using:

Package Com.example.demo;import Android.app.activity;import Android.os.bundle;import android.os.handler;import Android.os.message;public class Mainactivity extends Activity {private Indiactorview indictorview;private int i = 0;priva  Te Handler Handler = new Handler () {public void Handlemessage (Message msg) {indictorview.setposition (i++); if (I <= 100) {this.sendemptymessagedelayed (0x01, 500);}};}; @Overrideprotected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview ( R.layout.activity_main); Indictorview = (Indiactorview) Findviewbyid (R.id.indictor_view); Indictorview.setposition (i); handler.sendemptymessagedelayed (0x01, 500);}}

Comments are already very detailed, it is not long-winded explanation of the code, the source and how to use the demo will be given at the end.

Extension: Adding touch event handling to the indicator, this ProgressBar can be expanded to a seekbar with an indicator, which is given after subsequent completion. Those who are interested can also expand themselves.

Demo download

Android Custom ProgressBar (inherit from view)