Question

I am using CoreText on the iPhone to get italic text in a UIScrollView. CoreText on the iPhone doesn’t support images. So I tell CoreText to provide some space for an image and then use CGContextDrawImage to draw an image, blendedImage, in a rectangle of 300 by 120 which is a 2.5 ratio. The image that is created, which is blendedImage in the code below, has the same size ration, since 175/70 = 2.5. Since the image, blendedImage, I am creating has text that I want to word wrap as well, I create the image using renderInContext for the UILabels that are in the image. The problem is that the text in the UILabels is blurred and pixelated. Does anyone know how I can fix this?

Here is the code:

CGRect dccFrame                      = CGRectIntegral(CGRectMake(0, 60, 70, 72));  // 20, 60, 100, 72
UILabel *dccLabel                    = [[UILabel alloc] initWithFrame:CGRectIntegral(dccFrame)];
dccLabel.backgroundColor             = [UIColor clearColor];
dccLabel.numberOfLines               = 0;
dccLabel.lineBreakMode               = UILineBreakModeWordWrap;
NSString *titledccString             = self.dccString;
dccLabel.textColor                   = [UIColor blackColor];
dccLabel.font                        = [UIFont fontWithName:@"Arial-BoldMT" size:7];
[dccLabel setText:titledccString];
[dccLabel sizeToFit];

CGSize newSize  = CGSizeMake(176, 70);  

UIGraphicsBeginImageContextWithOptions(newSize, NO, [UIScreen mainScreen].scale);
CGContextRef gc = UIGraphicsGetCurrentContext();
CGContextSetRGBFillColor(gc, 1, 1, 1, 1);
CGContextSetShouldSmoothFonts(gc, YES);
CGContextSetAllowsAntialiasing(gc, YES);
CGContextSetShouldAntialias(gc, YES);
UIGraphicsPushContext(gc);

CGAffineTransform trf1       = CGAffineTransformMakeTranslation(0, 0);      
CGContextSaveGState(gc);
CGContextConcatCTM(gc, trf1);               
[[UIImage imageNamed: imageString] drawInRect:CGRectIntegral(CGRectMake(70, 0, 46, 60))];  
CGContextRestoreGState(gc);
UIGraphicsPopContext();

CGAffineTransform trf3 = CGAffineTransformMakeTranslation(0, 30);       
CGContextSaveGState(gc);
CGContextConcatCTM(gc, trf3);
[dccLabel.layer renderInContext:gc];
CGContextRestoreGState(gc);

UIImage *blendedImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

[dccLabel release];

I have read that if the positions are not integer that can cause pixelation. But I don’t think that is the problem here. I’ve also run Instruments in Core Animation mode and enabled “Color Misaligned Images” but the image I created doesn’t show up as colored, although other images do.

Does anyone know why the text in the UILabel dccLabel is blurred and pixelated and how I can fix it?

Answer 1

Figured it out, took me awhile ! And the answer is quite simple. Just had to make newSize the same size as the rectangle the image was being drawn into.

 CGSize newSize  = CGSizeMake(300, 120); 

Kind of makes sense to make the image size the same size as the rectangle that the image is being drawn into, right?