¿Cómo acercar / alejar un objeto de UIImage cuando el usuario pellizca la pantalla?

Me gustaría acercar / alejar un objeto UIImage cuando el usuario realiza la acción de pellizcar estándar en mi aplicación. Actualmente estoy usando un UIImageView para mostrar mi imagen, si ese detalle ayuda de alguna manera.

Estoy tratando de averiguar cómo hacer esto, pero no he tenido tanta suerte hasta ahora.

¿Alguna pista?

Otra forma fácil de hacer esto es colocar su UIImageViewdentro de un UIScrollView. Como describo aquí , debe configurar el contentSize de la vista de desplazamiento para que sea el mismo que su UIImageView'stamaño. Configure la instancia de su controlador para que sea la delegada de la vista de desplazamiento e implemente los métodos viewForZoomingInScrollView:y scrollViewDidEndZooming:withView:atScale:para permitir el zoom y la panorámica de la imagen. Esto es efectivamente lo que hace la solución de Ben, solo que de una manera un poco más liviana, ya que no tiene la sobrecarga de una vista web completa.

Un problema con el que puede encontrarse es que la escala dentro de la vista de desplazamiento se presenta en forma de transformaciones aplicadas a la imagen. Esto puede provocar imágenes borrosas con factores de zoom altos. Para algo que se pueda volver a dibujar, puede seguir mis sugerencias aquí para proporcionar una pantalla más nítida después de que finalice el gesto de pellizcar. La solución de hniels podría usarse en ese momento para cambiar la escala de su imagen.

Como otros describieron, la solución más fácil es poner su UIImageView en un UIScrollView. Hice esto en el archivo .xib de Interface Builder.

En viewDidLoad, establezca las siguientes variables. Configure su controlador para que sea un UIScrollViewDelegate.

- (void)viewDidLoad {
    [super viewDidLoad];
    self.scrollView.minimumZoomScale = 0.5;
    self.scrollView.maximumZoomScale = 6.0;
    self.scrollView.contentSize = self.imageView.frame.size;
    self.scrollView.delegate = self;
}

Debe implementar el siguiente método para devolver el imageView que desea ampliar.

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    return self.imageView;
}

En versiones anteriores a iOS9, es posible que también deba agregar este método de delegado vacío:

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale
{
}

La Documentación de Apple hace un buen trabajo al describir cómo hacer esto:

La solución de Shefali para UIImageView funciona muy bien, pero necesita una pequeña modificación:

- (void)pinch:(UIPinchGestureRecognizer *)gesture {
    if (gesture.state == UIGestureRecognizerStateEnded
        || gesture.state == UIGestureRecognizerStateChanged) {
        NSLog(@"gesture.scale = %f", gesture.scale);

        CGFloat currentScale = self.frame.size.width / self.bounds.size.width;
        CGFloat newScale = currentScale * gesture.scale;

        if (newScale < MINIMUM_SCALE) {
            newScale = MINIMUM_SCALE;
        }
        if (newScale > MAXIMUM_SCALE) {
            newScale = MAXIMUM_SCALE;
        }

        CGAffineTransform transform = CGAffineTransformMakeScale(newScale, newScale);
        self.transform = transform;
        gesture.scale = 1;
    }
}

(La solución de Shefali tenía la desventaja de que no escalaba continuamente mientras se pellizcaba. Además, al comenzar una nueva pizca, se restablecía la escala de imagen actual).

El siguiente código ayuda a hacer zoom en UIImageView sin usar UIScrollView:

-(void)HandlePinch:(UIPinchGestureRecognizer*)recognizer{
    if ([recognizer state] == UIGestureRecognizerStateEnded) {
        NSLog(@"======== Scale Applied ===========");
        if ([recognizer scale]<1.0f) {
            [recognizer setScale:1.0f];
        }
        CGAffineTransform transform = CGAffineTransformMakeScale([recognizer scale],  [recognizer scale]);
        imgView.transform = transform;
    }
}

