Android端实现图标带提示数字功能

import android.content.Context;import android.graphics.Bitmap;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Paint;import android.graphics.Typeface;import android.util.AttributeSet;import android.view.View;public class IconNmuberView extends View {Bitmap bitmap;String number="0";@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);int x=getWidth()/2;int y=getHeight()/2;Paint paint=new Paint();//在画布上画上图标作为背景，不需动态加载的话可以省略这部if(bitmap!=null){canvas.drawBitmap(bitmap,null, paint);}//数字为0直接返回if(number.equals("0")){return;}//设置画笔为红色paint.setColor(Color.RED);//计算小圆形的圆心图标，半径取大图标半径的四分之一canvas.drawCircle((float)(x+Math.sqrt(x*x/2)),(float)(x-Math.sqrt(x*x/2)),(float)(x/4), paint);paint.setColor(Color.WHITE);//为适应各种屏幕分辨率，字体大小取半径的3.5分之一，具体根据项目需要调节paint.setTextSize((float)(x/3.5));//去除锯齿效果paint.setFlags(Paint.ANTI_ALIAS_FLAG);paint.setAntiAlias(true);//字体加粗paint.setTypeface(Typeface.defaultFromStyle(Typeface.BOLD));//字体位置设置为以圆心为中心paint.setTextAlign(Paint.Align.CENTER);canvas.drawText(number,(float)(x+Math.sqrt(x*x/2)),(float)(x-Math.sqrt(x*x/2))+x/9, paint);}//设置图标public void setIcon(Bitmap bitmap){this.bitmap=bitmap;}//设置数字public void setNumber(String number){this.number=number;}public IconNmuberView(Context context, AttributeSet attrs) {super(context, attrs);}}

使用好多APP的时候经常可以看到如图所示的可以在图标的右上角显示数字的图标，这种设计可以很明显的提示用户收到了哪些消息和信息，IOS端有自带的这种控件可以使用，但Android端还没有这种设计，因为项目的需要，自己做了一个自定义控件，专门处理类似于这样的问题。

原理是在一块画布上面画上背景图标，然后确定所画圆形的圆心位置，之后在上面画数字即可。

创建自定义控件IconNmuberView.java

完成后显示效果

更多相关文章

随机推荐