Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

iOS Design and Coding Practices_InnovationM

533 views

Published on

Some of the best practices that we need to follow while working on architecture, design and development of iOS applications.

Published in: Technology, News & Politics
  • Be the first to comment

iOS Design and Coding Practices_InnovationM

  1. 1. | Build a Mobile Experience www.innovationm.com iOS - Best Architecture, Design and Coding Practices Corporate Office: InnovationM Mobile Technologies E-3 (Ground Floor), Sector-3, Noida 201301 (India) t: +91 8447 227337 | e: info@innovationm.com
  2. 2. | Build a Mobile Experience www.innovationm.com iOS – Best Architecture, Design and Coding Practices 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 Corporate Office: InnovationM Mobile Technologies E-3 (Ground Floor), Sector-3, Noida 201301 (India) t: +91 8447 227337 | e: info@innovationm.com
  3. 3. | Build a Mobile Experience www.innovationm.com 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. Source: http://blogs.innovationm.com/ios-best-architecture-design-and-coding-practices/ Corporate Office: InnovationM Mobile Technologies E-3 (Ground Floor), Sector-3, Noida 201301 (India) t: +91 8447 227337 | e: info@innovationm.com

×