如何使用 textview 或任何布局制作横幅或丝带

How make a banner or ribbon with textview or any layout

嘿,我想用 textview 或 中的任何布局 制作一个类似于给定照片的 横幅或丝带 android 使用 xml 或 java。我不知道该怎么做。
所以请帮助我解决它真正需要的问题。

要创建这样的横幅,您需要做这些事情

  1. 通过调整 this code
  2. 创建倒直角三角形的可绘制形状
  3. 将 textView 的背景设置为此形状
  4. 将 textView 重力更改为 right/end 对齐

这是一个简单的 imageview,角落里有文字横幅,是我自己写的。相同的结构可以应用于任何类型的视图。

public class BannerImageView extends ImageView {

    private Paint mRibbonPaint;
    private Paint mTextPaint;
    private Paint mBoxPaint;
    private float mScale;
    private String mBannerText;

    public BannerImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initPainters(attrs);
    }

    public BannerImageView(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        initPainters(attrs);
    }

    private void initPainters(AttributeSet attrs) {
        TypedArray attributes = getContext().getTheme().obtainStyledAttributes(attrs, R.styleable.BannerImageView, defStyleAttr, 0);
        mBannerText = attributes.getString(R.styleable.BannerImageView_label);
        mBoxPaint = new Paint();
        int white = ContextCompat.getColor(getContext(), R.color.white);
        mBoxPaint.setColor(white);
        mBoxPaint.setAlpha(156);
        mRibbonPaint = new Paint();
        mRibbonPaint.setColor(ContextCompat.getColor(getContext(), R.color.banner_color));
        mRibbonPaint.setAntiAlias(true);
        mRibbonPaint.setStyle(Paint.Style.STROKE);
        mRibbonPaint.setStrokeCap(Paint.Cap.BUTT);
        mScale = getResources().getDisplayMetrics().density;
        mRibbonPaint.setStrokeWidth(dp(16));
        mTextPaint = new Paint();
        mTextPaint.setColor(white);
        mTextPaint.setTextSize( dp(12) );
    }

    /**
     * Converts dp to px
     * @param dp
     * @return
     */
    private float dp(float dp) {
        return dp * mScale + 0.5f;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if ( !TextUtils.isEmpty(mBannerText) ) {
            canvas.drawRect(0, 0, getRight(), getBottom(), mBoxPaint);
            canvas.drawLine(-dp(16), dp(64), dp(64), -dp(16), mRibbonPaint);
            canvas.save();
            canvas.rotate(-45, 0, 0);
            canvas.drawText(mBannerText, -dp(24), dp(38), mTextPaint);
            canvas.restore();
        }
    }

然后在values/attrs.xml

中声明你想使用的额外属性
<declare-styleable name="BannerImageView">
    <attr name="label" format="string"/>
</declare-styleable>

当然,您像往常一样在 XML 布局中使用,但请记住自定义属性的应用命名空间

<com.my.package.BannerImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:label="Sold Out" />