I rotate my image with:
UIImage *image = [UIImage imageNamed:#"doneBtn.png"];
CGImageRef imgRef = image.CGImage;
CGFloat width = CGImageGetWidth(imgRef);
CGFloat height = CGImageGetHeight(imgRef);
CGAffineTransform transform = CGAffineTransformIdentity;
CGRect bounds = CGRectMake(0, 0, width, height);
transform = CGAffineTransformRotate(transform, degreesToRadians(10));
UIGraphicsBeginImageContext(bounds.size);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextConcatCTM(context, transform);
CGContextDrawImage(UIGraphicsGetCurrentContext(), CGRectMake(0,0,width,height), imgRef);
UIImage *imageCopy = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
img.image=imageCopy;
When I display the image, I see it under my 10 degree but the image is cut off on the edges.
Does somebody know how to fix this? Here's an image for clarification.
alt text http://img197.imageshack.us/img197/7077/problemkfr.png
I have been trying all day yesterday, but can't figure it out.
Another example image:
alt text http://img25.imageshack.us/img25/3370/afbeelding6b.png
CODE IN SliderAppViewController.h
#import <UIKit/UIKit.h>
#interface SliderAppViewController : UIViewController {
IBOutlet UIImageView *imgView;
IBOutlet UISlider *mySlider;
}
#property (nonatomic, retain) IBOutlet UISlider *mySlider;
- (IBAction) sliderValueChanged:(id)sender;
#end
CODE IN SliderApp.m
#import "SliderAppViewController.h"
#implementation SliderAppViewController
#synthesize mySlider;
- (IBAction) sliderValueChanged:(UISlider *)sender {
imgView.transform = CGAffineTransformMakeRotation(45);
}
- (void)viewDidLoad {
mySlider.minimumValue = 1.0;
mySlider.maximumValue = 100.0;
//other code
}
then make connection in IB
Your problem here is the anchor of your CALayer, I dont have example code right here with me, but if you play with the anchor property of the view CALayer you should be able to get the view to look like you want. I will try and post some sample code later
I solved it now, i have to change the width/height value of bounds and
the x/y in CGContextDrawImage
CGRect bounds = CGRectMake(0, 0, width+10, height+10);
CGContextDrawImage(UIGraphicsGetCurrentContext(), CGRectMake(10,0,width,height), imgRef);
Related
I am working on App in which i need to give an cropping option. Once i select the image from camera or gallery it should open on editing page where we have Oval image with zooming & moving option. Once we click on apply the captured image should cropped in oval shape.
Now following screen is from aviary sdk. But it has square cropping & in need the cropping in oval shape. I tried to customise it but not able to do so.
Can anyone suggest me the easiest or the best suitable way to implement this.
Thanks.
- (UIImage *)croppedPhoto {
// For dealing with Retina displays as well as non-Retina, we need to check
// the scale factor, if it is available. Note that we use the size of teh cropping Rect
// passed in, and not the size of the view we are taking a screenshot of.
CGRect croppingRect = CGRectMake(imgMaskImage.frame.origin.x,
imgMaskImage.frame.origin.y, imgMaskImage.frame.size.width,
imgMaskImage.frame.size.height);
imgMaskImage.hidden=YES;
if ([[UIScreen mainScreen] respondsToSelector:#selector(scale)]) {
UIGraphicsBeginImageContextWithOptions(croppingRect.size, YES, [UIScreen mainScreen].scale);
} else {
UIGraphicsBeginImageContext(croppingRect.size);
}
// Create a graphics context and translate it the view we want to crop so
// that even in grabbing (0,0), that origin point now represents the actual
// cropping origin desired:
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextTranslateCTM(ctx, -croppingRect.origin.x, -croppingRect.origin.y);
[self.view.layer renderInContext:ctx];
// Retrieve a UIImage from the current image context:
UIImage *snapshotImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
// Return the image in a UIImageView:
return snapshotImage;
}
This type of masking you can perform or else you use the coco controls
.h file:-
#interface yourClass : UIImageView
#end
.m file:-
#import <QuartzCore/QuartzCore.h>
#implementation yourClass
- (void)awakeFromNib
{
[super awakeFromNib];
CALayer *mask = [CALayer layer];
mask.contents = (id)[[UIImage imageNamed:#"ovalMask.png"] CGImage];
CGSize size = self.frame.size;
mask.frame = CGRectMake(0, 0, size.width, size.height);
self.layer.mask = mask;
[self.layer setMasksToBounds:YES];
}
#end
I am trying to make the UIImage object's bounds to be changed depends on the image size. I do not know why the image bounds would not update
#interface AsunaEventViewController ()
#property (weak, nonatomic) IBOutlet UIImageView *AsunaImageView;
#end
#implementation AsunaEventViewController
CGFloat x = self.AsunaImageView.bounds.center.x;
CGFloat y = self.AsunaImageView.bounds.center.y;
if (self.answer == 0){
CGSize imageSize = [[UIImage imageNamed:#"qwr.png"] size];
CGRect imageBounds = CGRectMake(x - imageSize.width/2, y - imageSize.height/2, imageSize.width, imageSize.height);
self.AsunaImageView.frame = imageBounds;
self.AsunaImageView.image = [UIImage imageNamed:#"rts.png"]
Change the image name of the UIImageview
if (self.answer == 0){
CGSize imageSize = [[UIImage imageNamed:#"qwr.png"] size];
CGRect imageBounds = CGRectMake(x - imageSize.width/2, y - imageSize.height/2, imageSize.width, imageSize.height);
self.AsunaImageView.frame = imageBounds;
self.AsunaImageView.image = [UIImage imageNamed:#"qwr.png"];
}
I was wondering if it's possible to "extract" a part of UIImageView.
For example, I select using Warp Affine a part of the UIImageView and I know the selected part frame.
like in this image:
Is it possible to get from the original UIImageView only the selected part without losing quality?
Get the snapshot of the view via category method:
#implementation UIView(Snapshot)
-(UIImage*)makeSnapshot
{
CGRect wholeRect = self.bounds;
UIGraphicsBeginImageContextWithOptions(wholeRect.size, YES, [UIScreen mainScreen].scale);
CGContextRef ctx = UIGraphicsGetCurrentContext();
[[UIColor blackColor] set];
CGContextFillRect(ctx, wholeRect);
[self.layer renderInContext:ctx];
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
}
#end
then crop it to your rect via another category method:
#implementation UIImage(Crop)
-(UIImage*)cropFromRect:(CGRect)fromRect
{
fromRect = CGRectMake(fromRect.origin.x * self.scale,
fromRect.origin.y * self.scale,
fromRect.size.width * self.scale,
fromRect.size.height * self.scale);
CGImageRef imageRef = CGImageCreateWithImageInRect(self.CGImage, fromRect);
UIImage* crop = [UIImage imageWithCGImage:imageRef scale:self.scale orientation:self.imageOrientation];
CGImageRelease(imageRef);
return crop;
}
#end
in your VC:
UIImage* snapshot = [self.imageView makeSnapshot];
UIImage* imageYouNeed = [snapshot cropFromRect:selectedRect];
selectedRect should be in you self.imageView coordinate system, if no so then use
selectedRect = [self.imageView convertRect:selectedRect fromView:...]
Yes, it's possibile.First you should get the UIImageView's image, using this property:
#property(nonatomic, retain) UIImage *image;
And NSImage's :
#property(nonatomic, readonly) CGImageRef CGImage;
Then you get the cut image:
CGImageRef cutImage = CGImageCreateWithImageInRect(yourCGImageRef, CGRectMake(x, y, w, h));
If you want again a UIImage you should use this UIImage's method:
+ (UIImage *)imageWithCGImage:(CGImageRef)cgImage;
PS: I don't know how to do it directly, without convert it to CGImageRef, maybe there's a way.
does anybody know what to do with this problem: my image in a custom MKPolygonView is flipped upside down?
The idea (this is working OK already) is having an class "SnowmapsOverlayView" that extends "MKPolygonView", that displays a image. This image has a default location & size on the map (acts as a GroundOverlay in the Google Maps web API). This is all working fine, but the image is displayed upside down. I've tryed the following options, but with no result:
CGContextDrawImage draws image upside down when passed UIImage.CGImage
Thanks for any help or suggestions!
My code:
#import <MapKit/MapKit.h>
#interface SnowmapsOverlayView : MKPolygonView
{
}
#end
-----------------
#import "SnowmapsOverlayView.h"
#implementation SnowmapsOverlayView
-(id)initWithPolygon:(MKPolygon *)polygon
{
self = [super initWithPolygon:polygon];
return self;
}
-(void)drawMapRect:(MKMapRect)mapRect zoomScale:(MKZoomScale)zoomScale inContext:(CGContextRef)context
{
UIImage *image = [UIImage imageNamed:#"snowmap.png"];
//This should do the trick, but is doesn't.. maybe a problem with the "context"?
//CGRect imageRect = CGRectMake(0, 0, image.size.width, image.size.height);
//CGContextTranslateCTM(context, 0, image.size.height);
//CGContextScaleCTM(context, 1.0, -1.0);
CGRect overallCGRect = [self rectForMapRect:self.overlay.boundingMapRect];
CGContextDrawImage(context, overallCGRect, image.CGImage);
}
-(BOOL)canDrawMapRect:(MKMapRect)mapRect zoomScale:(MKZoomScale)zoomScale
{
return YES;
}
Fixed! This is the code that gets the job done:
-(void)drawMapRect:(MKMapRect)mapRect zoomScale:(MKZoomScale)zoomScale inContext:(CGContextRef)context
{
UIImage *image = [UIImage imageNamed:#"snowmap.png"];
MKMapRect theMapRect = [self.overlay boundingMapRect];
CGRect theRect = [self rectForMapRect:theMapRect];
UIGraphicsPushContext(context);
[image drawInRect:theRect blendMode:kCGBlendModeNormal alpha:1.0];
UIGraphicsPopContext();
}
Have you tried subclassing MKOverlayView instead of MKPolygonView? The polygon class may do something weird to its coordinate system.
I would like to write a UIView subclass that, among other things, colors whatever's underneath it a certain color. This is what I've come up with, but it unfortunately doesn't seem to work correctly:
#import <UIKit/UIKit.h>
#class MyOtherView;
#interface MyView : UIView
{
MyOtherView *subview;
}
#end
#implementation MyView
- (id)initWithFrame:(CGRect)frame
{
if (self = [super initWithFrame:frame]) {
frame.origin.x += 100.0;
frame.origin.y += 100.0;
frame.size.width = frame.size.height = 200.0;
subview = [[MyOtherView alloc] initWithFrame:frame];
[self addSubview:subview];
[subview release];
}
return self;
}
- (void)drawRect:(CGRect)rect
{
// Draw a background to test out on
UIImage *image = [UIImage imageNamed:#"somepic.png"];
[image drawAtPoint:rect.origin];
const CGContextRef ctx = UIGraphicsGetCurrentContext();
[[UIColor blueColor] setFill];
rect.size.width = rect.size.height = 200.0;
CGContextFillRect(ctx, rect);
}
#end
#interface MyOtherView : UIView
#end
#implementation MyOtherView
- (void)drawRect:(CGRect)rect
{
// This should tint "MyView" but it doesn't.
const CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextSaveGState(ctx);
CGContextSetBlendMode(ctx, kCGBlendModeScreen);
[[UIColor redColor] setFill];
CGContextFillRect(ctx, rect);
CGContextRestoreGState(ctx);
}
#end
I want "MyOtherView" to color "MyView" red where it overlaps, but instead it just draws an opaque red block onto it. However, this seems work fine if I copy the -drawRect: function from "MyOtherView" and append it to the one in "MyView" (this took me quite a headache to finally realize). Anyone know what I'm doing wrong? Is it even possible to do this, or should I be approaching it differently?
I think you're over-thinking this. Overlay one view over the other, and set the alpha of the top view to 0.5. You will also need to set opaque to NO.
If you set the background color of the view appropriately, you won't even need to override drawRect.
Might want to check out this SO question.