android开发游记：自定义图片裁剪组件

由于各种原因，我放弃了在项目中使用系统的裁剪图片功能组件，转而使用自定义裁剪组件，话不多说，先上图












这里使用了github上的开源库，感谢Issei Aoki的分享

https://github.com/IsseiAoki/SimpleCropView

下面说下如何在项目中使用

首先下载项目，导入工程作为library管理到自己的工程

工程是android studio的环境，使用eclipse的朋友请参考我的第一篇博客

/article/3581563.html

实例中使用了toolbar，没有最新的5.0兼容包support_v7的朋友会出现错误：提示找不到Toolbar，只有把布局中的toolbar换成LinearLayout就OK了:

[code]<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:background="@null">
        ......
</android.support.v7.widget.Toolbar>

换成

[code]<LinearLayout
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="64dp"
        android:background="@null">
        ......
</LinearLayout>

然后在自己工程的布局文件中加入自定义View组件CropImageView：

[code]<com.isseiaoki.simplecropview.CropImageView
            android:id="@+id/cropImageView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingBottom="64dp"
            android:paddingLeft="16dp"
            android:paddingRight="16dp"
            android:paddingTop="32dp"
            custom:backgroundColor="@color/base"
            custom:cropMode="ratio_fit_image"
            custom:frameColor="@color/frame"
            custom:frameStrokeWeight="1dp"
            custom:guideColor="@color/guide"
            custom:guideShowMode="show_on_touch"
            custom:guideStrokeWeight="1dp"
            custom:handleColor="@color/handle"
            custom:handleShowMode="show_always"
            custom:handleSize="8dp"
            custom:minFrameSize="50dp"
            custom:overlayColor="@color/overlay"
            custom:touchPadding="8dp" />

然后在自己的activity中初始化View控件

[code]        mCropView = (CropImageView) findViewById(R.id.cropImageView);
        mCropView.setImageBitmap(bitmap);
        mCropView.setCropMode(CropImageView.CropMode.RATIO_FREE);
        /**
         * bitmap是你设置的要进行裁剪的图片
         */

就可以了，很简单吧

这样就可以运行来看看了

注意原工程有个BUG，打开library的自定义View组件 CropImageView.java，找到getCroppedBitmap()方法，

[code]    /**
     * Get cropped image bitmap
     * @return cropped image bitmap
     */
    public Bitmap getCroppedBitmap() {
        int x = 0, y = 0, w = 0, h = 0;
        if (mBitmap != null) {
            int l = (int) (mFrameRect.left / mScale);
            int t = (int) (mFrameRect.top / mScale);
            int r = (int) (mFrameRect.right / mScale);
            int b = (int) (mFrameRect.bottom / mScale);
            x = l - (int) (mImageRect.left / mScale);
            y = t - (int) (mImageRect.top / mScale);
            w = r - l;
            h = b - t;
        }
        Bitmap cropped = Bitmap.createBitmap(mBitmap, x, y, w, h, null, false);
        if(mCropMode != CropMode.CIRCLE) return cropped;
        return getCircularBitmap(cropped);
    }

这个方法是从原图片中将生成裁剪后的图片

作者这里使用了强制类型转换，把float转换为int，由于强制类型转换是默认向下取整的所以，可能会造成产生1个像素的误差，因为这1个像素就会导致生成图片的高宽超过原图，从而导致异常，这个异常时偶发型的，困扰了我好久，后来才发现是裁图组件的bug导致的。把上面的方法改成这样：

[code]    int l = (int) Math.ceil((mFrameRect.left / mScale));
    int t = (int) Math.ceil((mFrameRect.top / mScale));
    int r = (int) Math.floor((mFrameRect.right / mScale));
    int b = (int) Math.floor((mFrameRect.bottom / mScale));
    x = l - (int) Math.ceil((mImageRect.left / mScale));
    y = t - (int) Math.ceil((mImageRect.top / mScale));

就ＯＫ了

这个BUG已经反馈给作者，无奈英语不好，被当成来找茬的 #-_-

裁剪组件可以设置裁剪框是固定比例或者自由调整，矩形圆形等，只需要修改CropMode参数就可以了

可以在布局中使用

custom:cropMode="ratio_1_1"

属性，如下：

[code]<com.isseiaoki.simplecropview.CropImageView
        android:id="@+id/cropImageView"
        xmlns:custom="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="250dp"
        android:padding="16dp"
        custom:cropMode="ratio_1_1"
        />

也可以在java代码中运行时动态改变：

[code]mCropView.setCropMode(CropImageView.CropMode.RATIO_1_1);

CropMode的值如下，含义显而易见：

[code]RATIO_FIT_IMAGE(0), 
RATIO_4_3(1), 
RATIO_3_4(2), 
RATIO_1_1(3), 
RATIO_16_9(4), 
RATIO_9_16(5), 
RATIO_FREE(6), 
RATIO_CUSTOM(7);

获取裁剪后的图片就调用上面的方法

[code]Bitmap croppedBitmap = mCropView.getCroppedBitmap();