Android 水印背景（類似釘釘水印背景）

記錄一次水印背景的簡單實現(xiàn)


效果圖.png
1.自定義參數(shù)
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!--    水印參數(shù)-->
    <declare-styleable name="WaterMarkView">
        <!--        水印文字-->
        <attr name="text" format="string" />
        <!--        水平間距-->
        <attr name="hSpace" format="dimension" />
        <!--        垂直間距-->
        <attr name="vSpace" format="dimension" />
        <!--        角度-->
        <attr name="degrees" format="integer" />
        <!--        背景顏色-->
        <attr name="bgColor" format="color" />
        <!--        文字顏色-->
        <attr name="textColor" format="color" />
        <!--        文字大小-->
        <attr name="textSize" format="dimension" />
    </declare-styleable>
</resources>
2.自定義控件
package 你的包名.weight;

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.util.AttributeSet;
import android.view.View;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import 你的包名.R;

/**
 * Des: 自定義水印View
 * Created by kele on 2020/11/12.
 * E-mail:984127585@qq.com
 */
public class WaterMarkView extends View {

    private static final String TAG = WaterMarkView.class.getSimpleName();

    private int mDrawWidth = 300;//畫的寬度 為實際高度的mScaleSize倍（作用是在旋轉(zhuǎn)后防止有些地方?jīng)]有水?。?    private int mDrawHeight = 300;//畫的高度 同上
    private String str = "可樂";//水印文字
    private float hSpace = 50f;//水平間距
    private float vSpace = 20f;//垂直間距
    private int mScaleSize = 2;//縮放大小 固定：2
    private int mDegrees = -30;//旋轉(zhuǎn)角度
    private int bgColor = Color.TRANSPARENT;//背景顏色
    private int textColor = Color.BLACK;//字體顏色
    private float textSize = 13f;//字體大小
    private int mWidth;//布局實際寬度
    private int mHeight;//布局實際高度

    public WaterMarkView(@NonNull Context context) {
        this(context, null);
    }

    public WaterMarkView(@NonNull Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        init(context, attrs);
    }

