1 / 22

Don’t Panic!

Don’t Panic!. CSE 391 Fall 2012 Tony Scarlatos. Create Your Xcode Project. Launch Xcode and choose File > New Project In the project window, under the iPhone OS label, choose Single View Application from the Application Category

jody
Download Presentation

Don’t Panic!

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Don’t Panic! CSE 391 Fall 2012 Tony Scarlatos

  2. Create Your Xcode Project • Launch Xcode and choose File > New Project • In the project window, under the iPhone OS label, choose Single View Application from the Application Category • Save the project to your desktop with the name PanicButton.

  3. Project Set Up

  4. Project Summary Window

  5. Launch Interface Builder • In the PanicButton project window you will see a PanicButton folder. Click the file inside called Main.storyboard. This is an XML file that describes some parts of the user interface. • Interface Builder will launch in the workspace to the right and you should see at the top of the palette on the right you will have several icons – File, Help, Identity, Attributes, Size, and Connections. In the lower right there is an interface objects palette.

  6. Interface Builder Window

  7. Add an interface element • From the Objects palette, drag a Button into the View window (which is your iPhone panel). This button is an instance of the UIButton class. • With the button highlighted, select the Attributes icon from the upper right palette, where you can edit various attributes of the button. Type “Don’t Panic!” in the Title field for the button, and press Enter. • Select File > Save. Click the Run button in the upper left corner of the project window, which launches the iPhone Simulator.

  8. Object and Attributes Palettes

  9. So far, so good

  10. Event-driven programming • Types of events that the iPhone responds to: • The app launching • Tapping a button • Selecting a row from a table • Shaking the phone • Gesturing • Moving to a new location (detected by the onboard GPS) • Many more…

  11. Define a method • In the PanicButton project window in Xcode, select the PanicButton folder, and click the ViewController.h file. In this header file you will define the instance variables and the methods your class will have. (You will write the code for your methods in the implementation file). • In the code window to the right, type the following in the line above the @end statement, and then save the file: -(IBAction)showColor1:(id)sender;

  12. Method, continued #import <UIKit/UIKit.h> @interfaceViewController : UIViewController { } -(IBAction)showColor1:(id)sender; @end The first line of the code imports classes from the UIKit framework. The second line indicates the name of the class is ViewController, and it is a subclass of the UIViewController class. The line you inserted defines a method. IBAction links this method to Interface Builder, and tells it you will connect this method to an object. showColor1 is the name of the method.

  13. Connecting a method to an object • Switch back to Interface Builder by clicking on the Main.storyboard file. To the left of the view window select the ViewController icon. • Select the Connections icon (indicated by an arrow) in the upper right. You’ll see the showColor1 method under Received Actions. Drag a line from the circle to the right of your method to the button in the View Window and choose Touch Down as the event in the pop-up window that appears. • Save the file.

  14. Connections Inspector

  15. Implementing code for your method • Click the ViewController.m file in the PanicButton folder. This is the implementation file. • Add the following lines of code just above the @end statement, save your file, and click the Run icon: -(IBAction)showColor1:(id)sender { self.view.backgroundColor = [UIColorredColor]; }

  16. Assignment statement • The syntax is L-value=expression. We’ll look at the expression first. • The code inside the square brackets calls a method. You have a class or an object, a space, and a method (UIColor is the class, redColor is the method). • You can look up the documentation for the UIColor class. Go to Help > Documentation and type UIColor in the search field. Under Class Methods you will see redColor.

  17. Assignment statement, continued • Now let’s look at the L-value. • self is a keyword that refers to the current object. The object was defined in the interface file, indicating that ViewController is a subclass of UIViewController and it inherits all its properties and methods. @interfaceViewController : UIViewController { } • You can look up the UIViewController’s properties and methods in the Documentation.

  18. Assignment statement, continued • So self is the ViewController object, and view is the view the controller manages. The UIView object has a property named backgroundColor.

  19. So far, so good

  20. Add another button • In the Xcode header file, ViewController.h, define another method, showColor2. • In Interface Builder, add another button to your view with the title “OK, Panic!” and connect the showColor2 method to that button. • In the implementation file ViewController.m write the showColor2 method, using redColor. Save your file and click Run.

  21. Success!

  22. Wrapping up • Experiment with changing the background color, button attributes, etc. Save and run your file. • Select your PanicButton project folder in the Finder window. • From the utilities drop-down menu (the one with the gear icon) select Compress.

More Related