java - Unread Notifications/Messages counter within the app (in tabs) android -


i want achieve similar following image: enter image description here

problem: how can achieve red coloured, unread counter? going design psd , reuse in app? have duplicate alot of .png's each number (let's limit 99 that). redundancy.

what best practice achieve effect ?

you create custom view , override ondraw() method draw numbers. want have icon prepared above except number missing in red circle. then, in custom view, first draw icon , draw number (you have work little figure our precise position in pixels draw it, , how draw it, i.e. text-size, font, color).

modulo method getsomebitmapfromresources() imports bitmap resources (see e.g. here), custom view this:

public class myview extends view {      //fields:      private paint paint; //need paint object colors, fonts, etc.     private rectf rect;     private int numbertopaint;      //constructors:      public myview(context context, attributeset attrs) {         super(context, attrs);         paint = new paint();          //choose text properties work here:         paint.setcolor(color.white);         paint.settypeface(typeface.create("sans-serif", typeface.bold));         paint.settextsize(12);     }      public myview(context context) {         this(context, null);     }      //most importantly: override ondraw rendering of view:      @override     protected void ondraw(canvas canvas) {         rect.set(0, 0, getwidth(), getheight()); //but: make sure view              //will have same size of bitmap use! set size in xml!          canvas.drawbitmap(getsomebitmapfromresources(), null, rect, paint);          //here have choose position of text.         //also consider depending on numbertopaint x-coordinate may have         //be modified. want use paint.gettextbounds method determine size.         canvas.drawtext("" + numbertopaint, 60, 30, paint);     }      public void choosenumberanddraw(int n) {         numbertopaint = n;         postinvalidate(); //force redraw     }  } 

in xml, want add custom view using tag like

<com.mysite.myproject.myview     android:layout_width="64dp"     android:layout_height="64dp" /> 

of course replacing width , height actual bitmap dimensions.


Comments