MVC and Interface Builder IAP 2010 iphonedev.csail.mit.edu edward - - PowerPoint PPT Presentation

▶
mvc and interface builder
SMART_READER_LITE
LIVE PREVIEW

MVC and Interface Builder IAP 2010 iphonedev.csail.mit.edu edward - - PowerPoint PPT Presentation

Oct 27, 2023 298 likes •675 views

MVC and Interface Builder IAP 2010 iphonedev.csail.mit.edu edward benson / eob@csail.mit.edu Tuesday, January 12, 2010 Information-Driven Applications Tuesday, January 12, 2010 Application Flow UIApplication Main NIB Initialized

slide-1
SLIDE 1

MVC and Interface Builder

IAP 2010 ❄ edward benson / eob@csail.mit.edu iphonedev.csail.mit.edu

Tuesday, January 12, 2010

slide-2
SLIDE 2

Information-Driven Applications

Tuesday, January 12, 2010

slide-3
SLIDE 3

Application Flow UIApplication UIAppDelegate

Main NIB Initialized

  • (void)applicationDidFinishLaunching:(UIApplication *)application

{ [window makeKeyAndVisible]; }

UI Driven

Initialize Your Root Controller & Interface

After which point it is..

Tuesday, January 12, 2010

slide-4
SLIDE 4

So Application Design and UI Design are intimately paired. UI Driven

Tuesday, January 12, 2010

slide-5
SLIDE 5

Application Flow

  • (void)applicationDidFinishLaunching:(UIApplication *)application

{ [window makeKeyAndVisible]; }

Add things to the window Controller Logic

callbacks

Tuesday, January 12, 2010

slide-6
SLIDE 6

Exercise 1

@interface RPS2AppDelegate : NSObject <UIApplicationDelegate> { NSManagedObjectModel *managedObjectModel; NSManagedObjectContext *managedObjectContext; NSPersistentStoreCoordinator *persistentStoreCoordinator; UITableViewController *tableViewController; UIWindow *window; }

  • (void)applicationDidFinishLaunching:(UIApplication *)application {

// Override point for customization after app launch

tableViewController = [[UITableViewController alloc] initWithStyle:UITableViewStylePlain]; [window addSubview:tableViewController.view];

[window makeKeyAndVisible]; }

[tableViewController release];

App Delegate .h App Delegate .m App Delegate .m -- dealloc method

Tuesday, January 12, 2010

slide-7
SLIDE 7

Model-View-Controller Design

Tuesday, January 12, 2010

slide-8
SLIDE 8

Model Controller View Persistence

Tuesday, January 12, 2010

slide-9
SLIDE 9

Model Controller View Persistence SQLite, CoreData RPSGame Game Logic

Tuesday, January 12, 2010

slide-10
SLIDE 10

MVC on the iPhone

  • You rarely have a View without a ViewController

UITableView

Controller

UITableViewController

Tuesday, January 12, 2010

slide-11
SLIDE 11

MVC on the iPhone

  • The view can drive the relationship, asking things of the

controller

UITableView

Controller

UITableViewController

How many sections?

(Delegate Pattern)

Tuesday, January 12, 2010

slide-12
SLIDE 12

MVC on the iPhone

  • The View asks things of the controller

UITableView

Controller

UITableViewController

26

Tuesday, January 12, 2010

slide-13
SLIDE 13

MVC on the iPhone

  • The View asks things of the controller

UITableView

Controller

UITableViewController

How many rows in section 1?

Tuesday, January 12, 2010

slide-14
SLIDE 14

MVC on the iPhone

  • The View asks things of the controller

UITableView

Controller

UITableViewController

3

Tuesday, January 12, 2010

slide-15
SLIDE 15

MVC on the iPhone

  • The View asks things of the controller

UITableView

Controller

UITableViewController

What is the cell

  • bject for row 1:1?

Tuesday, January 12, 2010

slide-16
SLIDE 16

MVC on the iPhone

  • The View asks things of the controller

UITableView

Controller

UITableViewController

John Appleseed

Tuesday, January 12, 2010

slide-17
SLIDE 17

Or the controller can instruct the view

Controller

MyCustomController

Button

UIButton

Color yourself blue!

Tuesday, January 12, 2010

slide-18
SLIDE 18

Three ways to organize this relationship

  • 1. Use a pre-packaged view and just

implement its delegate in the controller Tables Camera Maps Address Book etc

Tuesday, January 12, 2010

