Обрезка изображения в форме наложения - iOS

Question

Я добавляю наложение, используя представление pickerController и uinavigationcontrollerdelegate, как показано ниже.

-(void)navigationController:(UINavigationController *)navigationController didShowViewController: (UIViewController *)viewController animated:(BOOL)animated{ 
    if ([navigationController.viewControllers count] == 3) 
    { 
     CGFloat screenHeight = [[UIScreen mainScreen] bounds].size.height; 

     UIView *plCropOverlay = [[[viewController.view.subviews objectAtIndex:1]subviews] objectAtIndex:0]; 

     plCropOverlay.hidden = YES; 

     int position = 0; 

     if (screenHeight == 568) 
     { 
      position = 124; 
     } 
     else 
     { 
      position = 80; 
     } 

     CAShapeLayer *circleLayer = [CAShapeLayer layer]; 

     UIBezierPath *path2 = [UIBezierPath bezierPathWithOvalInRect: 
          CGRectMake(0.0f, position, 320.0f, 320.0f)]; 
     [path2 setUsesEvenOddFillRule:YES]; 

     [circleLayer setPath:[path2 CGPath]]; 

     [circleLayer setFillColor:[[UIColor clearColor] CGColor]]; 
     UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 320, screenHeight-72) cornerRadius:0]; 

     [path appendPath:path2]; 
     [path setUsesEvenOddFillRule:YES]; 

     CAShapeLayer *fillLayer = [CAShapeLayer layer]; 
     fillLayer.path = path.CGPath; 
     fillLayer.fillRule = kCAFillRuleEvenOdd; 
     fillLayer.fillColor = [UIColor blackColor].CGColor; 
     fillLayer.opacity = 0.8; 
     [viewController.view.layer addSublayer:fillLayer]; 

    } 
} 

Когда наложение определено выше добавляется, я, как правило, чтобы получить эту точку зрения:

Я могу обрезать изображение точно в квадрат, используя определенную CGRect.

CGImageRef imageRef = CGImageCreateWithImageInRect([imageToCrop CGImage], rect); 

    UIImage *cropped = [UIImage imageWithCGImage:imageRef]; 
    CGImageRelease(imageRef); 

Как насчет того, чтобы подойти к этой проблеме, когда есть свойство кругового наложения и изображения? Я могу увеличить масштаб и уменьшить масштаб изображения. Как я могу использовать BezierPath здесь?

Answer 1

короткий ответ на ваш вопрос addClip, но вы упомянули, что вы новичок, так что вот все шаги от А до Я !!

Во-первых, попробуйте эту категорию, посмотрите, поможет ли она. (Если вы не знакомы ж/категории имеют www.google.com или просто спросите здесь в комментариях.)

-(UIImage *)doMask 
    { 
    UIImage *maskImage = [UIImage imageNamed:@"yourMask.png"]; 

    CGImageRef maskRef = maskImage.CGImage; 

    CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef), 
     CGImageGetHeight(maskRef), 
     CGImageGetBitsPerComponent(maskRef), 
     CGImageGetBitsPerPixel(maskRef), 
     CGImageGetBytesPerRow(maskRef), 
     CGImageGetDataProvider(maskRef), NULL, false); 

    CGImageRef maskedImageRef = CGImageCreateWithMask([self CGImage], mask); 
    UIImage *maskedImage = [UIImage imageWithCGImage:maskedImageRef]; 

    CGImageRelease(mask); 
    CGImageRelease(maskedImageRef); 

    return maskedImage; 
    } 

просто создать (я имею в виду в Photoshop) в формате PNG маски, и ознакомиться с этим процессом.

Я рекомендую вам освоить этот процесс первый ...

Вот критические категории, которые помогут ...

-(UIImage *)becomeSquare 
    { 
    CGSize imageSize = self.size; 
    CGFloat width = imageSize.width; 
    CGFloat height = imageSize.height; 

    UIImage *result = self; 

    if (width != height) 
     { 
     CGFloat newDimension = MIN(width, height); 
     CGFloat widthOffset = (width - newDimension)/2; 
     CGFloat heightOffset = (height - newDimension)/2; 

     UIGraphicsBeginImageContextWithOptions(
      CGSizeMake(newDimension, newDimension), NO, 0.); 

     [result drawAtPoint:CGPointMake(-widthOffset, -heightOffset) 
      blendMode:kCGBlendModeCopy alpha:1. ]; 
     result = UIGraphicsGetImageFromCurrentImageContext(); 
     UIGraphicsEndImageContext(); 
     } 

    return result; 
    } 

и еще пара ...