    /**
     * 初始化
     *
     * @param context
     * @param attrs
     */
    public void init(Context context, AttributeSet attrs) {
        if (null != attrs) {
            //獲取XML中的參數(shù)
            TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.WaterMarkView);
            str = ta.getString(R.styleable.WaterMarkView_text);
            hSpace = ta.getDimension(R.styleable.WaterMarkView_hSpace, 50f);
            vSpace = ta.getDimension(R.styleable.WaterMarkView_vSpace, 20f);
            mDegrees = ta.getInteger(R.styleable.WaterMarkView_degrees, -30);
            bgColor = ta.getColor(R.styleable.WaterMarkView_bgColor, Color.TRANSPARENT);
            textColor = ta.getColor(R.styleable.WaterMarkView_textColor, Color.BLACK);
            textSize = ta.getDimension(R.styleable.WaterMarkView_textSize, 13f);
            ta.recycle();
        }
    }

    /**
     * 設(shè)置參數(shù)
     *
     * @param text 水印文字
     */
    public void setParams(String text) {
        setParams(text, hSpace, vSpace);
    }

    /**
     * 設(shè)置參數(shù)
     *
     * @param text  水印文字
     * @param hSize 水平方向水印文字個數(shù)
     * @param vSize 垂直方向水印文字個數(shù)
     */
    public void setParams(String text, float hSize, float vSize) {
        setParams(text, hSize, vSize, mDegrees);
    }

    /**
     * 設(shè)置參數(shù)
     *
     * @param text    水印文字
     * @param hSize   水平方向水印文字個數(shù)
     * @param vSize   垂直方向水印文字個數(shù)
     * @param degrees 旋轉(zhuǎn)角度
     */
    public void setParams(String text, float hSize, float vSize, int degrees) {
        setParams(text, hSize, vSize, degrees, bgColor, textColor, textSize);
    }

    /**
     * 參數(shù)設(shè)置
     *
     * @param text
     * @param hSize
     * @param vSize
     * @param degrees
     * @param bgColor   背景顏色
     * @param textColor 字體顏色
     * @param textSize  字體大小
     */
    public void setParams(String text, float hSize, float vSize, int degrees, int bgColor, int textColor, float textSize) {
        this.str = text;
        this.hSpace = hSize;
        this.vSpace = vSize;
        this.mDegrees = degrees;
        this.bgColor = bgColor;
        this.textColor = textColor;
        this.textSize = textSize;
        invalidate();
    }

    /**
     * 在View的源碼當中并沒有對AT_MOST和EXACTLY兩個模式做出區(qū)分，
     * 也就是說View在wrap_content和match_parent兩個模式下是完全相同的，
     * 都會是match_parent，
     * 顯然這與我們平時用的View不同，
     * 所以我們要重寫onMeasure方法。
     *
     * @param widthMeasureSpec
     * @param heightMeasureSpec
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        int heightSize = MeasureSpec.getSize(heightMeasureSpec);
        int heightMode = MeasureSpec.getMode(heightMeasureSpec);

        if (widthMode == MeasureSpec.AT_MOST && heightMode == MeasureSpec.AT_MOST) {
            setMeasuredDimension(mDrawWidth, mDrawHeight);
        } else if (widthMode == MeasureSpec.AT_MOST) {
            setMeasuredDimension(mDrawWidth, heightSize);
        } else if (heightMode == MeasureSpec.AT_MOST) {
            setMeasuredDimension(widthSize, mDrawHeight);
        }
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);

        //獲取實際寬高
        mWidth = getWidth();
        mHeight = getHeight();
        //設(shè)置需要畫的寬高
        mDrawWidth = mWidth * mScaleSize;
        mDrawHeight = mHeight * mScaleSize;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //畫水印
        drawWaterMark(canvas);
    }

    /**
     * 繪制水印
     *
     * @param canvas
     */
    private void drawWaterMark(Canvas canvas) {
        Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        Rect rect = new Rect();
        paint.setTextSize(textSize);
        //獲取文字長度和寬度
        paint.getTextBounds(str, 0, str.length(), rect);
        int textWidth = rect.width();
        int textHeight = rect.height();
        //獲取每個單獨的item的寬高
        float itemWidth = textWidth + hSpace;
        float itemHeight = textHeight + vSpace;
        //獲取水平、垂直方向需要繪制的個數(shù)
        int hSize = (int) ((mDrawWidth / itemWidth) + 0.5);
        int vSize = (int) ((mDrawHeight / itemHeight) + 0.5);

        //X軸開始坐標
        float xStart = hSpace / 2;
        //Y軸開始坐標
        float yStart = vSpace / 2 + textHeight;

        //創(chuàng)建透明畫布
        canvas.drawColor(bgColor);

        paint.setColor(textColor);
        //paint.setAlpha((int) (0.1 * 255));
        // 獲取跟清晰的圖像采樣
        paint.setDither(true);
        paint.setFilterBitmap(true);

        canvas.save();
        //平移
        canvas.translate(-(mDrawWidth / 4), -(mDrawHeight / 4));
        //旋轉(zhuǎn)對應(yīng)角度
        canvas.rotate(mDegrees, mDrawWidth / 2, mDrawHeight / 2);
        //畫X軸方向
        for (int i = 0; i < hSize; i++) {
            float xDraw = xStart + itemWidth * i;
            //畫Y軸方向
            for (int j = 0; j < vSize; j++) {
                float yDraw = yStart + itemHeight * j;
                canvas.drawText(str, xDraw, yDraw, paint);
            }
        }
        canvas.restore();
    }
}
3.使用（以xml中使用為例）

xml:

    <你的包名.weight.WaterMarkView
        android:id="@+id/wmv"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:bgColor="@color/color_F4F4F4"
        app:text="可樂"
        app:hSpace="@dimen/dp_30"
        app:vSpace="@dimen/dp_30"
        app:degrees="-30"
        app:textColor="@color/color_E6E8EC"
        app:textSize="@dimen/sp_13" />

java:

        WaterMarkView wmv = v.findViewById(R.id.wmv);
        wmv.setParams("小可樂");
  • 基于ViewGroup實現(xiàn)類似，詳見github

GitHub地址：https://github.com/xiaokele/WaterMarkView

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容