i want to crop image via drawing circle using touchMoved event.
so how can i find the circle point in CGRect .
i have to just pass that cgrect to cropping function.
Pls Help me for drawing the circle on image and find the CGRect
Thanks
I'm not sure that I completely understand your question. I will make some assumptions:
I assume you want to display a circular region of an image, with the image cropped to only display its content within that circle; and
I assume you will be moving this circle around as the user moves his/her finger.
I will assume the non-cropped area is a solid color.
For this case, I would recommend creating a transparent png image file with a circle of transparency, and the solid background color everywhere else. You can put this in a drag-and-drop-able UIView subclass, and when the user moves his/her finger around, it will appear as if the image is being cropped in a circle that moves with their finger.
Here's how to make a UIView subclass work with drag-and-drop:
http://bynomial.com/blog/?p=77
If you need more sophisticated behavior, such as a non-solid-color background, then you could consider using an image mask with your view's CALayer property. This would be more work, because you'd have to modify the mask every time the user moved their finger. Another option would be to set the CALayer to have rounded corners (the cornerRadius property), set clipsToBounds=YES, and then move that around appropriately when the user moves their finger.
Reference for some CALayer properties, to get a sense of the cornerRadius approach (set the cornerRadius = half the width of the view, and it will be a circle):
http://bynomial.com/blog/?p=52
Related
Is it possible for a user to draw a dotted line (in a circle) around the bit of the UIImageView they wish to crop to, and then for the UIImageView to resize to those points? It's a bit like the lasso/marquee effect in Photoshop:
Update: Since iOS 8.x, UIImageView provides a maskView property. Just prepare an image with some opaque pixels, create another image view with that mask image, and set this mask image view as the maskView. The opaque pixels in the mask image will be the ones shown in the underlying image.
UIImageView *maskView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:#"somemask"]];
maskView.frame = imageView.bounds;
imageView.maskView = maskView;
// imageView will be masked by maskView
.
Original Answer
There's quite a bit to do, but here's a high-level outline:
create an empty image which will become a mask
build a path in that image from user input
fill the path to turn it into a mask
apply the mask to the imageview's image
Create image: A simple idea here is to just ship a black image with your project. It should be sized to match the maximum region a user can select. Read the image into memory (UIImage imageNamed:) and set it up as the drawing context by calling UIGraphicsBeginImageContext.
Create path: (see apple docs). When the user starts stroking the region, call CGContextBeginPath, then follow user gestures, sampling the touches and adding small segments by calling CGContextMoveToPoint repeatedly as touchesMoved.
Create mask: To turn the path into a mask you want a black background and the path filled with white. If you started with a black image, you just need to do the fill. See the same apple guide about doing that.
Finally, you'll apply this mask to your imageView's image. Here's a decent reference for that.
This answers just one part of your question i suppose, but here's an example on how to draw and animate the dotted line (i.e. marching ants effect).
I have to make view where there will be multiple curved or irregular shaped imageview. Now when i will touch a UIImageview then it will import image from photo gallery.For example: Suppose
I have an UIView with background image.
On that view i have 3 irregular shaped UIImageview.every UIImageview is attached with each other.
Now suppose i have touch in the first UIImageview then it will take an image from photo gallery.
When i have imported the image then that image will be as the background image of the UIImageview.
I have to make sure that if my UIImageviewis smaller then its background image then i will able to move the image or rotate the image or scale or zoom the image to adjust the image according to the size of UIImageview.
How can i do that whole process??? any help by link,source code,tutorial or anything else will be cordially appreciable.
Basically my first priority is that how can i make those irregular shaped UIImageView pro-grammatically.
IF ANY FURTHER QUERY TO ASK THEN PLEASE DON'T HESITATE.
Thanks In Advance
The one way of doing this is as follows:
Subclass from UIImageView set touchesBegan methods for each UIImageView for import image, setting on background and whatever you want to do on touch.
What does 'attached' mean? If all of them should move together, then, again, you have to deal with it in touchesBegan methods, sending messages like 'Hey views, i've moved on this vector:[vector], please do it too'.
In pt. 3.2 i didn't get your point. :( You can set in UIImageView subclass self.contentMode = UIViewContentModeScaleAspectFit or UIViewContentModeScaleToFill, so its image will always fit the view.
About irregular shape, did you read links below? I suppose there's not an super easy way to do it :(
http://www.iphonedevsdk.com/forum/iphone-sdk-development/76923-hittest-collision-for-irregular-shaped-uiviews.html
Draggable UIImageView Partially Transparent & Irregular Shaped
Simple way of using irregular shaped buttons
Anyone who has gone through the Stanford CS193P class on iTunes will recognize this from Assignment 3 (HelloPoly). For those not familiar:
I have a custom view called polyView, an instance of PolygonView, a subclass of UIView. On this view, I use CGContextDrawLinearGradient to paint a color gradient over the entire rectangular view. Then I use CGContextDrawPath to stroke and fill a polygon within the bounds of polyView. And I have a UILabel called nameLabel in the center of the view (and polygon) that displays the name of the polygon (triangle, quadrilateral, pentagon, etc.). All of this works fine, and the code to do all this is in the -(void)drawRect method of the PolygonView class.
Where I ran into trouble is with an additional requirement to rotate the polygon within the view in response to user gestures. I used CGAffineTransformRotate() in response to touchesBegan() and touchesMoved() events within the PolygonView class, and this basically works, too. But I can only rotate the entire polyView, not just the polygon drawn on it. I'm sure I could go back and recalculate the path of the polygon and redraw/fill the path in response to each touchesMoved() event, but that would be expensive and can't be the best method. How can I use CGAffineTransformRotate to rotate just the polygon, without rotating the gradient-filled view or the label in the center?
Or is there some way to create the polygon on a layer that I can place over the background polyView at the desired rotation angle?
Thanks for any help you can give a beginner here!
Duane
You can do a CGContextSaveGState(...) just before doing the rotation transformation, then drawing the polygon and restoring the drawing state with a CGContextRestoreGState(...) afterwards, so as not to affect any other drawing in the view later.
The following code:
http://pastie.org/pastes/835022
in a custom UIView rotates the entire view including the gradient background.
What is the proper way to rotate the polygon without rotating the background?
I'd separate your gradient from your polygon. Create a gradient layer for the gradient. Put your polygon drawing into the content layer. That should let your polygon be rotated without affecting the background.
I'm drawing three rectangles, one of which falls off the end of the view, (i.e. the drawing is bigger than the current view bounds) so you don't see the right edge. This is good, but when the view is rotated, the right edge is still clipped, even though there's plenty of room to draw it. How can I get the view to redraw the full rectangle?
I've tried:
1) changing the frame and bounds rectangles to bigger
2) calling setNeedsLayout
3) calling setContentMode:UIViewContentModeRedraw;
4) calling [self.view setClipsToBounds:NO]
Trying a CGLayer is next, unless somebody suggests something else.
-Owen
Make sure your autoresizing mask on this layer is set properly in IB. If its not stretching the right way on rotation then the view will not take the new shape of the screen.