Manish Seth
  18 Jan 14

We have identified some of the best practices that we need to follow while working on architecture, design and development of iOS applications. We will keep on adding more and more to it. Stay tuned…

Best Coding Practices

Image files naming convention

There are four types of devices that we need to support while developing iOS Application. These are:

1. iPhone (Non-Retina)
2. iPhone (Retina)
3. iPad (Non-Retina)
4. iPad (Retina)

Naming convention:

Image is username.png. There are 4 images created for supporting 4 types of devices. Here is the naming convention:

iPhone:
username~iphone.png (Non-Retina)
username@2x~iphone.png (Retina)

iPad:
username~ipad.png (Non-Retina)
username@2x~ipad.png (Retina)

How to refer them in the code and storyboard

Referring this image in the code:
[UIImage imageNamed:@”username”];

Referring this image in the storyboard:

iPhone storyboard:
<imageView userInteractionEnabled=”NO” contentMode=”scaleAspectFit” horizontalHuggingPriority=”251″ verticalHuggingPriority=”251″ image= “username.png” translatesAutoresizingMaskIntoConstraints=”NO” id=”4d0-HY-bjJ”>
<rect key=”frame” x=”11″ y=”14″ width=”23″ height=”23″/>
<autoresizingMask key=”autoresizingMask” widthSizable=”YES” heightSizable=”YES”/>
<constraints>
<constraint firstAttribute=”height” constant=”23″ id=”M1s-uZ-vgv”/>
<constraint firstAttribute=”width” constant=”23″ id=”lrU-RP-6NN”/>
</constraints>
</imageView>

iPad storyboard:
<imageView userInteractionEnabled=”NO” contentMode=”scaleAspectFit” horizontalHuggingPriority=”251″ verticalHuggingPriority=”251″ image= “username.png” translatesAutoresizingMaskIntoConstraints=”NO” id=”4d0-HY-bjJ”>
<rect key=”frame” x=”11″ y=”13″ width=”25″ height=”25″/>
<autoresizingMask key=”autoresizingMask” widthSizable=”YES” heightSizable=”YES”/>
<constraints>
<constraint firstAttribute=”width” constant=”25″ id=”NeQ-Pc-jIn”/>
<constraint firstAttribute=”height” constant=”25″ id=”v7K-G6-sTx”/>
</constraints>
</imageView>

Benefits:
1. When you run the app then OS will pick-up the right image for non-retina / retina device and also for iPhone and iPad.
2. Ease of managing the images.