Simon.
Simon.

Reputation: 1896

xcode 6.1 iphone/ipad storyboard

Trying to design iphone UI on xcode's new storyboard: enter image description here

enter image description here

This seem's a little haphazard for designing just iphone UI.

I expected some form of 'iphone' 'ipad' 'extendable' boundaries or lines but all i can find is this one single storyboard. is it really just the single storyboard now or am i missing some additional controls?

Upvotes: 6

Views: 4281

Answers (2)

Mike
Mike

Reputation: 3084

Starting with XCode 6, the storyboards for the iPhone and iPad have been combined using a new feature called Size Classes. That's a good thing (most of the time), since it lets you design one interface that will adapt itself to different screen sizes.

Of course, there are situations where you may want to use different storyboards for the iPhone and iPad. After all, some apps just need a whole different approach on palm and tablet sized devices.

If you want to use the new Size Classes, see one of the growing number of tutorials, like this one by Ray Wenderlich: http://www.raywenderlich.com/83276/beginning-adaptive-layout-tutorial.

If you would like to use separate storyboards for iPhone and iPad, here's how:

  1. Start with a new Single View Application.

    a. Select File|New|Project.
    
    b. Select iOS, Application and click "Single View Application."
    
    c. Click Next.
    
    d. Give the project a name, then click "Next."
    
    e. Pick a location and click "Create" to create the project.
    
  2. Convert the starting storyboard to an iPhone storyboard.

    a. Select Main.storyboard, and select the file inspector (the document icon at the top of the right pane) if it is not already selected.
    
    b. Uncheck "Use Size Classes."
    

Uncheck Use Size Classes to convert to a device-specific storyboard.

    c. A dlialog will appear. Select "iPhone" from the drop down menu, then click "Disable Size Classes."

Choose iPhone and click Disable Size Classes

    d. Rename the storyboard as "Main_iPhone.storyboard."

enter image description here

  1. Create the iPad storyboard.

    a. Select File|New|File from the menu bar. From the dialog that appears, select iOS|UserInterface. Click on "Storyboard" and click "Next."
    

enter image description here

    b. Rename the file as "Main_iPad.storyboard," then save it, typically in the Base.lproj folder of your project folder.

enter image description here

    c. Add a view controller, and make it the initial view controller by clicking the "Is Initial View Controller" check box in the Attributes Inspector pane.

enter image description here

  1. Convert the new storyboard to an iPad storyboard by following the same steps as #2, above, but this time select iPad rather than iPhone when you select the platform.

  2. Link the storyboards to the app.

    a. Open the Info.plist.
    
    b. Change the name for "Main storyboard file base name" from "Main" to "Main_iPhone.storyboard".
    
    .c Add a new property called "Main storyboard file base name (iPad)" and give it the name "Main_iPad."
    

enter image description here

That's it! You can now create separate UIs for iPhone and iPad the way you always did.

Upvotes: 16

In Utility Area select your storyboard

Show the Atributes inspector > Simulated Metrics > Size > Select Size

Upvotes: 1

Related Questions