With the announcement of new iPhone sizes from Apple yesterday, let’s just have a quick look at how quickly an Antetype design can be adapted for the two new phone sizes and even in the landscape orientation.
Below are the steps needed to adapt the design to any screen size, but in this case we will show the examples for the new iPhone 6 and iPhone 6 Plus
1.Open the iOS 7 – Phone Settings Template
Press ⌘+N to Open the Template Chooser, then select the iOS7 – Phone Category and choose the Settings template
2. iPhone 5 / 5S / 5C sized template – 320 x 568
3. Set the screen to the iPhone 6 dimensions (375 x 667)
N.B. The screen should be selected when you open the file – if not the wrong cell will be changed.
This now shows the extra area of the new iPhone 6, but the content is still sized for an iPhone 5
4. Select the Settings object
Open the Screen Inspector (⌥⌘1) and select the Settings cell from the list (1)
5. Open the Size Editor
Note the size of the Settings object is set to Manual Width and Height resizing
6. Change the resizing to Stretch
This means the Settings cell will now stretch to the size of the screen
7. Select the screen again
Make sure the screen from the upper list is selected (1) and nothing is selected in the lower list (2)
8. The content now stretches to take up the entire screen.
9. Change the size to match an iPhone 6 Plus (414 x 736)
The content again stretches to the size of the iPhone 6 Plus
10. Check out the content for an iPhone 6 Plus in Landscape (736 x 414)
Again just change the size of the screen to match