Android圆形角标

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/shb2058/article/details/90020597

view代码:

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.os.Build;
import android.support.annotation.Nullable;
import android.support.annotation.RequiresApi;
import android.text.TextUtils;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

import com.xlkx.findreagent.R;
import com.xlkx.findreagent.utils.SizeUtil;

public class CircleNumberView extends View {
    //画笔
    Paint paint;
    String number = "99";
    int padding = 10;
    float textSize = 15.0f;
    //view的直径
    float radius;

    //设置现实的数字
    public void setNumber(String number) {
        this.number = number;
    }

    private void initView() {
        if (paint == null) {
            paint = new Paint();
            paint.setTextSize(SizeUtil.sp2px(getContext(), textSize));
            //如果需要透明度,透明度应该加在前两位
            paint.setColor(Color.parseColor("#ff0000"));
            paint.setAntiAlias(true);
            paint.setFilterBitmap(true);//位图过滤
            ;
        }
        //文字所占的区域,用来确定文字的起始坐标
        Rect rect = null;
        if (rect == null) {
            rect = new Rect();
        }

        paint.getTextBounds("99+", 0, "99+".length(), rect);
        float viewWidth = rect.width();
        float viewHeight = rect.height();
        if (viewWidth >= viewHeight) {
            radius = viewWidth + padding * 2;
            ;
        } else {
            radius = viewHeight + padding * 2;
            ;
        }
        Log.e("开始测量时候的radius", radius + "");
    }

    private void initAtters(Context context, @Nullable AttributeSet attrs) {
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.CircleNumberView);
        textSize = array.getFloat(R.styleable.CircleNumberView_textSize, 12.0f);
        padding = array.getInt(R.styleable.CircleNumberView_textPadding, 10);

        number = array.getString(R.styleable.CircleNumberView_textNumber);
        if (TextUtils.isEmpty(number)) {
            number = "111";
        } else {

        }
    }

    @Override
    protected void onDraw(Canvas canvas) {
        Log.e("onDraw时候的radius", radius + "");
        canvas.drawCircle(radius / 2.0f, radius / 2.0f, radius / 2.0f, paint);
        Paint paint1 = new Paint();
        paint1.setTextSize(SizeUtil.sp2px(getContext(), textSize));
        paint1.setColor(Color.parseColor("#ffffff"));
        paint1.setAntiAlias(true);
        paint1.setFilterBitmap(true);//位图过滤
        ;
        //设置文字显示时候的居中方式,不设置的话相当于Paint.Align.LEFT,则需要自己计算起点位置,需要自行处理精度问题
        //设置的坐标为文字的中线
        paint1.setTextAlign(Paint.Align.CENTER);
        //设置的坐标为文字的左侧边线
        //paint1.setTextAlign(Paint.Align.LEFT);
        //设置的坐标为文字的右侧边线
        //paint1.setTextAlign(Paint.Align.RIGHT);
        //文字所占的区域,用来确定文字的起始坐标
        Rect rect1 = null;
        if (rect1 == null) {
            rect1 = new Rect();
        }
        //39-15.5=23.5
        if (Integer.parseInt(number) > 99) {

            paint1.getTextBounds("99+", 0, "99+".length(), rect1);
        } else {
            paint1.getTextBounds(number, 0, number.length(), rect1);
        }

        //为了让文字纵向居中,计算正确的Y值
        Paint.FontMetrics fontMetrics = paint1.getFontMetrics();
        //ascent的绝对值=descent+2*(文字纵向中线与基准线的高度差)
        //float baseline = 0;
        //Math.abs(fontMetrics.ascent) =fontMetrics.descent+2*(baseline-height/2);
        float y = radius / 2.0f + (Math.abs(fontMetrics.ascent) - fontMetrics.descent) / 2.0f;

        Log.e("实际文字的宽度是", rect1.width() + "");
        float startX = radius / 2.0f - rect1.width() / 2.0f;
        startX = radius / 2.0f;
        Log.e("实际文字的startX是", startX + "");
        if (Integer.parseInt(number) > 99) {
            canvas.drawText("99+", startX + getPaddingLeft(), y + getPaddingTop(), paint1);
        } else {
            canvas.drawText(number, startX + getPaddingLeft(), y + getPaddingTop(), paint1);
        }
        Log.e("最后绘制的文字是", number);

    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //    super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        setMeasuredDimension((int) radius, (int) radius);
    }

    public CircleNumberView(Context context) {
        super(context);
        initView();
    }

    public CircleNumberView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        initAtters(context, attrs);
        initView();
    }

    public CircleNumberView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initAtters(context, attrs);
        initView();
    }

    @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
    public CircleNumberView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
        super(context, attrs, defStyleAttr, defStyleRes);
        initAtters(context, attrs);
        initView();
    }
}

atters代码

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="CircleNumberView">
        <attr name="textSize" format="float" />
        <attr name="textPadding" format="integer" />
        <attr name="textNumber" format="string" />
    </declare-styleable>


</resources>


使用样例:

 <com.xlkx.findreagent.view.CircleNumberView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_toRightOf="@+id/button"
        app:textNumber="13"
        app:textPadding="10"
        app:textSize="12"></com.xlkx.findreagent.view.CircleNumberView>

 

展开阅读全文

没有更多推荐了,返回首页