slide-19
SLIDE 19

Three ways to organize this relationship

  • 2. Have the controller programmatically

construct a custom view

  • verlaySize = CGRectMake(0,

self.tableView.height - 22, self.tableView.size.width, 22); TTActivityLabel *banner = [[TTActivityLabel alloc] initWithStyle:TTActivityLabelStyleBlackBanner]; banner.text = [ModelBase syncMessage]; [banner sizeToFit];

This can consist of a lot of pixel math

Tuesday, January 12, 2010

slide-20
SLIDE 20

Three ways to organize this relationship

  • 3. Create a custom view in InterfaceBuilder

and then drive it using the controller

Tuesday, January 12, 2010

slide-21
SLIDE 21

Interface Builder

Tuesday, January 12, 2010

slide-22
SLIDE 22

.xib

Interface Specification

Your Code

Tuesday, January 12, 2010

slide-23
SLIDE 23

.xib Your Code

Interface Specification

Outlet Outlet Outlet Outlet Action Action Action

Tuesday, January 12, 2010

slide-24
SLIDE 24

Your Code

Interface Specification

HelloButton Outlet HelloButton Clicked

HelloButton

Tuesday, January 12, 2010

slide-25
SLIDE 25

Exercise 2

Tuesday, January 12, 2010

slide-26
SLIDE 26

Exercise 2

Tuesday, January 12, 2010

slide-27
SLIDE 27

Exercise 2 Now swap the Table View Controller you used before for the RPSGameViewController you just created

Tuesday, January 12, 2010

slide-28
SLIDE 28

Exercise 3 - Outlets and Actions

@interface RPSGameViewController : UIViewController { IBOutlet UIButton *rockButton; IBOutlet UIButton *paperButton; IBOutlet UIButton *scissorsButton; IBOutlet UILabel *responseLabel; }

  • (IBAction)rockClicked:(id)sender;
  • (IBAction)paperClicked:(id)sender;
  • (IBAction)scissorsClicked:(id)sender;

@end

.h

Tuesday, January 12, 2010

slide-29
SLIDE 29

Exercise 3 - Outlets and Actions In interface builder, wire them together Why does the app crash when you click a button? Debugging Tips Then Run it

Tuesday, January 12, 2010

slide-30
SLIDE 30

Exercise 3 - Outlets and Actions

@implementation RPSGameViewController

  • (IBAction)rockClicked:(id)sender {

}

  • (IBAction)paperClicked:(id)sender {

}

  • (IBAction)scissorsClicked:(id)sender {

}

...(implementation continues)...

Tuesday, January 12, 2010

slide-31
SLIDE 31

Exercise 3 - Outlets and Actions

  • (IBAction)rockClicked:(id)sender {

responseLabel.text = @"The strongest of foes!"; }

  • (IBAction)paperClicked:(id)sender {

responseLabel.text = @"Cunning and underrated!"; }

  • (IBAction)scissorsClicked:(id)sender {

responseLabel.text = @"Deadly and quick!"; }

...(implementation continues)...

Tuesday, January 12, 2010

slide-32
SLIDE 32

Categories One last Objective-C Feature

Tuesday, January 12, 2010

slide-33
SLIDE 33

Categories provide a way to extend a class you did (or didn’t!) write Be careful -- overuse can get you into trouble

Tuesday, January 12, 2010

slide-34
SLIDE 34

@interface NSString @interface NSString(XMLSerialization) @interface NSString(PigLatin)

  • (NSData *)toXML
  • (NSString *)toPigLatin

Tuesday, January 12, 2010

slide-35
SLIDE 35

@interface NSString(RPS)

  • (BOOL)rpsBeats:(NSString *)other;

@end

  • (BOOL)rpsBeats:(NSString *)other {

if (([self isEqualToString:@"rock"] && [other isEqualToString:@"scissors"]) || ([self isEqualToString:@"scissors"] && [other isEqualToString:@"paper"]) || ([self isEqualToString:@"paper"] && [other isEqualToString:@"rock"])) { return YES; } return NO; }

NSString+RPS.h Ex 4 NSString+RPS.m Main App Delegate

if ([@"paper" rpsBeats:@"rock"]) { NSLog(@"All is right in the world!"); }

Tuesday, January 12, 2010

slide-36
SLIDE 36

Lab Extend your program so it has three labels. The first button click sets the first label, The second button click sets the second label, And then the winner is declared in the third button click

Tuesday, January 12, 2010