一个不规则圆角小标签

样式

<declare-styleable name="TagView">
    <attr name="outColor" format="color" /> <!--整体色值-->
    <attr name="upTextColor" format="color" /> <!--上面字体颜色-->
    <attr name="bottomTextColor" format="color" /> <!--下面字体颜色-->
    <attr name="text" format="string" /> <!--下面字体颜色-->
    <attr name="lineSize" format="integer" /> <!--下面字体颜色-->
</declare-styleable>

代码实现

package com.example.myapplication;


import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;

import com.mobile.mbank.common.api.utils.DensityUtil;
import com.mobile.mbank.template.api.R;

/**
 * @class name:com.example.myapplication
 * @desc (一句话描述类的作用)
 * @anthor wangzhongli
 * @Create At 2022/4/27 16:18
 * @chang 16:18
 */
public class TagView extends View {
    private final Paint mCPaint = new Paint();
    private final Paint textPaint = new Paint();
    private int width;
    private Context mContext;
    private int conner = 20;
    private int lineSize = 6;
    private int outerColor;
    private int upTextColor;
    private int bottomTextColor;
    private String text;
    private final String[] strings = new String[2];

    private final float[] cornersOuter = new float[]{
            conner, conner,        // Top left radius in px
            conner, conner,        // Top right radius in px
            0, 0,          // Bottom right radius in px
            conner, conner           // Bottom left radius in px
    };

    private final float[] cornersBottom = new float[]{
            0, 0,        // Top left radius in px
            0, 0,        // Top right radius in px
            0, 0,          // Bottom right radius in px
            conner, conner           // Bottom left radius in px
    };

    public TagView(Context context) {
        super(context);
    }

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

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

    private void init(Context context, AttributeSet attrs) {
        mContext = context;
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.TagView);
        outerColor = array.getColor(R.styleable.TagView_outColor, Color.parseColor("#ff6d02"));
        upTextColor = array.getColor(R.styleable.TagView_upTextColor, Color.parseColor("#ff6d02"));
        bottomTextColor = array.getColor(R.styleable.TagView_bottomTextColor, Color.parseColor("#ffffff"));
        lineSize = array.getColor(R.styleable.TagView_lineSize, 6);
        text = array.getString(R.styleable.TagView_textStr);
        array.recycle();
    }

    private void initPaint() {
        mCPaint.setAntiAlias(true);
        mCPaint.setStrokeWidth(lineSize);
        mCPaint.setColor(outerColor);
        mCPaint.setStyle(Paint.Style.STROKE);

        textPaint.setAntiAlias(true);
        textPaint.setColor(upTextColor);
        textPaint.setStyle(Paint.Style.FILL);
        textPaint.setTextSize(DensityUtil.dp2px(mContext, (width - 2 * lineSize) / 8));
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        width = MeasureSpec.getSize(widthMeasureSpec);
        int height = MeasureSpec.getSize(heightMeasureSpec);
        if (width != height) {
            width = height;
        }
        setMeasuredDimension(width, height);
    }


    @Override
    protected void onDraw(Canvas canvas) {
        initPaint();
        handleText(text);
//        RectF rectf = new RectF(0, 0, width, width);
//        RectF rectf1 = new RectF(0, width / 2 - lineSize / 2, width, width);
        RectF rectf = new RectF(lineSize / 2, lineSize / 2, width - lineSize / 2, width - lineSize / 2);
        RectF rectf1 = new RectF(lineSize / 2, width / 2 - lineSize / 2, width - lineSize / 2, width - lineSize / 2);
        final Path path = new Path();
        path.addRoundRect(rectf, cornersOuter, Path.Direction.CCW);
        canvas.drawPath(path, mCPaint);

        final Path path1 = new Path();
        path1.addRoundRect(rectf1, cornersBottom, Path.Direction.CW);
        mCPaint.setStyle(Paint.Style.FILL);
        canvas.drawPath(path1, mCPaint);
        float textwidth = textPaint.measureText(strings[0]);
        float textHeight = measureTextHeight(textPaint);

        canvas.drawText(strings[0], width / 2 - textwidth / 2, width / 4 + textHeight / 2, textPaint);
        textPaint.setColor(bottomTextColor);
        canvas.drawText(strings[1], width / 2 - textwidth / 2, width - width / 4 + textHeight / 2, textPaint);
    }

    private void handleText(String str) {
        if (str == null || "".equals(str)) {
            strings[0] = "未知";
            strings[1] = "未知";
        } else if (str.length() <= 2) {
            strings[0] = str;
            strings[1] = "未知";
        } else if (str.length() <= 4) {
            strings[0] = str.substring(0, 2);
            strings[1] = str.substring(2);
        } else {
            strings[0] = str.substring(0, 2);
            strings[1] = str.substring(2, 4);
        }
    }

    public void setConner(int conner) {
        this.conner = conner;
    }

    public void setOuterColor(int outerColor) {
        this.outerColor = outerColor;
    }

    public void setUpTextColor(int upTextColor) {
        this.upTextColor = upTextColor;
    }

    public void setBottomTextColor(int bottomTextColor) {
        this.bottomTextColor = bottomTextColor;
    }

    public void setText(String text) {
        this.text = text;
    }

    public void setLineSize(int lineSize) {
        this.lineSize = lineSize;
    }

    /**
     * 测量文字高度
     *
     * @param paint
     * @return
     */
    private static float measureTextHeight(Paint paint) {
        Paint.FontMetrics fontMetrics = paint.getFontMetrics();
        return (Math.abs(fontMetrics.ascent) - fontMetrics.descent);
    }

}
<LinearLayout
    android:layout_width="match_parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/tv1"
    android:layout_height="wrap_content">

    <com.example.myapplication.TagView
        android:id="@+id/tagView"
        android:layout_width="80dip"
        android:layout_height="80dip"
        android:layout_marginLeft="30dip"
        app:text="金融资讯"
        app:lineSize="20"
        app:bottomTextColor="@color/white"
        app:upTextColor="#ff6d02"
        app:outColor="#ff6d02" />

    <com.example.myapplication.TagView
        android:id="@+id/tagView1"
        android:layout_width="60dip"
        android:layout_height="60dip"
        android:layout_marginTop="30dip"
        android:layout_marginLeft="30dip"
        app:text="头条新闻"
        app:bottomTextColor="@color/white"
        app:upTextColor="#f04206"
        app:outColor="#f04206" />

    <com.example.myapplication.TagView
        android:id="@+id/tagView2"
        android:layout_width="34dip"
        android:layout_height="34dip"
        android:layout_marginTop="60dip"
        app:text="宏观经济"
        android:layout_marginLeft="30dip"
        app:bottomTextColor="@color/white"
        app:upTextColor="#29B289"
        app:outColor="#29B289" />
</LinearLayout>

最终效果:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值