CODEWITHSUNDEEP
iosuinavigationbaruibarbuttonitem
John Anthony
John Anthony

Reputation: 547

UIBarButtonItem with multiple lines appears as low resolution

I'm trying to create a UIBarButtonItem with two lines of text, like the "Now Playing" button in iPod.app

I'm using the supplied code in this thread: How can we put two line in UIBarButtonItem in Navigation Bar

But running on device, the button appears in low resolution, like this:

https://www.dropbox.com/s/vp5vn9mmq0f96n8/2012-08-21%2014.57.12.png

Why? I don't want to use static images, as my app is localized.

Upvotes: 1

Views: 924

Answers (1)

John Anthony
John Anthony

Reputation: 547

To fix this, use UIGraphicsBeginImageContextWithOptions instead of UIGraphicsBeginImageContext if the device is retina. Then set the scale of the context to mainScreen scale.

+ (UIImage *)nowPlayingButton {

    UILabel * addCustomLabel = 
            [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 40, 25)];
    addCustomLabel.text = 
        NSLocalizedString(@"NOW_PLAYING_NEWLINE", 
                          @"Now playing text divided on two lines");
    addCustomLabel.textColor = [UIColor whiteColor];
    addCustomLabel.font = [UIFont boldSystemFontOfSize:10];
    addCustomLabel.numberOfLines = 2;
    addCustomLabel.backgroundColor = [UIColor clearColor];
    addCustomLabel.textAlignment = UITextAlignmentCenter;

    CGSize size = addCustomLabel.bounds.size;

    static CGFloat scale = -1.0;

    UIScreen *screen = [UIScreen mainScreen];
    scale = [screen scale];

    if(scale > 0.0) {
        UIGraphicsBeginImageContextWithOptions(size, NO, scale);
    } else {
        UIGraphicsBeginImageContext(size);
    }

    CGContextRef context = UIGraphicsGetCurrentContext();
    [addCustomLabel.layer renderInContext: context];
    UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
    CGContextRelease(context);

    return img;
}

Upvotes: 1

Related Questions