UIImage on UIButton is blurry

Question

I have been battling this problem for a bit, I want to display a png on a UIButton, but for some reason the image ends up being very blurry both in the simulator and on a physical device. I have tried using all different sized images, all at 326 ppi (verified in xcode), but none have looked correct. I have also tried resizing the image in my app using UIGraphics but the problem persists. Here is the code which sets up the button:

//MIRROR BUTTON
    _mirrorButton = [UIButton buttonWithType:UIButtonTypeCustom];
    //_mirrorButton.frame = CGRectMake(buttonWidth, 0.0f, buttonWidth, buttonHeight);
    _mirrorButton.frame = CGRectMake(64, 0, 64, 50);
    UIImage *mirrorImage;


    _mirrorButton.backgroundColor = [MessageView getUserColor];
    mirrorImage = [UIImage imageNamed:@"mirror.png"];

    [_mirrorButton setImage:mirrorImage forState:UIControlStateNormal];

    [_mirrorButton addTarget:self action:@selector(mirrorPressed) forControlEvents:UIControlEventTouchUpInside];
    [self addSubview:_mirrorButton];

Both the UIButton and the image are supposed to have a height of 50 pixels. My UIButton's frame is integral, and the image even has an even pixel width and height (someone said this would help with the centering). Any incite would be much appreciated. Thanks.

Answer 1

From what im reading I presume you might be confusing 50 pixels with 50 points. The frames in general are measured in points and not in pixels, you can see the difference HERE

So basically, if you use a 50 points high frame, in devices with retina screen you will need an image with 100px high, and then it shouldn't look blurry anymore