Home

Awesome

Cropper - NoCropper

This is a lightweight Image Cropper for Android which also supports no-crop feature.

Version 0.3.0 adds pre-scale support!

Project Page Blogpost

Here's a short gif showing how it works.

Demo

And, here's a bit longer YouTube Video

CropperView

It's a FrameLayout which contains a view for Grid and an imageview. This project supports only square cropping. CropperView contains some basic methods like setImageBitmap(), setMaxZoom(), setMinZoom(), etc which are forwarded to CropperImageView.

It's not an Activity or Fragment. It's just a FrameLayout which you can use anywhere and however you want in your app. There are some styling and customizations also available.

How To Install

JCenter / Bintray (Deprecated)

Maven
repositories {
    maven {
        url  "http://dl.bintray.com/jayrambhia/maven"
    }
}

or

JCenter
repositories {
    jcenter()
}
Dependency
dependencies {
    compile 'com.fenchtose.nocropper:nocropper:0.3.1'
}

JitPack

repositories {
    maven {
        url  "https://jitpack.io"
    }
}

dependencies {
    implementation 'com.github.jayrambhia:CropperNoCropper:0.3.2'
}

CropperImageView

It's a square ImageView which acts as the cropper. It tries to keep the image in the range of max and min zoom. It automatically adjusts the position of the image, if it's zoomed out.

How To Use:

<com.fenchtose.nocropper.CropperView
    android:background="#ff282828"
    android:id="@+id/cropper_view"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    app:nocropper__grid_opacity="0.8"
    app:nocropper__grid_thickness="0.8dp"
    app:nocropper__grid_color="@color/colorAccent"
    app:nocropper__padding_color="#ff282828"/>

And that's it. CropperView is ready to be used anywhere in the app. No dependencies.

Useful Methods:

Styleables

CropperCallback

It's an abstract class for callback. The callback methods will be invoked on main ui thread. It has following methods.

GridCallback

It's an interface class for callback. You can control when you want to show this based on this class. It has following methods.

CropInfo

What is it?

CropInfo is a state of the crop which has data which can be used to crop the bitmap at a later stage. CropperImageView now uses CropInfo to crop the bitmap.

This state of crop can be used on a scaled version of the same image/bitmap. If you have a large enough bitmap but you don't want to load it. You can load a scaled down version of it, when user is done cropping, get CropInfo, apply CropInfo.scaleInfo(factor) which gives a scaled version of CropInfo which can be used to crop the original bigger image with the same crop bounds as the user chose.

It can also be projected for an un-rotated version of the bitmap. Eg. User rotates and crops the bitmap, but you want to crop the original (un-scaled) bitmap without having to rotate it. You can first "un-rotate" the CropInfo by using CropInfo.rotate90XTimes(int w, int h, int times) where times corresponds to the number of times the bitmap was rotated by 90 degrees clockwise. It will give you a projection of crop state which you can then scale and use to crop the original image.

How to get it?

CropperView.getCropInfo() will return CropResult. If cropping can be done, i.e. bitmap is loaded and user is not mid-gesture, CropResult will contain a valid value of CropInfo.

Transformations

How to use it?

Once you have obtained CropInfo and transformed it the way you like, use Cropper to crop the original bitmap.

Cropper cropper = new Cropper(cropInfo, originalBitmap);
cropper.crop(callback) # for async
# or
cropper.cropBitmap() # for sync

You can also use ScaledCropper. It will take care of scaling the cropInfo for you.

ScaledCropper cropper = new ScaledCropper(cropInfo, originalBitmap, scaleFactor);
cropper.crop(callback) # for async
# or
cropper.cropBitmap() # for sync

CropMatrix

What is it?

CropMatrix is a state of the CropperView based on the translation and zoom of the image. This can be used if you are working with multiple crops or if the user paused the app and you would like to restore the exact position and zoom of the image in the cropper.

How to get it?

CropperView.getCropMatrix() will return CropMatrix. It contains scale, xTranslation and yTranslation. It's best if it's not edited manually as invalid values may lead to undesired behavior.

How to use it?

When you wish to restore the saved position, use CropperView.setCropMatrix(matrix, animate). animate is a boolean flag. If it's true, the image would animate from the current position and scale to the new one. If animate is false, it will go to the new position and scale instantly.

Note: If you want to call this method right after setting the Bitmap, you'd need to call it with delay (wait for the bitmap to load).

0.2 to 0.3 update note:

0.1 to 0.2 update note:

All the styleables are renamed to have prefix nocropper__ so as not to have collision issues with other resource attributes. By collision I mean, your app will not build if it has to resources attributes with same name.

Licenses and Release History

CHANGELOG

NoCropper binaries and source code can be used according to the Apache License, Version 2.0.