Search code examples
iphoneobjective-ciosretina-display

Fonts and Lines on Retina display

i have finished my app in a @1x version and have created a lot of the interface with code, meaning:

  • UILabels
  • UIViews

and all looks great. if i now use the app on a retina display obviously everything scales up to @2x. I have some graphics that i designed with fireworks/photoshop and of course have made @2x versions of them that work just fine. My problem are the standard interface elements as noted above.

Question: How would i go about

  • Having a font in a UILabel that has a 1px stroke on both resolutions, but double the hight and width on @2x ?
  • Having a UIView with height 1px (as separator of the screen) on both resolutions? 2px lines on @2x are ok, but id really rather have them 1px of hight - looks just more elegant.

for creating a separator view i currently use:

UIView *separatorLine = [[UIView alloc]initWithFrame:CGRectMake(0,200,320,1)];
[self.view addSubview:seperatorLine];

which works fine on @1x resolution but gets blown up to 2px height in @2x, instead of showing in the @2x as:

seperatorLine.frame == (0,400,640,1)

how would i need to change such a code to work on both resolutions?

Solution

  • You can check for the screen scale by

    CGFloat scale = ([[UIScreen mainScreen] respondsToSelector:@selector(scale)] ? [UIScreen mainScreen].scale : 1.0);

    If the scale equals 2.0 you are on a retina display and can change the frame of the separator, for example, to CGRectMake(0.0, 200.0, 320.0, 0.5).