Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why do lines smaller than 1.0pts not render correctly on non-retina screens?

self.layer.borderWidth = 0.5;

on a UIButton or UITextField render fine on a retina screen, but on a non-retina screen only the top and left borders render while the right and bottom borders do not render.

I assume it has something to do with dpi of the screen and how sub point lines are drawn, but it's possible that there is a better explanation.

Question: I'd like to know if it's possible to have all sides of a UIView's border show as expected on both retina and non-retina screens with borderWidth set to 0.5.

like image 569
Brenden Avatar asked Jun 12 '13 21:06

Brenden


2 Answers

If you want a single pixel (not point) line always, you'll have to use a different border width depending on the scale of the screen.

E.g.:

CGFloat scale = [[UIScreen mainScreen] scale];
if (scale == 2.0)  { 
    // retina screen;
    self.layer.borderWidth = 0.5;
} else {
    // non-retina screen
    self.layer.borderWidth = 1.0;
}
like image 139
Matt Bridges Avatar answered Nov 15 '22 13:11

Matt Bridges


Now that multiple scales are supported (@3x) it is probably better to write Matt's answer as this:

CGFloat scale = [[UIScreen mainScreen] scale];
CGFloat width = scale > 0.0 ? 1.0 / scale : 1.0;
[self.layer setBorderWidth:width];
like image 21
Kevin Sylvestre Avatar answered Nov 15 '22 13:11

Kevin Sylvestre