图片裁剪控件ImageViewCrop

最新推荐文章于 2021-05-25 21:27:04 发布

原创

最新推荐文章于 2021-05-25 21:27:04 发布 · 置顶 · 3.3k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#图片 #裁剪 #缩放 #旋转 #动画

本文介绍了如何使用自定义ImageView实现图片裁剪功能，包括画裁剪框、阴影区域，图片居中，手势监听（滑动、放大、旋转），回弹及回弹动画，以及裁剪和保存图片的逻辑。详细讲解了每个步骤的关键代码和注意事项，提供了源码地址。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里写图片描述

源码GitHub地址源码地址
GitHub的Readme那里有动态gif图

画裁剪框和阴影区域

最开始先画正方形裁剪框，这两种分别用不同的画笔

private static final String DEFAULT_BACKGROUND_COLOR_ID = "#99000000";//超过裁剪框阴影部分颜色

        mTransParentLayerPaint = new Paint();//阴影区域画笔                               mTransParentLayerPaint.setColor(Color.parseColor(DEFAULT_BACKGROUND_COLOR_ID));//设置颜色

        mWhiteCropPaint = new Paint();
        mWhiteCropPaint.setColor(Color.WHITE);//设置颜色
        mWhiteCropPaint.setStrokeWidth(1);//设置填充宽度
        mWhiteCropPaint.setStyle(Paint.Style.STROKE);//设置画笔Style

这里问题是，为什么第一个画出来的是区域，第二个画出来是一个线，style有三种模式：FILL（实心） STROKE（空心），FILL_AND_STROKE
设置好裁剪框画笔后，接着需要拿到裁剪框的Rectf区域就可以画上去了，首先得计算出裁剪框区域

 protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
        float mThisWidth = getMeasuredWidth();
        float mThisHeight = getMeasuredHeight();

        mCropRectF.set(0, (mThisHeight - mThisWidth) / 2, mThisWidth, (mThisHeight + mThisWidth) / 2);//初始化矩形框

这里写图片描述
之所以因为裁剪框的top是(mThisHeight - mThisWidth) / 2，因为，裁剪框的高是mWidth，而上下空隙是相同的，所以是height-width再除以2，因为onlayout时是已经拿到测量宽高的，这里有个小问题是：getMeasuredWidth()和getWidth区别？