-(UIImage *)doScale 
    { 
    UIImage *result = self; 

    CGSize size = CGSizeMake(320,320); 
    UIGraphicsBeginImageContextWithOptions(size, NO, 0.0f); 
    [result drawInRect:CGRectMake(0.0f, 0.0f, size.width, size.height)]; 
    result = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 
    return result; 
    } 

-(UIImage *)scaled640AnyShape 
    { 
    if (self.size.height < 5.0) return nil; 
    if (self.size.width < 5.0) return nil; 

    UIImage *result = self; 

    float widthShouldBe = 640.0; 
    float heightShouldBe = widthShouldBe * (self.size.height/self.size.width); 

    CGSize size = CGSizeMake(widthShouldBe ,heightShouldBe); 

    UIGraphicsBeginImageContextWithOptions(size, NO, 0.0f); 
    [result drawInRect:CGRectMake(0.0f, 0.0f, size.width, size.height)]; 
    result = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 
    return result; 
    } 

(очевидно, измените размеры жестко заданных размеров, как вы пожелаете.)

Обратите внимание, что ваш окончательный результат т, будет достигаться путем сочетания в соответствующем порядке, например:

yourImage = [yourImage doSquare]; 
yourImage = [yourImage doMask]; 

как только вы получили, что работа ...

Тогда ....

для буквально то, вы спросите, есть много примеров кодов примерно .. например, как насчет https://stackoverflow.com/a/13870097/294884

Как вы можете видеть, вы в корне ...

UIGraphicsBeginImageContextWithOptions(...); 
UIBezierPath * path = [UIBezierPath 
    bezierPathWithRoundedRect:imageRect cornerRadius:10.f]; 
[path addClip]; 
[yourImage drawInRect:imageRect]; 
... then ... UIGraphicsGetImageFromCurrentImageContext(); 
.. see the extensive code above for how to save it and so on. 

Вам нужно только увеличить масштаб с помощью примеров масштабирования выше.

внимание Также в этом, когда вы изменяете «область обрезана» ... https://stackoverflow.com/a/17884863/294884

вот пример этой критической техники ...

-(UIImage *)squareAndSmall 
    { 
    // genius credits: https://stackoverflow.com/a/17884863/294884 

    CGSize finalsize = CGSizeMake(640,640); 

    CGFloat scale = MAX(
     finalsize.width/self.size.width, 
     finalsize.height/self.size.height); 
    CGFloat width = self.size.width * scale; 
    CGFloat height = self.size.height * scale; 

    // for example, the central area.... 
    CGRect imageRect = CGRectMake(
        (finalsize.width - width)/2.0f, 
        (finalsize.height - height)/2.0f, 
        width, height); 

    // or, the top area... CGRect imageRect = CGRectMake(0, 0, width, height); 

    UIGraphicsBeginImageContextWithOptions(finalsize, NO, 0); 
    [self drawInRect:imageRect]; 
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();  
    UIGraphicsEndImageContext(); 
    return newImage; 
    } 

Надежда все это помогает!

Answer 2

У меня есть точно такой же контроллер выбора изображения для профиля как ваш. Вот мой код от делегата. Я не думаю, что вам нужно все, но вы можете найти полезную информацию здесь

