I am working on a project in which user performs following tasks.
select a UIImage which he wants to draw.
After selecting an Image. User select a tool (Named as Duplicate).
And as user moved it on UIImageVIew an Selected Image will draw on
it.
For Second Part I am trying following code but it not work.
UIGraphicsBeginImageContext(frontImageView.frame.size);
[frontImageView.image drawInRect:CGRectMake(0, 0, frontImageView.frame.size.width, frontImageView.frame.size.height)];
context = UIGraphicsGetCurrentContext();
CGRect theRect = CGRectMake(touchLocation.x, touchLocation.y, eraserWidth, eraserWidth);
CGContextAddRect(context, theRect);
CGContextDrawImage(context, theRect, originalImage.CGImage);
frontImageView.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
where originalImage conatin selected Image, EraserWIdth is ToolWidth, FrontIMageVIew is UIImageVIEW on which image will be Draw. Please Check either this code is correct or not Because my app get crash. Thanks in advance.
Related
I've been struggling with this method for a while. I am drawing an avatar on top of another image. The user picture I want to be a circle, however I can't seem to figure out how. The user picture is a UIImage and not a UIImageView. I am aware of how to make a circle if it is an imageview. Below is the code. There might be a better approach.
-(UIImage *)drawImage:(UIImage*)pinImage withBadge:(UIImage *)user{
UIGraphicsBeginImageContextWithOptions(pinImage.size, NO, 0.0f);
[pinImage drawInRect:CGRectMake(0, 0, pinImage.size.width, pinImage.size.height)];
[user drawInRect:CGRectMake(20.0, 10.0, user.size.width/2, user.size.height/2)];
UIImage *resultImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return resultImage;
}
The result is good, but the user image is still square, it is not circle. I have tried making the add the User image to a UIImageView, transform it to a circle, and then use it in the method by calling yourImageView.image, but no luck. I also tried numerous other ways. My logic is more than likely incorrect.
The desired outcome is a rounded image place on top of a pin/annotation. Where the black dot would be an image (a bigger circle than this).
You can clip the image context to the path of an image
// Start the image context
UIGraphicsBeginImageContextWithOptions(pinImage.size, NO, 0.0);
UIImage *resultImage = nil;
// Get the graphics context
CGContextRef context = UIGraphicsGetCurrentContext();
// Draw the first image
[pinImage drawInRect:CGRectMake(0, 0, pinImage.size.width, pinImage.size.height)];
// Get the frame of the second image
CGRect rect = CGRectMake(20.0, 10.0, user.size.width/2, user.size.height/2)
// Add the path of an ellipse to the context
// If the rect is a square the shape will be a circle
CGContextAddEllipseInRect(context, rect);
// Clip the context to that path
CGContextClip(context);
// Do the second image which will be clipped to that circle
[user drawInRect:rect];
// Get the result
UIImage *resultImage = UIGraphicsGetImageFromCurrentImageContext();
// End the image context
UIGraphicsEndImageContext();
Create a circular path and then clip to that?
CGContextAddArc(ctx, ....);
CGContextClip(ctx);
I have been trying to do this since forever. I have a camera overlay. I want to get my final image to be the part of the image viewable from the in-built camera.
What I did was make CGRect with dimensions equal to the square in the camera. Then I tried cropping it using this function.
- (UIImage *)imageByCropping:(UIImage *)imageToCrop toRect:(CGRect)rect
{
CGImageRef imageRef = CGImageCreateWithImageInRect([imageToCrop CGImage], rect);
UIImage *croppedImage = [UIImage imageWithCGImage:imageRef];
CGImageRelease(imageRef);
return croppedImage;
}
I called it like this
CGRect rect = CGRectMake(10, 72, 300, 300);
UIImage *realImage = [self imageByCropping:[self.capturedImages objectAtIndex:0] toRect:rect];
What I get is a bad quality image with the wrong orientation.
::EDIT::
With Nitin's answer I can crop the correct part of the screen but the problem is it crops the view that follows the camera view, 'the confirmation view'. I suspect this is because Nitin's code uses
UIImage *screenshot = UIGraphicsGetImageFromCurrentImageContext();
and because the ViewController in which all this is happening because the View Controller for the Confirmation View is the Controller in which this code is being executed. I will try to explain this with a small map
CameraOverlay.xib(it uses this xib to create an overlay) <===== CameraOverlayViewController ---------> ConfirmationView
So when first the ViewController is evoked(button on Tab bar), it opens the camera(UIImagePickerController) with an overlay over it. Then once user clicks an image, the image is shown on the ConfirmationView.
What I think is happening is when
UIGraphicsBeginImageContextWithOptions(self.view.frame.size, YES, 1.0);
[self.view.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *screenshot = UIGraphicsGetImageFromCurrentImageContext();
these lines are being executed, the View at that time is ConfirmationView.
Note: I call the function in
(void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info method.
Refer Drawing and printing Guide.
The default coordinate system is different between CoreGraphics and UIKit. I think your issue is because of this fact.
Using these may help you solve the issue
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextTranslateCTM(context , 0.0, rect.size.height);
CGContextScaleCTM(context , 1.0, -1.0);
In the photo albums app there's a build in edit -> cropping tool. Is it possible to use that tool in an app instead of writing it on my own? Is it a part of the framework?
No, there is no built-in crop tool. However, it would not be that hard to write such a tool.
You'd need to create a control that let the user drag around an image in a scroll view, and collect the coordinates.
Then you'd create a graphics context and use the UIImage method drawInRect: to draw the image into a rect that's larger than the graphics context. The result would be to draw a cropped portion of the image into the context. Then you'd extract an image from the graphics context and discard the graphics context.
No that is not part of SDK, but you can easily crop images in iOS.
- (UIImage *)resizeImage:(UIImage *)image width:(float)w height:(float)h {
UIImage *croppedImage = image;
CGSize size = CGSizeMake(w, h);
UIGraphicsBeginImageContext(size);
CGRect rect = CGRectMake(0.0f, 0.0f, size.width, size.height);
[image drawInRect:rect];
croppedImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return croppedImage;
}
I created a crop tool that might fit your need. It's not based on a scroll view, but rather letting the user choose a frame around their image.
https://github.com/nicholjs/BFCropInterface
I have a tiny qrcode UIImage set to a large UIImageView. In order to avoid any gradient from black to white when amplifying, I setted the UIImageView magnification filter to kCAFilterNearest as shown below (it works):
[QRCodeImageView layer].magnificationFilter = kCAFilterNearest;
Now I need to take a screenshot from this ImageView, but the result image is ignoring the magnification filter:
Here is my screenshot code:
UIGraphicsBeginImageContextWithOptions(CGSizeMake(QRCodeImageView.frame.size.width, QRCodeImageView.frame.size.height),YES, 2.0f);
CGContextRef context = UIGraphicsGetCurrentContext();
[QRCodeImageView.layer renderInContext:context];
UIImage *capturedImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
So, the question is, how to render in context with a given magnification filter?
Thanks in advance
I want to crop an ellipse from an image in ios. Using core image framework, I know know to crop a reactangular region.
Using core graphics, I am able to clip the elliptical region. But, the size of the cropped image is same as the size of the original image as I am applying mask to area outside the ellipse.
So, the goal is to crop the elliptical region from an image and size of cropped image won't exceed the rectangular bounds of that image.
Any help would be greatly appreciated. Thanks in advance.
You have to create a context in the correct size, try the following code:
- (UIImage *)cropImage:(UIImage *)input inElipse:(CGRect)rect {
CGRect drawArea = CGRectMake(-rect.origin.x, -rect.origin.y, input.size.width, input.size.height);
UIGraphicsBeginImageContext(rect.size);
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextAddEllipseInRect(ctx, CGRectMake(0, 0, rect.size.width, rect.size.height));
CGContextClip(ctx);
[input drawInRect:drawArea];
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return img;
}
Maybe you have to adjust the drawArea to your needs as i did not test it.