PictureSelector 裁剪框添加文字提示(笔记)

该文介绍如何在不引入PictureSelectormodule的情况下,扩展修改PictureSelector的裁剪框功能,添加顶部和底部文字。主要步骤包括继承OverlayView并重写onDraw方法,复制并修改ucrop_view.xml布局文件。此外,提供了设置文字内容、间距和大小的方法。

引言:在不引入PictureSelector module的情况下、进行修改。讲人话 就是PictureSelect采用的是implementation xxx.xxxx.xxx 引入方式、在此基础之上进行扩展修改、且不影响其他功能。

注意:PictureSelector 版本<3.0

先看图(符合预期了再往下看):

实现步骤:

一、继承修改OverlayView、重写其onDraw方法(目的就是drawText);

二、复制ucrop_view.xml文件到自己工程的layout中、在ucrop_view.xml中将OverlayView 替换成自己的(ucrop_view.xml 可以在pictureselect库中找到);


原理(不想看可以跳过 手动狗头):

找到裁剪框的Rect、在其顶部和底部drawText、就O了、其中矩形关键字mCropViewRect(RectF);

分析、找到onDraw() 、进入drawDimmedLayer()函数、其中drawDimmedLayer()就是用来画矩形的(就是那个可以拖动的框框)、找到mCropViewRect、在后面DrawText就行了!

具体参考OverlayViewWithText 源码。


以下是已经写好的 直接用吧!

如何使用?:

     //设置裁剪框上下的文字
        OverlayViewWithText.setPictureUCropText("顶部巴拉巴拉", "底部巴拉巴拉")
        //设置裁剪框文字距离裁剪框的间距(包含上下文字)
        OverlayViewWithText.setPictureUCropMargin(10.dp2Px().toFloat())
        //设置裁剪框文字大小
        OverlayViewWithText.setPictureUCropTextSize(15f.sp2Px(), 18f.sp2Px())

1、OverlayViewWithText 相关代码在下面: 


import android.animation.Animator;
import android.animation.ValueAnimator;
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.Point;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Region;
import android.os.Build;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.animation.OvershootInterpolator;

import androidx.annotation.ColorInt;
import androidx.annotation.IntDef;
import androidx.annotation.IntRange;
import androidx.annotation.NonNull;

import com.yalantis.ucrop.R;
import com.yalantis.ucrop.callback.OverlayViewChangeListener;
import com.yalantis.ucrop.util.RectUtils;
import com.yalantis.ucrop.view.OverlayView;

import java.lang.annotation.Retention;
import java.lang.annotation.RetentionPolicy;

/**
 * Created by Oleksii Shliama (https://github.com/shliama).
 * <p/>
 * This view is used for drawing the overlay on top of the image. It may have frame, crop guidelines and dimmed area.
 * This must have LAYER_TYPE_SOFTWARE to draw itself properly.
 */
public class OverlayViewWithText extends OverlayView {

    public static final int FREESTYLE_CROP_MODE_DISABLE = 0;
    public static final int FREESTYLE_CROP_MODE_ENABLE = 1;
    public static final int FREESTYLE_CROP_MODE_ENABLE_WITH_PASS_THROUGH = 2;
    public static final boolean DEFAULT_DRAG_FRAME = true;
    public static final boolean DEFAULT_SHOW_CROP_FRAME = true;
    public static final boolean DEFAULT_SHOW_CROP_GRID = true;
    public static final boolean DEFAULT_CIRCLE_DIMMED_LAYER = false;
    public static final int DEFAULT_FREESTYLE_CROP_MODE = FREESTYLE_CROP_MODE_DISABLE;
    public static final int DEFAULT_CROP_GRID_ROW_COUNT = 2;
    public static final int DEFAULT_CROP_GRID_COLUMN_COUNT = 2;

    private Paint topTvPaint;
    private Paint bomTvPaint;
    private static String topCon = "";
    private static String bomCon = "";
    private float topTvWidth;
    private float bomTvWidth;
    private int bomTvHeight;
    private static float tvMargin;
    private static float topTvMargin;
    private static float bomTvMargin;
    private static float topTvSize;
    private static float bomTvSize;

    private final RectF mCropViewRect = new RectF();
    private final RectF mTempRect = new RectF();

    protected int mThisWidth, mThisHeight;
    protected float[] mCropGridCorners;
    protected float[] mCropGridCenter;

    private int mCropGridRowCount, mCropGridColumnCount;
    private float mTargetAspectRatio;
    private float[] mGridPoints = null;
    private boolean mShowCropFrame, mShowCropGrid;
    private boolean mCircleDimmedLayer;
    private int mDimmedColor;
    private int mDimmedBorderColor;
    private Path mCircularPath = new Path();
    private Paint mDimmedStrokePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    private Paint mCropGridPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    private Paint mCropFramePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    private Paint mCropFrameCornersPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    @FreestyleMode
    private int mFreestyleCropMode = DEFAULT_FREESTYLE_CROP_MODE;
    private float mPreviousTouchX = -1, mPreviousTouchY = -1;
    private int mCurrentTouchCornerIndex = -1;
    private int mTouchPointThreshold;
    private int mCropRectMinSize;
    private int mCropRectCornerTouchAreaLineLength;
    private int mStrokeWidth = 1;
    private boolean mIsDragFrame = DEFAULT_DRAG_FRAME;
    private ValueAnimator smoothAnimator;

    private OverlayViewChangeListener mCallback;

    private boolean mShouldSetupCropBounds;

    {
        mTouchPointThreshold = getResources().getDimensionPixelSize(R.dimen.ucrop_default_crop_rect_corner_touch_threshold);
        mCropRectMinSize = getResources().getDimensionPixelSize(R.dimen.ucrop_default_crop_rect_min_size);
        mCropRectCornerTouchAreaLineLength = getResources().getDimensionPixelSize(R.dimen.ucrop_default_crop_rect_corner_touch_area_line_length);
    }

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

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

    public OverlayViewWithText(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);

        topTvPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        //默认字体大小
        if (topTvSize <= 0) topTvSize = 50f;
        if (bomTvSize <= 0) bomTvSize = 50f;
        topTvPaint.setTextSize(topTvSize);
        topTvPaint.setColor(Color.RED);
        bomTvPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        bo
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值