Getting Started with iOSProgramming<br />Code Camp Oct 2011<br />Una Daly<br />
Una Daly<br />Foothill College Instructor (adjunct)<br />Director, College Open Textbooks<br />Apple Software Engineer & M...
Audience Experience<br />C, C++<br />Java<br />Objective-C<br />
Agenda<br />Getting Starting Slides:   20-25 minutes<br />Download the iOS SDK <br />Setup your development environment<br...
The iOS Journey<br />Register as Apple Developer<br />Read Getting Started Documentation<br />Download SDK<br />Start proj...
Apple Developer Center<br />
iOS ArchitectureCore OS<br />OSX Kernel<br />Mach 3.0<br />BSD<br />Sockets<br />Security<br />Power Management<br />Keych...
iOS ArchitectureCore Services<br />Collections<br />Address Book<br />Networking<br />File Access<br />SQLite<br />Core Lo...
iOS ArchitectureMedia<br />Core Audio<br />OpenAL<br />Audio Mixing<br />Audio Recording<br />Video Playback<br />JPEG, PN...
iOS ArchitectureCocoa Touch<br />Multi-Touch<br />Core Motion<br />View Hierarchy<br />Localization<br />Controls<br />Ale...
iOS Platform<br />Tools : Xcode, Interface Builder, Instruments<br />Language:  Objective- C<br />							[object  message:...
iOS ToolsIntegrated Development Environment (Mac OS X)<br />Xcode<br />Interface Builder<br />Simulator<br />Instruments<b...
Main iOS Frameworks<br />Foundation (NextStep)<br />NSObject, NSString, NSArrays, NSDictionaries, etc.<br />UIKit<br />Vie...
Objective-C <br />Object-oriented language<br />C Programming Language<br />Dynamic runtime environment<br />Java-like met...
Objective-C Classes<br />Objective-C source code files<br />.h --  interface files<br />.m – implementation files<br />
Objective-C Scope<br />Accessing instance variables<br />@private      - only class can access<br />@protected – only clas...
Method syntax<br />(NSString *) foo : (int) zap  bar : (double) pow;<br />	• Method name is “foo:bar:”<br />	• It has two ...
Sending Messages<br />Dynamically dispatched by runtime<br />Method name (selector) decoupled from code<br />Runtime dynam...
Class Instantiationsimple case<br />alloc init<br />release<br />
Model-View-Controller<br />Model is data engine<br />View is user interface<br />Controller is bridge between model & view...
Actions & Outlets<br />Connecting objects to UI Views<br />Views send IBActions to Controller<br />btnClicked<br />Control...
Our First ProjectHello Coders<br />• Launch Xcode<br />    Create a “View” project called HelloCoders<br />    Look at the...
Hello Coderscontd.<br />Click on HelloCodersViewController.xib to launch Interface Builder.<br />Called the nib file and c...
Let’s add some UI elements<br />Open the Objects Library (View->Utilities)<br />Choose a label and drag onto window<br />D...
What does the .xib file look like?<br />
Run the User Interface<br />Launch the app<br />Try typing into text field.  Keyboard appears<br />Click in and out of you...
Connect Action and Outlet<br />Open the .nib file<br />Control click the button to the File Owner<br />Select btnClicked<b...
Add a custom icon for your app<br />Let’s make the application prettier<br />Icons for iPhone apps are 57x57<br />Icons fo...
Simulator running our Appwith app icon<br />
Model-View-ControllerReview<br />Model is data engine<br />View is user interface<br />Controller is bridge between model ...
Simple CalculatorModel-View-Controller<br />CalcViewController<br />Get Actions from View<br />Call Brain to do Math<br />...
Simple Calculator User Interface (.xib) file<br />
Simple Calculator<br />Open Xcode<br /><ul><li>Create a View-based Project</li></ul>Create calculator user interface (Run ...
Debugging:add some breakpoints & run<br />
Simple CalculatorNext Steps …<br />Handle operations with 2 operands<br />“+”, “-”, “*”, “/”. <br />Add instance variables...
Questions? <br />Check out the 2012 Foothill course offerings<br />Una Daly:   <br />dalyuna@fhda.edu<br />
Image Attributions<br />Front page iPad, iPhone<br />Some rights reserved by Yutaka Tsutano<br />C Programming Language<br...
Upcoming SlideShare
Loading in …5
×

Code camp 2011 Getting Started with IOS, Una Daly

951 views

Published on

Presentation at Code Camp on Oct 8, 2011, 1:15 pm in the Foothill College Cafeteria. Overview of iOS Platform and development with demonstration of building two applications that demonstrate the model-view-controller architecture and feature buttons, textfields, labels, and alerts.

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

No Downloads
Views
Total views
951
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
15
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Code camp 2011 Getting Started with IOS, Una Daly

  1. 1. Getting Started with iOSProgramming<br />Code Camp Oct 2011<br />Una Daly<br />
  2. 2. Una Daly<br />Foothill College Instructor (adjunct)<br />Director, College Open Textbooks<br />Apple Software Engineer & Manager<br /> 10 years<br />Networking Software Engineer<br />
  3. 3. Audience Experience<br />C, C++<br />Java<br />Objective-C<br />
  4. 4. Agenda<br />Getting Starting Slides: 20-25 minutes<br />Download the iOS SDK <br />Setup your development environment<br />Brief overview of the iPhone OS architecture <br />Tools: Xcode, Interface Builder, iOS Simulator, and Instruments <br />Objective-C syntax<br /> <br />Hello Coders (explain tools for real here) - 10 minutes<br />Add a custom icon - 5 minutes <br /> <br />Model-View-Controller – 5 minutes<br /> <br />MyCalc (implementation) - 15 minutes<br />
  5. 5. The iOS Journey<br />Register as Apple Developer<br />Read Getting Started Documentation<br />Download SDK<br />Start project<br />Join iOS Developer $99<br /> OR<br />Take Foothill Class<br />• Submit to AppStore<br />Some rights reserved cc-by-nc-sa by airdiogo<br />
  6. 6. Apple Developer Center<br />
  7. 7. iOS ArchitectureCore OS<br />OSX Kernel<br />Mach 3.0<br />BSD<br />Sockets<br />Security<br />Power Management<br />Keychain Access<br />Certificates<br />File System<br />Bonjour<br />
  8. 8. iOS ArchitectureCore Services<br />Collections<br />Address Book<br />Networking<br />File Access<br />SQLite<br />Core Location<br />Net Services<br />Threading<br />Preferences<br />URL Utilities<br />
  9. 9. iOS ArchitectureMedia<br />Core Audio<br />OpenAL<br />Audio Mixing<br />Audio Recording<br />Video Playback<br />JPEG, PNG, TIFF<br />PDF<br />Quartz (2D)<br />Core Animation<br />OpenGL ES<br />
  10. 10. iOS ArchitectureCocoa Touch<br />Multi-Touch<br />Core Motion<br />View Hierarchy<br />Localization<br />Controls<br />Alerts<br />Web View<br />Map Kit<br />Image Picker<br />Camera<br />
  11. 11. iOS Platform<br />Tools : Xcode, Interface Builder, Instruments<br />Language: Objective- C<br /> [object message: arg]<br />Frameworks : <br />Foundation, UIKit, CoreGrapics<br />Design Strategy: Model-View-Controller<br />
  12. 12. iOS ToolsIntegrated Development Environment (Mac OS X)<br />Xcode<br />Interface Builder<br />Simulator<br />Instruments<br />
  13. 13. Main iOS Frameworks<br />Foundation (NextStep)<br />NSObject, NSString, NSArrays, NSDictionaries, etc.<br />UIKit<br />Views, Windows, etc … (.xib files)<br />Core Graphics<br />Drawing intensive apps only<br />
  14. 14. Objective-C <br />Object-oriented language<br />C Programming Language<br />Dynamic runtime environment<br />Java-like method selection<br />
  15. 15. Objective-C Classes<br />Objective-C source code files<br />.h -- interface files<br />.m – implementation files<br />
  16. 16. Objective-C Scope<br />Accessing instance variables<br />@private - only class can access<br />@protected – only class and subclass (default)<br />@public - any class can access <br />General rule of thumb …<br />Make all instance variables private and use the properties directive to generate getter and setters.<br />
  17. 17. Method syntax<br />(NSString *) foo : (int) zap bar : (double) pow;<br /> • Method name is “foo:bar:”<br /> • It has two arguments:<br />int zap;<br /> double pow;<br />• Return type is NSStringof Foundation class<br />
  18. 18. Sending Messages<br />Dynamically dispatched by runtime<br />Method name (selector) decoupled from code<br />Runtime dynamically looks up to find method<br />
  19. 19. Class Instantiationsimple case<br />alloc init<br />release<br />
  20. 20. Model-View-Controller<br />Model is data engine<br />View is user interface<br />Controller is bridge between model & view<br />Sets view (instance variables) Outlets<br />Receives Actions (user input) from View<br />Formats model’s data for display in view<br />Controller<br /> Model<br /> View<br />
  21. 21. Actions & Outlets<br />Connecting objects to UI Views<br />Views send IBActions to Controller<br />btnClicked<br />Controllers talk to view through IBOutlets<br />txtFieldName<br />
  22. 22. Our First ProjectHello Coders<br />• Launch Xcode<br /> Create a “View” project called HelloCoders<br /> Look at the files created by default<br />HelloCodersAppDelegate.h (Objective C)<br />HelloCodersAppDelegate.m<br />HelloCodersViewController.h<br />HelloCodersViewController.m<br />HelloCodersViewController.xib<br /> Click on Run to build and launch app<br /> So we have a blank screen – not too interesting<br />
  23. 23. Hello Coderscontd.<br />Click on HelloCodersViewController.xib to launch Interface Builder.<br />Called the nib file and contains an XML description of your user interface. <br />Three items appear<br />File Owner – runtime object that owns the nib<br />First Responder – first view in the chain to respond to events.<br />View window shows the graphical layout<br />
  24. 24. Let’s add some UI elements<br />Open the Objects Library (View->Utilities)<br />Choose a label and drag onto window<br />Double click and type “Hello Coders”<br />Tools->Attribute Inspector and type “Hello Coders”<br />Change alignment, font size etc from attribute window.<br />Drag & drop a Text Field view to the View Window<br />Drag & drop a Button view to the View Window<br />Tools->Attribute and type “Click Me!” in button title<br />Save .xib file and Run<br />
  25. 25. What does the .xib file look like?<br />
  26. 26. Run the User Interface<br />Launch the app<br />Try typing into text field. Keyboard appears<br />Click in and out of your app using home key.<br />Time to implement action in code<br />Add btnClicked method and txtName instance variable declaration in HelloCodersViewController. h file. <br />Write btnClicked method to display an alert in the Hello CodersViewController.m file.<br />Now Run your app again ….<br />What’s Missing???<br />
  27. 27. Connect Action and Outlet<br />Open the .nib file<br />Control click the button to the File Owner<br />Select btnClicked<br />Control click the File Owner to the textfield<br />Select txtname<br />Save, Build & Run … YES ….<br />
  28. 28. Add a custom icon for your app<br />Let’s make the application prettier<br />Icons for iPhone apps are 57x57<br />Icons for iPads are 72x72<br />Icons for high-resolution iPhones are 114x114<br />Drag & Drop icon onto Support folder of your project. Make a copy if asked.<br /> Select the HelloCoders-Info.plist in the Support Folder. Select the icon file item and set its value to the name of the icon file.<br />3. Choose Run and watch your application launch this time.<br />
  29. 29. Simulator running our Appwith app icon<br />
  30. 30. Model-View-ControllerReview<br />Model is data engine<br />View is user interface<br />Controller is bridge between model & view<br />Sets view instance vars<br />Receives Actions from View<br />Formats model’s data for display in view<br />Controller<br /> Model<br /> View<br />
  31. 31. Simple CalculatorModel-View-Controller<br />CalcViewController<br />Get Actions from View<br />Call Brain to do Math<br />Update View with Results<br />CalcBrain<br />Do the Math here!!!<br />Sqrt<br /> Inverse<br /> Clear <br />CalcView<br /> Display IBOutlet<br /> Buttons IBAction<br /> 1,2,3,4, 5, 6, 7,8,9<br />sqrt, 1/x, clr<br />
  32. 32. Simple Calculator User Interface (.xib) file<br />
  33. 33. Simple Calculator<br />Open Xcode<br /><ul><li>Create a View-based Project</li></ul>Create calculator user interface (Run & Build)<br />Add CalcBrain.h, CalcBrain.m<br />Add setOperand and performOperation methods<br />Edit CalcControllerView.h, CalcControllerView.m<br />Connect the .nib file to the IBOutlet (display) & IBActions (digitPressed & operatorPressed<br />Run & Build<br />
  34. 34. Debugging:add some breakpoints & run<br />
  35. 35. Simple CalculatorNext Steps …<br />Handle operations with 2 operands<br />“+”, “-”, “*”, “/”. <br />Add instance variables to CalcBrain for storing additional operand and operator.<br />Modify performOperation method to handle another operand.<br />
  36. 36. Questions? <br />Check out the 2012 Foothill course offerings<br />Una Daly: <br />dalyuna@fhda.edu<br />
  37. 37. Image Attributions<br />Front page iPad, iPhone<br />Some rights reserved by Yutaka Tsutano<br />C Programming Language<br />Some rights reserved by mrbill<br />Java image<br />Some rights reservedBy kathryn_rotondo<br />Objective-C Image<br />Some rights reserved by heipei<br />

×