Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flip NSImage on both axes

I'm trying to flip an NSImage created with a NSImageBitmapRep representation. After some digging (Flipping Quicktime preview & capture and Mirroring CIImage/NSImage) I tried two ways via a CIImage and applying a scaling transformation with -1 for both factors.

First using CIImage imageByApplyingTransform:

    NSBitmapImageRep *imgRep = ...
    CGImageRef cgi = [imgRep CGImage];
    CIImage *cii = [CIImage imageWithCGImage:cgi];
    CGAffineTransform at = CGAffineTransformTranslate(CGAffineTransformMakeScale(-1, -1), 0, 0);
    NSCIImageRep *ciiRep = [NSCIImageRep imageRepWithCIImage:[cii imageByApplyingTransform:at]];

    NSImage *img = [[[NSImage alloc] init] autorelease];
    [img addRepresentation:ciiRep];
    [self.ivImage setImage:img];

then using a CIAffineTransform filter:

    NSBitmapImageRep *imgRep = ...
    CGImageRef cgi = [imgRep CGImage];
    CIImage *cii = [CIImage imageWithCGImage:cgi];
    CIFilter *f = [CIFilter filterWithName:@"CIAffineTransform"];
    NSAffineTransform *t = [NSAffineTransform transform];
    [t scaleXBy:1.0 yBy:1.0];
    //[t translateXBy:width yBy:0];
    [f setValue:t forKey:@"inputTransform"];
    [f setValue:cii forKey:@"inputImage"];
    CIImage *cii2 = [f valueForKey:@"outputImage"];
    NSCIImageRep *ciiRep = [NSCIImageRep imageRepWithCIImage:cii2];

    NSImage *img = [[[NSImage alloc] init] autorelease];
    [img addRepresentation:ciiRep];
    [self.ivImage setImage:img];

Both ways produce a blank image. I've also tried to translate the image, in case it is out of screen because of the -1 scalings, but to no avail. If I use positive values for scaling I can see that the transformation is applied correctly.

self.ivImage is an NSImageView. I want an actual NSImage which is flipped, so applying a transformation to the NSImageView is not an option.

This is 32bits, Xcode 4.3.2 on Lion.

like image 834
msohn Avatar asked Jun 07 '12 17:06

msohn


4 Answers

You should init your NSImage with a size.

Show your attempt with translation, because that's the right way. Typically, it's easiest to translate first and then scale. Your code snippets seem to have vestigial traces of attempts to translate, but they're not right. You translate by 0,0 in one case and width,0 in another. Also, in your second code snippet, you're scaling by 1,1 (positive), so not flipping.

Also, it may be simpler to simply lock focus on a new image of the appropriate size, set up the transform, and draw the image rep. Avoids all of that stuff with CIImage.

NSBitmapImageRep *imgRep = ...
NSImage* img = [[[NSImage alloc] initWithSize:NSMakeSize(imgRep.pixelsWide, imgRep.pixelsHigh)] autorelease];
[img lockFocus];
NSAffineTransform* t = [NSAffineTransform transform];
[t translateXBy:imgRep.pixelsWide yBy:imgRep.pixelsHigh];
[t scaleXBy:-1 yBy:-1];
[t concat];
[imgRep drawInRect:NSMakeRect(0, 0, imgRep.pixelsWide, imgRep.pixelsHigh)];
[img unlockFocus];
like image 72
Ken Thomases Avatar answered Oct 22 '22 12:10

Ken Thomases


Anyway, I think a good idea should be posting a complete function. Here is my solution based on Ken post

- (NSImage *)flipImage:(NSImage *)image
{
    NSImage *existingImage = image;
    NSSize existingSize = [existingImage size];
    NSSize newSize = NSMakeSize(existingSize.width, existingSize.height);
    NSImage *flipedImage = [[[NSImage alloc] initWithSize:newSize] autorelease];

    [flipedImage lockFocus];
    [[NSGraphicsContext currentContext] setImageInterpolation:NSImageInterpolationHigh];

    NSAffineTransform *t = [NSAffineTransform transform];
    [t translateXBy:existingSize.width yBy:existingSize.height];
    [t scaleXBy:-1 yBy:-1];
    [t concat];

    [existingImage drawAtPoint:NSZeroPoint fromRect:NSMakeRect(0, 0, newSize.width, newSize.height) operation:NSCompositeSourceOver fraction:1.0];

    [flipedImage unlockFocus];

    return flipedImage;
}
like image 21
Alejandro Luengo Avatar answered Oct 22 '22 11:10

Alejandro Luengo


Extension for Swift, based on the solution of Alejandro Lugeno:

extension NSImage {
    func flipped(flipHorizontally: Bool = false, flipVertically: Bool = false) -> NSImage {
        let flippedImage = NSImage(size: size)

        flippedImage.lockFocus()

        NSGraphicsContext.current?.imageInterpolation = .high

        let transform = NSAffineTransform()
        transform.translateX(by: flipHorizontally ? size.width : 0, yBy: flipVertically ? size.height : 0)
        transform.scaleX(by: flipHorizontally ? -1 : 1, yBy: flipVertically ? -1 : 1)
        transform.concat()

        draw(at: .zero, from: NSRect(origin: .zero, size: size), operation: .sourceOver, fraction: 1)

        flippedImage.unlockFocus()

        return flippedImage
    }
}
like image 7
Tamás Sengel Avatar answered Oct 22 '22 10:10

Tamás Sengel


for vertical flip

- (NSImage *)flipImageVertically:(NSImage *)inputImage {

    NSImage *tmpImage;
    NSAffineTransform *transform = [NSAffineTransform transform];

    NSSize dimensions = [inputImage size];
    NSAffineTransformStruct flip = {1.0, 0.0, 0.0, -1.0, 0.0,
        dimensions.height};
    tmpImage = [[NSImage alloc] initWithSize:dimensions];
    [tmpImage lockFocus];
    [transform setTransformStruct:flip];
    [transform concat];
    [inputImage drawAtPoint:NSMakePoint(0,0)
                         fromRect:NSMakeRect(0,0, dimensions.width, dimensions.height)
                        operation:NSCompositeCopy fraction:1.0];
    [tmpImage unlockFocus];


    return [tmpImage autorelease];

}

for horizontal flip

+ (NSImage *)flipImageHorizontally:(NSImage *)inputImage {

    NSImage *tmpImage;
    NSAffineTransform *transform = [NSAffineTransform transform];

    NSSize dimensions = [inputImage size];
    NSAffineTransformStruct flip = {-1.0, 0.0, 0.0, 1.0,
        dimensions.width, 0.0 };
    tmpImage = [[NSImage alloc] initWithSize:dimensions];
    [tmpImage lockFocus];
    [transform setTransformStruct:flip];
    [transform concat];
    [inputImage drawAtPoint:NSMakePoint(0,0)
                         fromRect:NSMakeRect(0,0, dimensions.width, dimensions.height)
                        operation:NSCompositeCopy fraction:1.0];
    [tmpImage unlockFocus];

    return [tmpImage autorelease];

}
like image 4
sanket nagar Avatar answered Oct 22 '22 11:10

sanket nagar