-->
julis

iOS 5 : Learn Basic Storyboard To Make Single View App

i've done read this tutorial and it is good tutorial for covering basic storyboard, so i try to rewrite it to make me understand the lesson more.

This is the steps:


  1. Open Xcode, file-new project, select single view application
  2. Type project name, check Use Storyboard and Use Reference Counting
  3. on the Left, in Project Navigator, click MainStoryboard_iPhone
  4. now change the background to green and add a label and a button, to do this follow this step
    1. To change background, in middle of screen there is a area that contain a box labeled View Controller Scene, this area is called Document Outline Area and the box si called Object Scene.
    2. Uncollapse View Controller in View Controller Scene by clicking the white triangle
    3. Click View, on right area you should see a View properties, change the background to green
    4. To add a label, you should see on bottom right there is scrollbox with many items, this is Object Libraries that we can use it in our View
    5. Scroll it down, find a Label, drag it to the View, change the string in it to "Green" by double click it
    6. Again, in the Object Libraries find a Button, it is below a Label, drag it to View, change the string to "Turn Red" by double click it
  5. now you have one view, to add another, on the Object Libraries find View Controller
  6. drag it to empty area, and you have another one,
  7. change the second view background to red, you should can do it
  8. add the label, change the string to "Red"
  9. add the button, change the string to "Turn Green"
  10. now you have two view, next we will create segue, to allow it change view when the button is pressed
  11. select the "Turn Red" button,
  12. Control Click and drag to the Red view
  13. when a dialog appear, select modal
  14. now you can test it on simulator, when you click the "turn red" button the view will change to Red
  15. but, when you click "turn green"button , nothing happened, because we are not already create the segue for that button
  16. now, Control Click "Turn Green" button, drag to Greens View, release it. when a dialog appear, click modal
  17. test it, now when you click the "Turn Green" button the Green View appear, 
  18. to change the view transition animation, click the "Segue from UIButton to View Controller" in the Scene Object box in Document Outline Area, or click the line that created when you done create a segue
  19. on the left there is properties of transition, i choose "Cross disolve"
  20. Finish, try it on simulator
julis
julis
Load comments