CS193P - Lecture 4
            iPhone Application Development

            Building an Application
            Model, View...
Announcements
        • Friday sections
             ■   Friday, 4-5: 260-113


        • Invites to Developer Program wil...
Today’s Topics
        • Application Lifecycle
        • Model, View, Controller design
        • Interface Builder and Ni...
Review




Friday, January 15, 2010   4
Memory Management
        • Alloc/Init
             ■ -alloc assigns memory; -init sets up the object
             ■ Overr...
Setters, Getters, and Properties
        • Setters and Getters have a standard format:
               - (int)age;
        ...
Building an Application




Friday, January 15, 2010          7
Anatomy of an Application
        • Compiled code
             ■ Your code
             ■ Frameworks




        • Nib fil...
App Lifecycle




              p p                   d                                   t
           ha                 ...
UIKit Framework
        • Provides standard interface elements
        • UIKit and you
             ■ Don’t fight the fram...
UIKit Framework
        • Starts your application
        • Every application has a single instance of UIApplication
     ...
Delegation
        • Control passed to delegate objects to perform application-
          specific behavior
        • Avoi...
UIApplicationDelegate
        • Xcode project templates have one set up by default
        • Object you provide that parti...
UIApplicationDelegate
        • Xcode project templates have one set up by default
        • Object you provide that parti...
UIApplicationDelegate
        • Xcode project templates have one set up by default
        • Object you provide that parti...
UIApplicationDelegate
        • Xcode project templates have one set up by default
        • Object you provide that parti...
Info.plist file
        • Property List (often XML), describing your application
             ■ Icon appearance
          ...
Model, View, Controller


        If you take nothing else away from this class...




Friday, January 15, 2010           ...
Model, View, Controller


                               Controller



                       Model                View


...
Model
        • Manages the app data and state

        • Not concerned with UI or presentation

        • Often persists ...
View
        • Present the Model to the user in an appropriate interface

        • Allows user to manipulate data

      ...
Controller
        • Intermediary between Model & View

        • Updates the view when the model changes

        • Updat...
Model, View, Controller


                               Controller



                       Model                View


...
Model, View, Controller


                               Controller



                       Model                View


...
Model, View, Controller


                               Controller



                       Model                View


...
Model, View, Controller

                                 Controller
                           outlets

                 ...
Model, View, Controller

                                 Controller
                           outlets

                 ...
Model, View, Controller

                                 Controller
                           outlets

                 ...
Interface Builder and Nibs




Friday, January 15, 2010             22
Nib files




Friday, January 15, 2010   23
Nib files




Friday, January 15, 2010   23
Nib Files - Design time
        • Helps you design the ‘V’ in MVC:

             ■   layout user interface elements

     ...
Nib Loading
        • At runtime, objects are unarchived
             ■ Values/settings in Interface Builder are restored
...
-awakeFromNib
        • Control point to implement any additional logic after nib
          loading
        • Default empt...
Controls and Target-Action




Friday, January 15, 2010             27
Controls - Events
        • View objects that allows users to initiate some type of action
        • Respond to variety of...
Controls - Target/Action
        • When event occurs, action is invoked on target object




                             ...
Controls - Target/Action
        • When event occurs, action is invoked on target object
                               ta...
Controls - Target/Action
        • When event occurs, action is invoked on target object
                               ta...
Controls - Target/Action
        • When event occurs, action is invoked on target object
                               ta...
Controls - Target/Action
        • When event occurs, action is invoked on target object
                               ta...
Controls - Target/Action
        • When event occurs, action is invoked on target object
                                 ...
Action Methods
       • 3 different flavors of action method selector types
               - (void)actionMethod;
         ...
