Search code examples
androidandroid-tabhost

Drawing number badge like iPhone in Android


a busy cat

I want to draw the number badge as shown in the above image on the Chats tab. That number badge shows number of new unread messages in chat. So how can I draw this kind of custom number badge. Is there any inbuilt API in Android SDK? Thanks in advance.


Solution

  • Look at my answer here for widgets/app.

    You can use shapecount.xml

    res/layout/tabicon.xml

    <RelativeLayout
        android:orientation="vertical"
        android:background="@null"
        android:id="@+id/rlayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
        <ImageView 
                android:id="@+id/icon"
                android:src="@android:drawable/ic_menu_mylocation" <!-- Just for test -->
                android:layout_margin="0dp"
                android:layout_height="wrap_content" 
                android:layout_width="wrap_content"/>
    
        <TextView android:layout_width="wrap_content" android:layout_height="wrap_content"
            android:text="50" android:textSize="12dp" android:textStyle="bold"  
            android:background="@drawable/shapecount"
            android:textColor="#FFFFFF"
            android:paddingLeft="3dp" android:paddingRight="3dp"
                android:layout_margin="0dp"
            android:layout_alignBottom="@+id/rlayout"
            android:id="@+id/txtCount" />
    
    </RelativeLayout>
    

    When creating your tab:

    LayoutInflater inflater = LayoutInflater.from(this);
    View view = inflater.inflate(R.layout.tabicon, null);
    final TextView txtCount = (TextView) view.findViewById(R.id.txtCount);
    
    spec = tabHost.newTabSpec("artists").setIndicator(view).setContent(intent);
    

    Now you can use txtCount to update the number in the tab's icon. See the post I pointed out above for an example of TimerTask to test this.

    You will have to arrange the layout as you wish also