可以显示文字的圆形ImageView(头像)

一般常见的应用场景是用来显示用户的头像,如通讯录

可以显示文字的圆形ImageView(头像)_第1张图片
效果图.jpg
/**
 * Author: Alex.ylj
 * 2019-06-13 17:14 Thursday
 * Description: 具有显示文字功能的圆形ImageView
 */
public class CharCircleView extends AppCompatImageView {

    //定义背景、文字画笔
    private Paint mBackgroundPaint;
    private Paint mTextPaint;
    private Rect mRect;

    //文字、画笔颜色
    private String mText;
    private int mBackgroundColor;
    private int mTextColor;
    private int mTextSize;

    public CharCircleView(Context context) {
        this(context, null);
    }

    public CharCircleView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public CharCircleView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        //初始化颜色
        mBackgroundColor = Color.parseColor("#E7CE86");
        mTextColor = Color.parseColor("#FFFFFF");
        mTextSize = DensityUtils.dp2px(getContext(), 18);

        //初始化画笔
        mBackgroundPaint = new Paint();
        mTextPaint = new Paint();
        mRect = new Rect();

        //设置画笔
        mBackgroundPaint.setColor(mBackgroundColor);
        mBackgroundPaint.setAntiAlias(true);//抗锯齿
        mTextPaint.setColor(mTextColor);
        mTextPaint.setAntiAlias(true);//抗锯齿
        mTextPaint.setTextSize(mTextSize);
        mTextPaint.setFakeBoldText(true);//加粗
        mTextPaint.setTextAlign(Paint.Align.CENTER);//文字居中
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        //不做任何处理
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        //不做任何处理
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (!TextUtils.isEmpty(mText)) {
            //开始绘制
            canvas.drawCircle(getWidth() / 2f, getWidth() / 2f, getWidth() / 2f, mBackgroundPaint);
            mTextPaint.getTextBounds(mText, 0, 1, mRect);
            Paint.FontMetricsInt fontMetricsInt = mTextPaint.getFontMetricsInt();
            int y = (getMeasuredHeight() - fontMetricsInt.top - fontMetricsInt.bottom) / 2;
            canvas.drawText(mText, getWidth() / 2f, y, mTextPaint);
        }
    }

    public void setText(String text) {
        if (TextUtils.isEmpty(text)) {
            mText = "";
        }
        //取出第一个字符,并且转大写
        char[] chars = text.toCharArray();
        mText = String.valueOf(chars[0]).toUpperCase();
        invalidate();
    }

    public void setBackground(int color) {
        mBackgroundColor = color;
        invalidate();
    }

    public void setTextColor(int color) {
        mTextColor = color;
        invalidate();
    }

    public void setTextSize(int textSize) {
        mTextSize = textSize;
        invalidate();
    }
}

使用

CharCircleView charCircleView = findViewById(R.id.char_circle_view);
charCircleView.setText("叶某某");
charCircleView.setText("Alex.xxx");
String imageUrl = "http://b-ssl.duitang.com/uploads/item/201608/21/20160821230024_MyCYK.thumb.700_0.jpeg";
Glide.with(context).load(imageUrl).into(charCircleView);

你可能感兴趣的:(可以显示文字的圆形ImageView(头像))