-(void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info 
{ 
    NSString *mediaType = info[UIImagePickerControllerMediaType]; 

    if([mediaType isEqualToString:(NSString *) kUTTypeImage]) { 

     UIImage *image = info[UIImagePickerControllerOriginalImage]; 
     UIImage *editedImage = (UIImage *) [info objectForKey:UIImagePickerControllerEditedImage]; 
     CGRect croppingRect = [info[UIImagePickerControllerCropRect] CGRectValue]; 

     if (editedImage) { 
      image = editedImage; 
     } else { 
      CGFloat smaller = 1; 
      if (SYSTEM_VERSION_GREATER_THAN_OR_EQUAL_TO(@"7.0")) { 
       smaller = 0.9; 
      } 

      CGFloat width = MIN(image.size.width * smaller, image.size.height * (smaller * 0.95)); 
      croppingRect = CGRectMake(0 + (image.size.width - width)/2, 
             0 + (image.size.height - width)/2, 
             width, width); 
     } 

     UIImage *finalImage = nil; 
     if (editedImage) { 
      finalImage = [UIImage image:editedImage byScalingAndCroppingForSize:kCroppedImageSize]; 
     } else { 
      finalImage = [UIImage image:image byScalingAndCroppingForSize:kCroppedImageSize]; 
     } 

     if ([self.imagePickerDelegate respondsToSelector:@selector(profileImagePicker:didSelectImage:)]) { 
      [self.imagePickerDelegate profileImagePicker:self didSelectImage:finalImage]; 
     } else { 
      NSAssert(nil, @"Delegate should confirm ProfileImagePickerControllerDelegate protocol"); 
     } 

    } else if ([mediaType isEqualToString:(NSString *) kUTTypeVideo]) { 
     NSAssert(nil, @"Movie is not supported"); 
    } 
} 

Answer 3

Нашел blog post запись очень интересно, аккуратный и просто следовать по Nimit Parekh.

После код копировать/вставить в файл «viewcontroller.h»:

#import <UIKit/UIKit.h> 

@interface UIImagePickerDemoViewController : UIViewController< UIImagePickerControllerDelegate, UINavigationControllerDelegate> 

@property(nonatomic,retain) UIImagePickerController *imgPicker; 
@property(nonatomic,retain) IBOutlet UIImageView *image_view; 

//- (UIImage*)imageByCropping:(UIImage *)imageToCrop toRect:(CGRect)rect; 
- (UIImage*) maskImage:(UIImage *)image withMask:(UIImage *)maskImage; 
@end 

Следующий код копировать/вставить в файл «viewcontroller.m»:

// Following method is use for the mask the image. 

- (UIImage*) maskImage:(UIImage *)image withMask:(UIImage *)maskImage { 

    CGImageRef maskRef = maskImage.CGImage; 

    CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef), 
             CGImageGetHeight(maskRef), 
             CGImageGetBitsPerComponent(maskRef), 
             CGImageGetBitsPerPixel(maskRef), 
             CGImageGetBytesPerRow(maskRef), 
             CGImageGetDataProvider(maskRef), NULL, false); 

    CGImageRef masked = CGImageCreateWithMask([image CGImage], mask); 
    return [UIImage imageWithCGImage:masked]; 
} 

// Following method is use for Cropping the image for a perticular size. 

- (UIImage*)imageByCropping:(UIImage *)imageToCrop toRect:(CGRect)rect 
{ 
    UIGraphicsBeginImageContext(rect.size); 
    CGContextRef currentContext = UIGraphicsGetCurrentContext(); 

    CGContextTranslateCTM(currentContext, 0.0, rect.size.height); 
    CGContextScaleCTM(currentContext, 1.0, -1.0); 

    CGRect clippedRect = CGRectMake(0, 0, rect.size.width, rect.size.height); 
    CGContextClipToRect(currentContext, clippedRect); 
    CGRect drawRect = CGRectMake(rect.origin.x * -1,rect.origin.y * -1,imageToCrop.size.width,imageToCrop.size.height); 
    CGContextDrawImage(currentContext, drawRect, imageToCrop.CGImage); 
    CGContextScaleCTM(currentContext, 1.0, -1.0); 

    UIImage *cropped = UIGraphicsGetImageFromCurrentImageContext(); 
    UIGraphicsEndImageContext(); 
    return cropped; 
} 

// Calling the method of maskimage. 

//=============================Camera Enable(display)============================================ 
-(IBAction)next:(id)sender{ 

    if ([UIImagePickerController isSourceTypeAvailable:UIImagePickerControllerSourceTypeCamera]) { 
     self.imgPicker.sourceType = UIImagePickerControllerSourceTypeCamera; 
    } 
    [self presentModalViewController:self.imgPicker animated:YES]; 
} 

-(void)imagePickerControllerDidCancel:(UIImagePickerController *)picker{ 
    [picker dismissModalViewControllerAnimated:YES]; 
} 

- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info { 
    [picker dismissModalViewControllerAnimated:YES]; 
    UIImage *img = [info objectForKey:@"UIImagePickerControllerOriginalImage"]; 
     self.image_view.image=[self maskImage:img withMask:[UIImage imageNamed:@"frame.png"]]; 
} 
//=============================================================================================== 

// Calling the method of cropping the image. 

//=============================Camera Enable(display)============================================ 
-(IBAction)next:(id)sender{ 

    if ([UIImagePickerController isSourceTypeAvailable:UIImagePickerControllerSourceTypeCamera]) { 
     self.imgPicker.sourceType = UIImagePickerControllerSourceTypeCamera; 
    } 
    [self presentModalViewController:self.imgPicker animated:YES]; 
} 

-(void)imagePickerControllerDidCancel:(UIImagePickerController *)picker{ 
    [picker dismissModalViewControllerAnimated:YES]; 
} 

- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info { 
    [picker dismissModalViewControllerAnimated:YES]; 
    UIImage *img = [info objectForKey:@"UIImagePickerControllerOriginalImage"]; 
    self.image_view.image = [self imageByCropping:img toRect:CGRectMake(0, 0, 420, 40)]; 
} 
//=============================================================================================== 

Выход:

Grab the source code here.