How to scale up an UIImage without smoothening anything?

Question

I want to scale up an UIImage in such a way, that the user can see the pixels in the UIImage very sharp. When I put that to an UIImageView and scale the transform matrix up, the UIImage appears antialiased and smoothed.

Is there a way to render in a bigger bitmap context by simply repeating every row and every column to get bigger pixels? How could I do that?

What is your scale factor? Keep in mind that only for x2, x3, x4 etc. you can expect to get "sharp" results. — Eiko, Oct 10 '10 at 13:38
Note that this method is known as nearest neighbor interpolation. — BoltClock, Oct 10 '10 at 13:41

Peter DeWeese · Accepted Answer · 2013-12-19T20:05:07.627

24

#import <QuartzCore/CALayer.h>

view.layer.magnificationFilter = kCAFilterNearest

edited Dec 19 '13 at 20:05

answered Oct 10 '10 at 14:34

Peter DeWeese

18,141
8
79
101

3

Note that this doesn't work if you created the UIImage for the UIImageView with [UIImage imageWithCIImage:ci]; – marcelnijman Aug 25 '12 at 08:57
3

in addition, use `view.layer.shouldRasterize = YES`. This is to avoid the problem where some images show 4 pixels for every pixel. – Jeffrey Sun Oct 17 '14 at 18:27
@PeterDeWeese, That's great and achieves my purpose, but I want to ask, when I use `magnificationFilter = kCAFilterNearest`, are the big and sharp pixels magnified really the original pixels of the image, or just produced by some processing?Thank you! – Suge Nov 30 '14 at 01:26
@JeffreySun, when I use shouldRasterize = YES, the pixels look like not the original pixels of the image, but the processed ones, am I right? – Suge Nov 30 '14 at 01:27

Jayden Irwin · Answer 2 · 2019-03-26T19:09:22.560

2

Swift 5

let image = UIImage(named: "Foo")
let scaledImageSize = image.size.applying(CGAffineTransform(scaleX: 2, y: 2))

UIGraphicsBeginImageContext(scaledImageSize)
let scaledContext = UIGraphicsGetCurrentContext()!
scaledContext.interpolationQuality = .none
image.draw(in: CGRect(origin: .zero, size: scaledImageSize))
let scaledImage = UIGraphicsGetImageFromCurrentImageContext()!

edited Mar 26 '19 at 19:09

answered Oct 17 '18 at 01:39

Jayden Irwin

921
9
14

This solution still adds interpolation to the output. Clearly visible if you attempt to draw sharp color boxes – Sentry.co Jul 28 '20 at 11:34

score 2 · Answer 3 · edited May 23 '17 at 12:09

2

When drawing directly into bitmap context, we can use:

CGContextSetInterpolationQuality(myBitmapContext, kCGInterpolationNone);

I found this on CGContextDrawImage very slow on iPhone 4

edited May 23 '17 at 12:09

Community

1
1

answered May 10 '11 at 10:19

Khomsan

543
5
5

score 1 · Answer 4 · answered Jan 31 '14 at 20:02

1

I was also trying this (on a sublayer) and I couldn't get it working, it was still blurry. This is what I had to do:

const CGFloat PIXEL_SCALE = 2;
layer.magnificationFilter = kCAFilterNearest; //Nearest neighbor texture filtering
layer.transform = CATransform3DMakeScale(PIXEL_SCALE, PIXEL_SCALE, 1); //Scale layer up
//Rasterize w/ sufficient resolution to show sharp pixels
layer.shouldRasterize = YES;
layer.rasterizationScale = PIXEL_SCALE;

answered Jan 31 '14 at 20:02

Eliot

5,450
3
32
30

Thanks for the drive-by downvotes... mind explaining what the issue is with this answer? – Eliot Feb 08 '17 at 22:36

score -1 · Answer 5 · answered Mar 10 '16 at 11:25

-1

For UIImage created from CIImage you may use:

imageView.image = UIImage(CIImage: ciImage.imageByApplyingTransform(CGAffineTransformMakeScale(kScale, kScale)))

answered Mar 10 '16 at 11:25

Sergei Kuzmin

708
7
12

How to scale up an UIImage without smoothening anything?

5 Answers5

Linked

Related