Tenga en cuenta que NUNCA está haciendo zoom en un UIImage. SIEMPRE.

En su lugar, está acercando y alejando el viewque muestra el UIImage.

En este caso particular, puede optar por crear un UIViewdibujo personalizado con un dibujo personalizado para mostrar la imagen, uno UIImageViewque muestre la imagen para usted, o UIWebViewque necesitará algo de HTML adicional para respaldarlo.

En todos los casos, deberá implementar touchesBegan, touchesMovedy similares para determinar qué está tratando de hacer el usuario (zoom, panorámica, etc.).

Aquí hay una solución que he usado antes que no requiere que use UIWebView.

- (UIImage *)scaleAndRotateImage(UIImage *)image
{
    int kMaxResolution = 320; // Or whatever

    CGImageRef imgRef = image.CGImage;

    CGFloat width = CGImageGetWidth(imgRef);
    CGFloat height = CGImageGetHeight(imgRef);


    CGAffineTransform transform = CGAffineTransformIdentity;
    CGRect bounds = CGRectMake(0, 0, width, height);
    if (width > kMaxResolution || height > kMaxResolution) {
        CGFloat ratio = width/height;
        if (ratio > 1) {
            bounds.size.width = kMaxResolution;
            bounds.size.height = bounds.size.width / ratio;
        }
        else {
            bounds.size.height = kMaxResolution;
            bounds.size.width = bounds.size.height * ratio;
        }
    }

    CGFloat scaleRatio = bounds.size.width / width;
    CGSize imageSize = CGSizeMake(CGImageGetWidth(imgRef), CGImageGetHeight(imgRef));
    CGFloat boundHeight;
    UIImageOrientation orient = image.imageOrientation;
    switch(orient) {

        case UIImageOrientationUp: //EXIF = 1
            transform = CGAffineTransformIdentity;
            break;

        case UIImageOrientationUpMirrored: //EXIF = 2
            transform = CGAffineTransformMakeTranslation(imageSize.width, 0.0);
            transform = CGAffineTransformScale(transform, -1.0, 1.0);
            break;

        case UIImageOrientationDown: //EXIF = 3
            transform = CGAffineTransformMakeTranslation(imageSize.width, imageSize.height);
            transform = CGAffineTransformRotate(transform, M_PI);
            break;

        case UIImageOrientationDownMirrored: //EXIF = 4
            transform = CGAffineTransformMakeTranslation(0.0, imageSize.height);
            transform = CGAffineTransformScale(transform, 1.0, -1.0);
            break;

        case UIImageOrientationLeftMirrored: //EXIF = 5
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeTranslation(imageSize.height, imageSize.width);
            transform = CGAffineTransformScale(transform, -1.0, 1.0);
            transform = CGAffineTransformRotate(transform, 3.0 * M_PI / 2.0);
            break;

        case UIImageOrientationLeft: //EXIF = 6
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeTranslation(0.0, imageSize.width);
            transform = CGAffineTransformRotate(transform, 3.0 * M_PI / 2.0);
            break;

        case UIImageOrientationRightMirrored: //EXIF = 7
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeScale(-1.0, 1.0);
            transform = CGAffineTransformRotate(transform, M_PI / 2.0);
            break;

        case UIImageOrientationRight: //EXIF = 8
            boundHeight = bounds.size.height;
            bounds.size.height = bounds.size.width;
            bounds.size.width = boundHeight;
            transform = CGAffineTransformMakeTranslation(imageSize.height, 0.0);
            transform = CGAffineTransformRotate(transform, M_PI / 2.0);
            break;

        default:
            [NSException raise:NSInternalInconsistencyException format:@"Invalid image orientation"];

    }

    UIGraphicsBeginImageContext(bounds.size);

    CGContextRef context = UIGraphicsGetCurrentContext();

    if (orient == UIImageOrientationRight || orient == UIImageOrientationLeft) {
        CGContextScaleCTM(context, -scaleRatio, scaleRatio);
        CGContextTranslateCTM(context, -height, 0);
    }
    else {
        CGContextScaleCTM(context, scaleRatio, -scaleRatio);
        CGContextTranslateCTM(context, 0, -height);
    }

    CGContextConcatCTM(context, transform);

    CGContextDrawImage(UIGraphicsGetCurrentContext(), CGRectMake(0, 0, width, height), imgRef);
    UIImage *imageCopy = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return imageCopy;
}

