Storyboardsvs.
Interface Buildervs.
Code
DifferentMethods
StoryboardsHas morethan oneviewand managestransitions
Supported byApple
Interface Builder
Interface Builder
Circa1993
Code
Storyboards
Oneapplication, one
storyboard
Oneapplication, one storyboard
Storyboards
Storyboards
BREAK INTO PIECES
» Authentication / Registration
BREAK INTO PIECES
» Authentication / Registration
» Multi-step Order Forms
BREAK INTO PIECES
» Authentication / Registration
» Multi-step Order Forms
» Wizards, Tutorials, etc.
BREAK INTO PIECES
» Authentication / Registration
» Multi-step Order Forms
» Wizards, Tutorials, etc.
» Master-Detail
BREAK INTO PIECES:WHY?
<viewControllerLayoutGuide type="top" id="cIm-e0-
J51"/>
<viewControllerLayoutGuide type="bottom" i...
BREAK INTO PIECES:WHY?
CONFLICT
WHENTO USE
ADVANTAGES
» Easier Transitions
WHENTO USE
ADVANTAGES
» Easier Transitions
» No alloc] init]
WHENTO USE
ADVANTAGES
» Easier Transitions
» No alloc] init]
» Visual Tool
WHENTO USE
ADVANTAGES
» Easier Transitions
» No alloc] init]
» Visual Tool
» Static Table Views
WHENTO USE
ADVANTAGES
» Easier Transitions
» No alloc] init]
» Visual Tool
» Static Table Views
» More than one Cell Templ...
WHENTO USE
ADVANTAGES
» Easier Transitions
» No alloc] init]
» Visual Tool
» Static Table Views
» More than one Cell Templ...
WHEN NOTTO USE
» Complex custom UI
» UI with too many clear backgrounds
» Already implemented with code or XIBs
Storyboard Pros +
Storyboard Pros +
PERFORMANCE
» Only the initial view is allocated
Storyboard Pros +
PROTOTYPING
» Can be used to quickly create prototypes
Storyboard Pros +
VISUAL
» For those who are better with visuals
Storyboard Pros +
AUTO-LAYOUT
» We'll come back to this
I should use storyboardsthen.
Storyboard Cons -
REUSABILITY
Storyboard Cons -
DATAFLOW
Storyboard Cons -
DATAFLOW
» prepareForSegue:
Storyboard Cons -
CONFLICT
Interface Builder
Interface Builder
Old.
Interface Builder
Old. ButNSString is oldtoo.
Interface Builder
MultipleFilesforSingleviewsorSingleFilesforMultiple
relatedviews
Interface Builder
EveryviewhasitsownXIBfile.
Interface Builder
EveryviewhasitsownXIBfile.
“After all, that's what Object-Oriented programming
stands for.”
-- Some progr...
WHENTO USE
» Modal Views
WHENTO USE
» Modal Views
» Login/Register screens
WHENTO USE
» Modal Views
» Login/Register screens
» Reusable Views (templates, table cells)
WHENTO USE
» Modal Views
» Login/Register screens
» Reusable Views (templates, table cells)
» Everywhere basically
Interface Builder Pros +
Reusability
» Prepare once, use everywhere
Interface Builder Pros +
VisualTool
» See what you are making
Interface Builder Pros +
Auto-Layout
Interface Builder Cons -
Localization
» It's not easy for the unexperienced
Code
Code
» When IB and Storyboards aren't enough
Code
» Understanding what's under the hood.
Code
» Use coding only for a project at least once.
Code Pros +
Performance
Code Pros +
Reusability
» Good for small changes on similar views
» Open Source
Code Cons -
DonkeyCorpseamountofCode
Code Cons -
SeeingResultsAin'tEasy
» Iterate/Run/Debug/Iterate Cycle
Code Cons -
NotImminent
» Changes to the layout can't be applied that fast.
Code Cons -
Anti-Prototyping
» Say farewell to your loved ones if you are trying
this.
Code Cons -
Auto-Layout
[NSLayoutConstraint constraintWithItem:self.button1
attribute:NSLayoutAttributeRight
relatedBy:NSL...
ThewayIwork
THANKS
@seyfoyun - @wearethreadco
Upcoming SlideShare
Loading in …5
×

Storyboards vs XIBs vs Code

5,778 views
4,525 views

Published on

We've compared different methods of creating a layout on an iOS project.

Presented at the NS Istanbul Meetup on June 1st, 2014.

Created with Deckset. http://www.decksetapp.com

You can access all the content and Deckset-ready Markdown file at: https://dl.dropboxusercontent.com/u/1497273/storyboards-nsistanbul.zip

Published in: Software, Mobile
0 Comments
12 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
5,778
On SlideShare
0
From Embeds
0
Number of Embeds
42
Actions
Shares
0
Downloads
20
Comments
0
Likes
12
Embeds 0
No embeds

No notes for slide

Storyboards vs XIBs vs Code

  1. Storyboardsvs. Interface Buildervs. Code
  2. DifferentMethods
  3. StoryboardsHas morethan oneviewand managestransitions
  4. Supported byApple
  5. Interface Builder
  6. Interface Builder Circa1993
  7. Code
  8. Storyboards
  9. Oneapplication, one storyboard
  10. Oneapplication, one storyboard
  11. Storyboards
  12. Storyboards
  13. BREAK INTO PIECES » Authentication / Registration
  14. BREAK INTO PIECES » Authentication / Registration » Multi-step Order Forms
  15. BREAK INTO PIECES » Authentication / Registration » Multi-step Order Forms » Wizards, Tutorials, etc.
  16. BREAK INTO PIECES » Authentication / Registration » Multi-step Order Forms » Wizards, Tutorials, etc. » Master-Detail
  17. BREAK INTO PIECES:WHY? <viewControllerLayoutGuide type="top" id="cIm-e0- J51"/> <viewControllerLayoutGuide type="bottom" id="a0L-h9- sNL"/>
  18. BREAK INTO PIECES:WHY?
  19. CONFLICT
  20. WHENTO USE ADVANTAGES » Easier Transitions
  21. WHENTO USE ADVANTAGES » Easier Transitions » No alloc] init]
  22. WHENTO USE ADVANTAGES » Easier Transitions » No alloc] init] » Visual Tool
  23. WHENTO USE ADVANTAGES » Easier Transitions » No alloc] init] » Visual Tool » Static Table Views
  24. WHENTO USE ADVANTAGES » Easier Transitions » No alloc] init] » Visual Tool » Static Table Views » More than one Cell Templates
  25. WHENTO USE ADVANTAGES » Easier Transitions » No alloc] init] » Visual Tool » Static Table Views » More than one Cell Templates » Less file count
  26. WHEN NOTTO USE » Complex custom UI » UI with too many clear backgrounds » Already implemented with code or XIBs
  27. Storyboard Pros +
  28. Storyboard Pros + PERFORMANCE » Only the initial view is allocated
  29. Storyboard Pros + PROTOTYPING » Can be used to quickly create prototypes
  30. Storyboard Pros + VISUAL » For those who are better with visuals
  31. Storyboard Pros + AUTO-LAYOUT » We'll come back to this
  32. I should use storyboardsthen.
  33. Storyboard Cons - REUSABILITY
  34. Storyboard Cons - DATAFLOW
  35. Storyboard Cons - DATAFLOW » prepareForSegue:
  36. Storyboard Cons - CONFLICT
  37. Interface Builder
  38. Interface Builder Old.
  39. Interface Builder Old. ButNSString is oldtoo.
  40. Interface Builder MultipleFilesforSingleviewsorSingleFilesforMultiple relatedviews
  41. Interface Builder EveryviewhasitsownXIBfile.
  42. Interface Builder EveryviewhasitsownXIBfile. “After all, that's what Object-Oriented programming stands for.” -- Some programmer dude
  43. WHENTO USE » Modal Views
  44. WHENTO USE » Modal Views » Login/Register screens
  45. WHENTO USE » Modal Views » Login/Register screens » Reusable Views (templates, table cells)
  46. WHENTO USE » Modal Views » Login/Register screens » Reusable Views (templates, table cells) » Everywhere basically
  47. Interface Builder Pros + Reusability » Prepare once, use everywhere
  48. Interface Builder Pros + VisualTool » See what you are making
  49. Interface Builder Pros + Auto-Layout
  50. Interface Builder Cons - Localization » It's not easy for the unexperienced
  51. Code
  52. Code » When IB and Storyboards aren't enough
  53. Code » Understanding what's under the hood.
  54. Code » Use coding only for a project at least once.
  55. Code Pros + Performance
  56. Code Pros + Reusability » Good for small changes on similar views » Open Source
  57. Code Cons - DonkeyCorpseamountofCode
  58. Code Cons - SeeingResultsAin'tEasy » Iterate/Run/Debug/Iterate Cycle
  59. Code Cons - NotImminent » Changes to the layout can't be applied that fast.
  60. Code Cons - Anti-Prototyping » Say farewell to your loved ones if you are trying this.
  61. Code Cons - Auto-Layout [NSLayoutConstraint constraintWithItem:self.button1 attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self.button2 attribute:NSLayoutAttributeLeft multiplier:1.0 constant:-12.0];
  62. ThewayIwork
  63. THANKS @seyfoyun - @wearethreadco

×