Add a circular cropping component for UIImagePicker?

Question

I Have a circular framed UIImageView and I need to add a circular framed cropping tool for the UIImagePickerController, after the image is selected from a photo library. Very similar to Instagram's UIImagePicker's crop component. How do I add this type of component?

UPDATE

I've found this repo with a circular cropping tool https://github.com/ruslanskorb/RSKImageCropper

but can someone guide me on to how to implement this cropping tool with the UIImagePickerController after the user selects a photo from the photo library?

UPDATE

I am getting the following message in my debugger :

and the buttons in my crop view are disabled, meaning I cannot select them.. what message is the debugger relaying on to me?

here is my code:

  @IBAction func chooseProfilePicture(sender: AnyObject) {

        var myPickerController = UIImagePickerController()
        myPickerController = UIImagePickerController()
        myPickerController.delegate = self;
        myPickerController.sourceType = UIImagePickerControllerSourceType.PhotoLibrary

        self.presentViewController(myPickerController, animated: true, completion: nil)
    }

    func imagePickerController(picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [NSObject : AnyObject]) {

        var image : UIImage = (info[UIImagePickerControllerOriginalImage] as? UIImage)!

        editProfilePictureImageView.image = image

        self.dismissViewControllerAnimated(false, completion: { () -> Void in

            var imageCropVC : RSKImageCropViewController!

            imageCropVC = RSKImageCropViewController(image: image, cropMode: RSKImageCropMode.Circle)

            imageCropVC.delegate = self

            self.navigationController?.pushViewController(imageCropVC, animated: true)

        })

    }

Solution 1

Example Demo

Yes you can add RSKImageCropper in your UIImagePickerController

define imagePicker

var imagePicker : UIImagePickerController!

in ViewDidLoad

    imagePicker = UIImagePickerController()
    imagePicker.delegate = self
    imagePicker.sourceType = UIImagePickerControllerSourceType.PhotoLibrary;
    self.presentViewController(imagePicker, animated: true, completion: nil)

Delegate methode :

func imagePickerController(picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [NSObject : AnyObject])
{

    var image : UIImage = (info[UIImagePickerControllerOriginalImage] as? UIImage)!

    picker.dismissViewControllerAnimated(false, completion: { () -> Void in

        var imageCropVC : RSKImageCropViewController!

        imageCropVC = RSKImageCropViewController(image: image, cropMode: RSKImageCropMode.Circle)

        imageCropVC.delegate =self

        self.navigationController?.pushViewController(imageCropVC, animated: true)

    })

}

see :

Solution 2

Kirit Modi's answer was exactly what I needed, although I needed to do one thing to make this work. For those that dont download the test project, make sure to implement your delegate methods:

Swift 3:

extension YourViewControllerClass: RSKImageCropViewControllerDelegate {

    func imageCropViewControllerDidCancelCrop(_ controller: RSKImageCropViewController) {
        _ = self.navigationController?.popViewController(animated: true)
    }

    func imageCropViewController(_ controller: RSKImageCropViewController, didCropImage croppedImage: UIImage, usingCropRect cropRect: CGRect) {
        self.avatarImageView.image = croppedImage
        _ = self.navigationController?.popViewController(animated: true)
    }

}

Swift 2:

extension YourViewControllerClass: RSKImageCropViewControllerDelegate {

    func imageCropViewControllerDidCancelCrop(controller: RSKImageCropViewController) {
        self.navigationController?.popViewControllerAnimated(true)
    }

    func imageCropViewController(controller: RSKImageCropViewController, didCropImage croppedImage: UIImage, usingCropRect cropRect: CGRect) {
        self.avatarImageView.image = croppedImage
        self.navigationController?.popViewControllerAnimated(true)
    }

}

Comments

[John Durand]

can this be implemented in the UIImagePicker ? @KiritModi

[Kirit Modi]

I am added Example Demo in my answer download and run it.

[John Durand]

any chance you can mod this into swift?

[Kirit Modi]

you know how to use objective C class in swift

[John Durand]

i know how to import via bridging header, but all i need converted to swift is this part of your answer : [picker dismissViewControllerAnimated:false completion:^{ RSKImageCropViewController *imageCropVC = [[RSKImageCropViewController alloc] initWithImage:image cropMode:RSKImageCropModeCircle]; imageCropVC.delegate = self; [self.navigationController pushViewController:imageCropVC animated:YES]; }];

[John Durand]

the choose button is being disabled, i cannot select it, what am i doing wrong?

[Kirit Modi]

yes, The Operation could not complete is your JSON response is invalid from Webservice.

[John Durand]

huh? what does this have to do with JSON

[John Durand]

never mind, just had to add the delegate methods! thanks!

[Uma Madhavi]

@KiritModi. How can i do it in swift.

[Uma Madhavi]

I am unable to add this in my project ,can u tell me how can i achieve this. I want to add circular component for editing image.

[Josh O'Connor]

I can help you. Have you added the RSKImageCropView library? You can either use cocoaPod or drag the entire library to your project.

[Uma Madhavi]

Can u provide me the exact link for RSKImageCropView,i am working with swift 2.2.

[Kirit Modi]

@UmaMadhavi , The code is already in swift, But its objective C class have to bridge in your project.

[Josh O'Connor]

Just google it. It was the first result. github.com/ruslanskorb/RSKImageCropper

[Josh O'Connor]

I also recommend upgrading to swift 3.0. You will have to at some point.

[Uma Madhavi]

Ok thank u. My project has too many service calls I worked with alamofire but now all have changed don't know what to do . When I am converting to current versions getting 100's of errors .

[Josh O'Connor]

It took me 4 days to convert my codebase. First, you need to update your libraries to Swift 3. This means you need to research each library and see if they've updated their codebase. If so, you need to update the libraries one by one to Swift 3.0. I used cocoapods so I just updated my podfile of the ones that have updated to Swift 3.0

[Josh O'Connor]

Alamofire can be updated to Swift 3.0 easily. Just google Alamofire 4.0. Also, you may need to update your legacy settings of your libraries (google this too). After that, try the Xcode Swift 3.0 migration tool, and everything else you'll have to do manually. I have faith you can do it :)

[Josh O'Connor]

Also: 90% of updates can be done by clicking the red error or yellow warning icon and seeing what Xcode offers. The ones that Xcode cant figure out for you, google them.

[Uma Madhavi]

Thank u .. I used Carthages & pods . Do u know how to update carthage,that means i need to remove previous file & update the latest one or direct i can update carthage.

[Josh O'Connor]

I do not have much experience in Carthage, unfortunately, but maybe this will guide you stackoverflow.com/questions/39593813/…

[Uma Madhavi]

Thank you for ur response. I will try to do it.

[Josh O'Connor]

Keep in mind that it isnt imperative to update to Swift 3, since the RSKLibrary is in Objective-C and can be used with a bridging-header. You should still be able to use the library. Ill update the answer for Swift 2