El artículo se puede encontrar en Soporte de Apple en: http://discussions.apple.com/message.jspa?messageID=7276709#7276709

Las respuestas de Shafali y JRV se ampliaron para incluir la panorámica y pellizcar para hacer zoom:

#define MINIMUM_SCALE 0.5
#define MAXIMUM_SCALE 6.0
@property CGPoint translation;


- (void)pan:(UIPanGestureRecognizer *)gesture {
    static CGPoint currentTranslation;
    static CGFloat currentScale = 0;
    if (gesture.state == UIGestureRecognizerStateBegan) {
        currentTranslation = _translation;
        currentScale = self.view.frame.size.width / self.view.bounds.size.width;
    }
    if (gesture.state == UIGestureRecognizerStateEnded || gesture.state == UIGestureRecognizerStateChanged) {

        CGPoint translation = [gesture translationInView:self.view];

        _translation.x = translation.x + currentTranslation.x;
        _translation.y = translation.y + currentTranslation.y;
        CGAffineTransform transform1 = CGAffineTransformMakeTranslation(_translation.x , _translation.y);
        CGAffineTransform transform2 = CGAffineTransformMakeScale(currentScale, currentScale);
        CGAffineTransform transform = CGAffineTransformConcat(transform1, transform2);
        self.view.transform = transform;
    }
}


- (void)pinch:(UIPinchGestureRecognizer *)gesture {
    if (gesture.state == UIGestureRecognizerStateEnded || gesture.state == UIGestureRecognizerStateChanged) {
//        NSLog(@"gesture.scale = %f", gesture.scale);

        CGFloat currentScale = self.view.frame.size.width / self.view.bounds.size.width;
        CGFloat newScale = currentScale * gesture.scale;

        if (newScale < MINIMUM_SCALE) {
            newScale = MINIMUM_SCALE;
        }
        if (newScale > MAXIMUM_SCALE) {
            newScale = MAXIMUM_SCALE;
        }

        CGAffineTransform transform1 = CGAffineTransformMakeTranslation(_translation.x, _translation.y);
        CGAffineTransform transform2 = CGAffineTransformMakeScale(newScale, newScale);
        CGAffineTransform transform = CGAffineTransformConcat(transform1, transform2);
        self.view.transform = transform;
        gesture.scale = 1;
    }
}

La forma más sencilla de hacer esto, si todo lo que desea es hacer zoom, es colocar su imagen dentro de un UIWebView(escriba una pequeña cantidad de código de envoltura html, haga referencia a su imagen y básicamente ya está). La forma más completa de hacer esto es usar touchesBegan, touchesMovedy touchesEndedrealizar un seguimiento de los dedos del usuario y ajustar la propiedad de transformación de la vista de manera adecuada.

Tenga en cuenta que no desea acercar / alejar UIImage. En su lugar, intente acercar / alejar la vista que contiene el controlador de vista UIImage.

He creado una solución para este problema. Eche un vistazo a mi código:

@IBAction func scaleImage(sender: UIPinchGestureRecognizer) {
        self.view.transform = CGAffineTransformScale(self.view.transform, sender.scale, sender.scale)
        sender.scale = 1
    }
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        view.backgroundColor = UIColor.blackColor()
    }

NB: No olvide conectar PinchGestureRecognizer.