Giter Club home page Giter Club logo

easycrop's Introduction

EasyCrop for Jetpack Compose

Easy to use image cropping library for Jetpack compose, with support for shapes, aspect-ratios, transformations, large images, auto zoom ...

Getting Started

1. Download

Add a dependency on the library to your Android project (Desktop not supported for now)

dependencies {
    implementation("io.github.mr0xf00:easycrop:0.1.1")
}

2. Create an ImageCropper instance

Option 1 : inside the composition

val imageCropper = rememberImageCropper()

Option 2 : outside the composition (eg. ViewModel)

class MyViewModel : ViewModel {
    val imageCropper = ImageCropper()
}

3. Crop

scope.launch {
    val result = imageCropper.crop(bitmap) // Suspends until user accepts or cancels cropping
    when (result) {
        CropResult.Cancelled -> { }
        is CropError -> { }
        is CropResult.Success -> { result.bitmap }
    }
}

4. Show the crop dialog

val cropState = imageCropper.cropState 
if(cropState != null) ImageCropperDialog(state = cropState)

That's it !

Using different sources

The crop function provides overloads for ImageBitmap, Uri, File, but it is also possible to use a custom ImageSrc.

You can use the rememberImagePicker function to easily pick an image and crop it :

val scope = rememberCoroutineScope()
val context = LocalContext.current
val imagePicker = rememberImagePicker(onImage = { uri ->
    scope.launch {
        val result = imageCropper.crop(uri, context)
    }
})

Customization

To customize the ui of the image cropper you can provide a different implementation of CropperStyle to the cropper dialog. You can also use the CropperStyle factory function. example :

ImageCropperDialog(
    state = cropState,
    style = CropperStyle(
        overlay = Color.Red.copy(alpha = .5f),
        autoZoom = false,
        guidelines = null,
    )
)

easycrop's People

Contributors

mr0xf00 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.