Action Method Variations
         • Simple no-argument selector
                 - (void)increase {
                      ...
Action Method Variations
         • Two-arguments in selector (sender & event)

                    - (void)adjustNumberOf...
Multiple target-actions
        • Controls can trigger multiple actions on different targets in
           response to the...
Manual Target-Action
         • Same information IB would use
         • API and UIControlEvents found in UIControl.h
    ...
HelloPoly Demo




Friday, January 15, 2010   35
HelloPoly
        • This week’s assignment is a full MVC application
        • Next week’s assignment will flesh it out fu...
Model, View, Controller
        HelloPoly


                               Controller



                       Model     ...
Model, View, Controller
        HelloPoly


                                  Controller



                       Model  ...
Model, View, Controller
        HelloPoly


                                  Controller



                       Model  ...
Model, View, Controller
        HelloPoly
                                   Controller


                                ...
Model, View, Controller
        HelloPoly
                                Controller
                           numberOfSi...
Model, View, Controller
        HelloPoly
                                Controller
                           numberOfSi...
Model, View, Controller
        HelloPoly
                                Controller
                           numberOfSi...
Model, View, Controller
        HelloPoly
                                Controller
                           numberOfSi...
Nib Files - HelloPoly example
        • HelloPoly has all objects (model, view and controller) contained
           in the...
Questions?




Friday, January 15, 2010   40
Upcoming SlideShare
Loading in …5
×

04 Model View Controller

1,753 views

Published on

Published in: Technology, Education
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,753
On SlideShare
0
From Embeds
0
Number of Embeds
11
Actions
Shares
0
Downloads
52
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

04 Model View Controller

  1. 1. CS193P - Lecture 4 iPhone Application Development Building an Application Model, View, Controller Nib Files Controls and Target-Action Friday, January 15, 2010 1
  2. 2. Announcements • Friday sections ■ Friday, 4-5: 260-113 • Invites to Developer Program will go out this weekend ■ Sign up and get your certificate when you get it ■ Start making apps that will run on Hardware!! • Waiting for a couple students to reply about P/NC spots ■ If we don’t hear back today, we’re giving them away Friday, January 15, 2010 2
  3. 3. Today’s Topics • Application Lifecycle • Model, View, Controller design • Interface Builder and Nib Files • Controls and Target-Action • HelloPoly demo Friday, January 15, 2010 3
  4. 4. Review Friday, January 15, 2010 4
  5. 5. Memory Management • Alloc/Init ■ -alloc assigns memory; -init sets up the object ■ Override -init, not -alloc • Retain/Release ■ Increment and decrement retainCount ■ When retainCount is 0, object is deallocated ■ Don’t call -dealloc! • Autorelease ■ Object is released when run loop completes Friday, January 15, 2010 5
  6. 6. Setters, Getters, and Properties • Setters and Getters have a standard format: - (int)age; - (void)setAge:(int)age; • Properties allow access to setters and getters through dot syntax: @property age; int theAge = person.age; person.age = 21; Friday, January 15, 2010 6
  7. 7. Building an Application Friday, January 15, 2010 7
  8. 8. Anatomy of an Application • Compiled code ■ Your code ■ Frameworks • Nib files ■ UI elements and other objects ■ Details about object relationships • Resources (images, sounds, strings, etc) • Info.plist file (application configuration) Friday, January 15, 2010 8
  9. 9. App Lifecycle p p d t ha lize ib en nt pp nc ia i nn re v ve xit a Lau nit ma fo dl ee E pi ad ait n Ap Lo W Ha Friday, January 15, 2010 9
  10. 10. UIKit Framework • Provides standard interface elements • UIKit and you ■ Don’t fight the frameworks ■ Understand the designs and how you fit into them Friday, January 15, 2010 10
  11. 11. UIKit Framework • Starts your application • Every application has a single instance of UIApplication ■ Singleton design pattern @interface UIApplication + (UIApplication *)sharedApplication @end ■ Orchestrates the lifecycle of an application ■ Dispatches events ■ Manages status bar, application icon badge ■ Rarely subclassed ■ Uses delegation instead Friday, January 15, 2010 11
  12. 12. Delegation • Control passed to delegate objects to perform application- specific behavior • Avoids need to subclass complex objects • Many UIKit classes use delegates ■ UIApplication ■ UITableView ■ UITextField Friday, January 15, 2010 12
  13. 13. UIApplicationDelegate • Xcode project templates have one set up by default • Object you provide that participates in application lifecycle • Can implement various methods which UIApplication will call • Examples: Friday, January 15, 2010 13
  14. 14. UIApplicationDelegate • Xcode project templates have one set up by default • Object you provide that participates in application lifecycle • Can implement various methods which UIApplication will call • Examples: - (void)applicationDidFinishLaunching:(UIApplication *)application; - (void)applicationWillTerminate:(UIApplication *)application; Friday, January 15, 2010 13
  15. 15. UIApplicationDelegate • Xcode project templates have one set up by default • Object you provide that participates in application lifecycle • Can implement various methods which UIApplication will call • Examples: - (void)applicationDidFinishLaunching:(UIApplication *)application; - (void)applicationWillTerminate:(UIApplication *)application; - (void)applicationWillResignActive:(UIApplication *)application; - (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url; Friday, January 15, 2010 13
  16. 16. UIApplicationDelegate • Xcode project templates have one set up by default • Object you provide that participates in application lifecycle • Can implement various methods which UIApplication will call • Examples: - (void)applicationDidFinishLaunching:(UIApplication *)application; - (void)applicationWillTerminate:(UIApplication *)application; - (void)applicationWillResignActive:(UIApplication *)application; - (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url; - (void)applicationDidReceiveMemoryWarning:(UIApplication *)application; Friday, January 15, 2010 13
  17. 17. Info.plist file • Property List (often XML), describing your application ■ Icon appearance ■ Status bar style (default, black, hidden) ■ Orientation ■ Uses Wifi networking ■ System Requirements • Can edit most properties in Xcode ■ Project > Edit Active Target “Foo” menu item ■ On the properties tab Friday, January 15, 2010 14
  18. 18. Model, View, Controller If you take nothing else away from this class... Friday, January 15, 2010 15
  19. 19. Model, View, Controller Controller Model View Friday, January 15, 2010 16
  20. 20. Model • Manages the app data and state • Not concerned with UI or presentation • Often persists somewhere • Same model should be reusable, unchanged in different interfaces Friday, January 15, 2010 17
  21. 21. View • Present the Model to the user in an appropriate interface • Allows user to manipulate data • Does not store any data ■ (except to cache state) • Easily reusable & configurable to display different data Friday, January 15, 2010 18
  22. 22. Controller • Intermediary between Model & View • Updates the view when the model changes • Updates the model when the user manipulates the view • Typically where the app logic lives. Friday, January 15, 2010 19
  23. 23. Model, View, Controller Controller Model View Friday, January 15, 2010 20
  24. 24. Model, View, Controller Controller Model View Friday, January 15, 2010 20
  25. 25. Model, View, Controller Controller Model View Friday, January 15, 2010 20
  26. 26. Model, View, Controller Controller outlets actions Model Object Friday, January 15, 2010 21
  27. 27. Model, View, Controller Controller outlets actions Model Object Friday, January 15, 2010 21
  28. 28. Model, View, Controller Controller outlets actions Model Object Friday, January 15, 2010 21
  29. 29. Interface Builder and Nibs Friday, January 15, 2010 22
  30. 30. Nib files Friday, January 15, 2010 23
  31. 31. Nib files Friday, January 15, 2010 23
  32. 32. Nib Files - Design time • Helps you design the ‘V’ in MVC: ■ layout user interface elements ■ add controller objects ■ Connect the controller and UI Friday, January 15, 2010 24
  33. 33. Nib Loading • At runtime, objects are unarchived ■ Values/settings in Interface Builder are restored ■ Ensures all outlets and actions are connected ■ Order of unarchiving is not defined • If loading the nib automatically creates objects and order is undefined, how do I customize? ■ For example, to displaying initial state Friday, January 15, 2010 25
  34. 34. -awakeFromNib • Control point to implement any additional logic after nib loading • Default empty implementation on NSObject • You often implement it in your controller class ■ e.g. to restore previously saved application state • Guaranteed everything has been unarchived from nib, and all connections are made before -awakeFromNib is called - (void)awakeFromNib { // do customization here } Friday, January 15, 2010 26
  35. 35. Controls and Target-Action Friday, January 15, 2010 27
  36. 36. Controls - Events • View objects that allows users to initiate some type of action • Respond to variety of events ■ Touch events ■ touchDown ■ touchDragged (entered, exited, drag inside, drag outside) ■ touchUp (inside, outside) ■ Value changed ■ Editing events ■ editing began ■ editing changed ■ editing ended Friday, January 15, 2010 28
  37. 37. Controls - Target/Action • When event occurs, action is invoked on target object Controller Friday, January 15, 2010 29
  38. 38. Controls - Target/Action • When event occurs, action is invoked on target object target: myObject action: @selector(decrease) event: UIControlEventTouchUpInside Controller Friday, January 15, 2010 29
  39. 39. Controls - Target/Action • When event occurs, action is invoked on target object target: myObject action: @selector(decrease) event: UIControlEventTouchUpInside Controller Friday, January 15, 2010 29
  40. 40. Controls - Target/Action • When event occurs, action is invoked on target object target: myObject action: @selector(decrease) event: UIControlEventTouchUpInside Controller Friday, January 15, 2010 29
  41. 41. Controls - Target/Action • When event occurs, action is invoked on target object target: myObject action: @selector(decrease) event: UIControlEventTouchUpInside UIControlEventTouchUpInside Controller Friday, January 15, 2010 29
  42. 42. Controls - Target/Action • When event occurs, action is invoked on target object target: myObject action: @selector(decrease) event: UIControlEventTouchUpInside UIControlEventTouchUpInside Controller -(void)decrease Friday, January 15, 2010 29
  43. 43. Action Methods • 3 different flavors of action method selector types - (void)actionMethod; - (void)actionMethod:(id)sender; - (void)actionMethod:(id)sender withEvent:(UIEvent *)event; • UIEvent contains details about the event that took place Friday, January 15, 2010 30
  44. 44. Action Method Variations • Simple no-argument selector - (void)increase { // bump the number of sides of the polygon up polygon.numberOfSides += 1; } • Single argument selector - control is ‘sender’ // for example, if control is a slider... - (void)adjustNumberOfSides:(id)sender { polygon.numberOfSides = [sender value]; } Friday, January 15, 2010 31
  45. 45. Action Method Variations • Two-arguments in selector (sender & event) - (void)adjustNumberOfSides:(id)sender withEvent:(UIEvent *)event { // could inspect event object if you needed to } Friday, January 15, 2010 32
  46. 46. Multiple target-actions • Controls can trigger multiple actions on different targets in response to the same event • Different than Cocoa on the desktop where only one target- action is supported • Different events can be setup in IB Friday, January 15, 2010 33
  47. 47. Manual Target-Action • Same information IB would use • API and UIControlEvents found in UIControl.h • UIControlEvents is a bitmask @interface UIControl - (void)addTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents; - (void)removeTarget:(id)target action:(SEL)action forControlEvents:(UIControlEvents)controlEvents; @end Friday, January 15, 2010 34
  48. 48. HelloPoly Demo Friday, January 15, 2010 35
  49. 49. HelloPoly • This week’s assignment is a full MVC application • Next week’s assignment will flesh it out further • It is not designed to be a complex application ■ rather, provide a series of small studies of the fundamentals of a Cocoa Touch application Friday, January 15, 2010 36
  50. 50. Model, View, Controller HelloPoly Controller Model View Friday, January 15, 2010 37
  51. 51. Model, View, Controller HelloPoly Controller Model View PolygonShape Friday, January 15, 2010 37
  52. 52. Model, View, Controller HelloPoly Controller Model View PolygonShape UIKit controls PolygonView (next week) Friday, January 15, 2010 37
  53. 53. Model, View, Controller HelloPoly Controller Controller Model View PolygonShape UIKit controls PolygonView (next week) Friday, January 15, 2010 37
  54. 54. Model, View, Controller HelloPoly Controller numberOfSidesLabel increaseButton decreaseButton polygonShape increase decrease PolygonShape Friday, January 15, 2010 38
  55. 55. Model, View, Controller HelloPoly Controller numberOfSidesLabel increaseButton decreaseButton polygonShape increase decrease PolygonShape Friday, January 15, 2010 38
  56. 56. Model, View, Controller HelloPoly Controller numberOfSidesLabel increaseButton decreaseButton polygonShape increase decrease PolygonShape Friday, January 15, 2010 38
  57. 57. Model, View, Controller HelloPoly Controller numberOfSidesLabel increaseButton decreaseButton polygonShape increase decrease PolygonShape Friday, January 15, 2010 38
  58. 58. Nib Files - HelloPoly example • HelloPoly has all objects (model, view and controller) contained in the same MainWindow.xib file ■ More common to have UI broken up into several nib files • UIKit provides a variety of “View Controllers” ■ We will be introducing them with the Presence projects Friday, January 15, 2010 39
  59. 59. Questions? Friday, January 15, 2010 40

×