Hi all i am having .png image.I want to draw only half of this image.If i call method drawInRect: on image with width being half the size of image,it will still draw the full image
in given rect.So how to draw half image
Before calling -drawInRect, try setting a clip mask on the current context:
UIImage *image = // your image, let's say 100x100
CGRect drawingRect = CGRectMake(0.0f, 0.0f, 100.0f, 100.0f); // adjust the origin; size has to be the image's size
CGRect clippingRect = drawingRect; // copy drawingRect...
clippingRect.size.width = 50.0f; // ...and reduce the width
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context); // save current graphics state
CGContextClipToRect(context, clippingRect);
[image drawInRect:drawingRect];
CGContextRestoreGState(context); // restore previous state (without clip mask)
If it's in a UIImageView, you can change the frame to only fit half the image, then set [imageView setClipsToBounds:YES].
You could crop your existing image by using CGImageCreateWithImageInRect
Clip Rect did the magic. Thanks #thomas
CGContextClipToRect(context, clippingRect);
Related
I was wondering if someone could point me in the right direction with this problem.
I have a user-created UIBezierPath with several points that have come about by user touches.
I can get these to create shapes on a bog-standard UIView by using the [myPath fill]; function.
What I would ideally like to do is to use the path to create a clipping mask for a UIImage - perhaps as a UiImageView?
I tried changing my UIView to a UIImageView and then changing the function to [myPath addClip]; but for some reason it does not work.
You need to create a graphics context, draw your image, and draw your mask using kCGBlendModeDestinationIn. Something like this:
UIGraphicsBeginImageContextWithOptions(size, NO, 0.0); // size is a CGSize of the result you want
[image drawInRect:imageRect]; // image is the UIImage you want to clip, imageRect is the rect in the context where you want your image
[mask drawInRect:rect blendMode:kCGBlendModeDestinationIn alpha:1.0]; // mask is a UIImage containing the mask you drew, rect is the rect in the context where you want your mask - could match imageRect above
UIImage* uiImage = UIGraphicsGetImageFromCurrentImageContext();
I want to clip an UIImageView if it moves out of given rect.
The image is moving across the screen by setting the frame, but I need to clip it when it moves out of a given fixed rect (say (0,0,650,650)).
If you only want to show the center of the image an a UIImageView set the content mode to "Aspect Fill" via IB. That will center it and crop off anything extra.
Or in code
myImageView.contentMode = UIViewContentModeScaleAspectFill;
or
Subclass UIView and in the drawRect method, adjust the rect and draw out the clipped image using CGContextDrawImage (context, rect, sourceImage.CGImage).
or
Use CALayers. You can adjust the 'contentsRect' of the imageView's layer:
CALayer* imageLayer = imageView.layer;
imageLayer.masksToBounds = YES;
CGRect rect;
if (inPortrait)
rect = CGRectMake(0.0, 0.0, 0.5, 1.0); // half size
else
rect = CGRectMake(0.0, 0.0, 1.0, 1.0); // full size
imageLayer.contentsRect = rect;
Did you try using the property clipsToBounds of UIView and setting it to YES as it says in Reference that
Setting this value to YES causes subviews to be clipped to the bounds of the receiver
UPDATE
See if this SO question helps you
Proper use of UIRectClip to scale a UIImage down to icon size
myImageView.contentMode = UIViewContentModeCenter;
Try this.
When I use UIImagePickerController with cameraOverlayView, can I get the only a selective region from my overlay view?
http://tinyurl.com/2fqy9nq
Add an UIImageView as child to your cameraOverlayView.
Create a black PNG image size 320x480. Cut a rectangle in the middle to produce a hole (transparent pixels).
Assign the PNG image to the UIImageView.
Alternatively you could overwrite your cameraOverlayView's - (void)drawRect:(CGRect)rect like this (untested out of my head):
// Request draw context
CGContextRef context = UIGraphicsGetCurrentContext();
// Draw background
CGContextSetRGBFillColor(context, 0.0f, 0.0f, 0.0f, 1.0f);
CGContextFillRect(context, rect);
// Cut hole
CGContextSetBlendMode(context, kCGBlendModeClear);
CGContextFillRect(context, CGRectMake(40, 40, 100, 100);
I have done something similar in my Faces app (http://faces.pixelshed.net/). Feel free to write a comment if one of the steps seems unclear.
i have a view with uiimageview i assign this uiimageview image by camera..now i want to do some drawing onto image....using coregraphics.i want to do something like this... select an area by touching and drawing line when line joins something like circle or any shape..i want to change that particular area in to something else for example change color there.turn that into grayscale.. till now i am able to draw line...here is an image of line drawn over a uiimage view...
but i am unable to figure it out how do i draw at imageview's image..mean how to modify imageview's image???
also i want to restore image when click on clear button or something like undo..does someone knows how to achieve this?
and
how do i create a rectangle when click on crop button move the rectangle any where on the screen...and then push the button to crop the image...and then save cropped image..
These are the steps:
Create a CGBitmapContext matching the image's colorspace and dimensions.
Draw the image into that context.
Draw whatever you want on top of the image.
Create a new image from the context.
Dispose off the context.
Here's a method that takes an image, draws something on top of it and returns a new UIImage with modified contents:
- (UIImage*)modifiedImageWithImage:(UIImage*)uiImage
{
// build context to draw in
CGImageRef image = uiImage.CGImage;
CGColorSpaceRef colorspace = CGColorSpaceCreateDeviceRGB();
CGContextRef ctx = CGBitmapContextCreate(NULL,
CGImageGetWidth(image), CGImageGetHeight(image),
8, CGImageGetWidth(image) * 4,
colorspace, kCGImageAlphaPremultipliedLast);
CGColorSpaceRelease(colorspace);
// draw original image
CGRect r = CGRectMake(0, 0, CGImageGetWidth(image), CGImageGetHeight(image));
CGContextSetBlendMode(ctx, kCGBlendModeCopy);
CGContextDrawImage(ctx, r, image);
CGContextSetBlendMode(ctx, kCGBlendModeNormal);
// draw something
CGContextAddEllipseInRect(ctx, CGRectInset(r, 10, 10));
CGContextSetRGBStrokeColor(ctx, 1.0f, 1.0f, 1.0f, 0.5f);
CGContextSetLineWidth(ctx, 16.0f);
CGContextDrawPath(ctx, kCGPathStroke);
CGContextAddEllipseInRect(ctx, CGRectInset(r, 10, 10));
CGContextSetRGBStrokeColor(ctx, 0.7f, 0.0f, 0.0f, 1.0f);
CGContextSetLineWidth(ctx, 4.0f);
CGContextDrawPath(ctx, kCGPathStroke);
// create resulting image
image = CGBitmapContextCreateImage(ctx);
UIImage* newImage = [[[UIImage alloc] initWithCGImage:image] autorelease];
CGImageRelease(image);
CGContextRelease(ctx);
return newImage;
}
To restore to old image, just keep a reference to it.
The cropping thing is not related to the above and you should create a new question for that.
A lot easier solution would be
(UIImage *) modifyImage:(UIImage *)inputImage
{
UIGraphicsBeginImageContext(inputImage.size);
[inputImage drawInRect:CGRectMake(0, 0, inputImage.size.width, inputImage.size.height);
CGContextRef ctx = UIGraphicsGetCurrentContext();
//Drawing code using above context goes here
/*
*
*/
UIImage *outputImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return outputImage;
}
Take a look at Overview of Quartz 2D for information on using Quartz 2D on iPhone.
How can i take an UIImage and give it a black border programmatically?
If i can receive code, it will be great.
tnx
If you only need to display the border you can do that with Core Animation on the UIImageView's layer. If you need to do it on the image itself then you will need to create a new image, draw the old image into the new image and then draw a rect on top of it.
- (UIImage*)imageWithBorderFromImage:(UIImage*)source;
{
CGSize size = [source size];
UIGraphicsBeginImageContext(size);
CGRect rect = CGRectMake(0, 0, size.width, size.height);
[source drawInRect:rect blendMode:kCGBlendModeNormal alpha:1.0];
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetRGBStrokeColor(context, 1.0, 0.5, 1.0, 1.0);
CGContextStrokeRect(context, rect);
UIImage *testImg = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return testImg;
}
This will put a pink border on an image and return the new image.
I'd have a look at this:
Can I Edit the Pixels of the UIImage's Property CGImage
As for the black border part, I assume you can figure that one out. Just iterate along each side and change the pixels to (0,0,0,255) for a certain amount.