Transcript Lecture 4 (PPT)

COMP 446 / ELEC 446
Mobile Device Applications
Scott Cutler
Professor in the Practice of Computer Technology
Department of Computer Science
Department of Electrical and Computer Engineering
[email protected]
9/12/12
Wednesday 2-3:30, DH 1046
Agenda
 Events of the Week
 Next week’s assignment and class
 Review of Assignment 2
 Some more on Views, Gestures, Protocols
 Questions on Assignment #3
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
2
Events of the Week
 Amazon Debuts Three New Kindle Tablets

Amazon's gadget as a service theme: Hardware becomes irrelevant soon
 'Bing It On': Microsoft Challenge Targets Google Search
 T-Mobile: Bring your unlocked iPhone over to us
 Nokia culpa: Phony Lumia 920 video prompts ethics probe
 HP Ups Layoff, Buyout Head Count to 29,000 by 2014
 Some stores report zero BlackBerry sales in last month – analyst
 Best Buy Takes on RadioShack in Mobile Strip-Mall Push
 Samsung Galaxy S III Sells 20 Million Units in 100 Days
 U.S. judge: HTC patents likely valid in Apple suit
 Samsung may sue Apple over iPhone 5; Apple fights tablet ruling
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
3
Event of the Week
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
4
Current Roster
 Victor Acuna
 Ryan Artecona
 Gbenga Badipe
 Peter Chang
 Joan Chao
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
5
Current Roster (2)
 Alex Chiu
 Heaven Chen
 Lingo Dai
 Weibo He
 Sahil Hingorani
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
6
Current Roster (3)
 Abdul Nimeri
 Bill Robertson
 Frank Salinas
 Tyler Siegert
 Austin Witt
 Matthew Zhao
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
7
Optional Sessions and Support
 Monday office hours with TA Richard Latimer. 4:00pm Mudd
 STOPPED DUE TO LACK OF ATTENDANCE
 Ability to email questions to me at any time.

Can email Richard Latimer as well.
 Level of support will vary over semester



High level of support at the beginning.
Support decreasing each project as over time as knowing
where to look or how to debug is a very important skill for
you to learn.
Richard instructed to respond conceptually – not just provide
solutions.
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
8
COMP 446 Syllabus

Lecture 1 - 8/22/12 - Introduction




Lecture 2 - 8/29/12- Assignment 1 issues and questions from videos






Watch before:
3, 4 (demo part)
Assignment:
#3 – Graphing Universal Calculator
Assignment due: Tuesday, 9/18 6:00 am (Monday 30:00)
Lecture 4 - 9/12/12 - Assignment 3 issues and questions from videos




Watch before:
1, 2
Assignment:
#2 – Function Calculator
Assignment due: Friday, 9/7 6:00 am (Thursday 30:00)
Lecture 3 - 9/05/12 - Assignment 2 issues and questions from videos


Watch before:
None
Assignment:
#1 - Calculator
Assignment due: Friday, 8/31 6:00 am (Thursday 30:00)
Watch before:
4 (post demo), 5, 6
Assignment:
Continue with #3 – Graphing Universal Calculator
Assignment due: Tuesday, 9/18 6:00 am (Monday 30:00)
Lecture 5 - 9/19/12 - Assignment 3 issues and questions from videos



Watch before:
Watch 7 before class, 8 after class
Assignment:
#4 – Fiickr Top Places
Assignment due: Friday, 9/28 6:00 am (Thursday 30:00)
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
9
COMP 446 Syllabus

Lecture 6 - 9/26/12 - Assignment 4 issues and questions from videos




Lecture 7 - 10/03/12 - Assignment 5 issues and questions from videos




Watch before:
Assignment:
10 (after Tab Bar), 11, 12
1: #6 – Fiickr Core Data
- Likely to be broken into required and optional parts
- Optional part required for A+
2: Final Project Topic (due before next class)
Assignment due: Friday, 10/12 6:00 am (Thursday 30:00)
Lecture 8 - 10/10/12 - Assignment 6 issues and SQL




Watch before:
8, 9 very beginning of 10
Assignment:
#5 – Fiickr Map Places
Assignment due: Friday, 10/5 6:00 am (Thursday 30:00)
Watch before:
13, 14
Assignment:
Final Project Proposal
Assignment due: Tuesday, 10/16 6:00 am (Monday 30:00)
Lecture 9 - 10/17/12 - iOS 6



Watch before:
Optional 15, 16
Assignment:
iOS 6 app
Assignment due: Friday, 10/26 6:00 am (Thursday 30:00)
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
10
COMP 446 Syllabus

Lecture 10 - 10/24/12 – HTML 5




Lecture 11 - 10/31/12 - TBD





Assignment:
Continue working on Final Project
Assignment due: Wednesday, 11/28 2:00pm
Lecture 14 - 11/21/12 – No class, but continue on final project



Assignment:
Continue working on Final Project
Assignment due: Wednesday, 11/28 2:00pm
Lecture 13 - 11/14/12 - Individual meetings on Final Project


Assignment:
Continue working on Final Project
Assignment due: Wednesday, 11/28 2:00pm
Lecture 12 - 11/7/12- Android vs. iOS vs. Windows Phone group debate


Watch before:
Optional 17, 18
Assignment:
Major Final Project Feature
Assignment due: Friday, 11/2 6:00 am (Thursday 30:00)
Assignment:
Continue working on Final Project
Assignment due: Wednesday, 11/28 2:00pm
Lecture 15 - 11/28/12 - Final Presentations


Assignment:
Document Final Project
Assignment due: By time assigned for COMP 446 final (there is NO final exam)
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
11
Final Projects
 Projects will be individual
An acceptable iPad project can couple to an iPhone project
 Projects can be in iOS, Windows 8 or Android
 You are responsible for Win 8 or Android technology
 I have a small number of iOS devices that can be used by students
without one.



May have to share
Likely have to deploy from a non-community Mac
 Must utilize at least one major and one minor iOS framework and
feature not covered in first 6 assignments; preferably >1 major.
 Project must be pre-approved


Often because proposed project too difficult to complete
Sometimes need to be modified for content
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
12
Final Project Ideas
 Augmented Reality is always a winner
 There are some interesting robots utilizing the
iPhone.
 One could make a board game with iPhone players
and iPad game board.
 OpenGL is a good feature.
 External universal frameworks are NOT allowed.
 Utilizing a backend is good, but not much credit given
for backend logic
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
13
Week 5
 Watch CS193p lectures #7 and first part of #8
 Make progress on CS193p Assignment #3

Videos #7 and #8 content required for assignment

Try and complete before 9/19 class. Due Friday, 9/21 6:00 am .
 Submit assignments, review lectures at www.comp446.com
 Start thinking about big project
 Next week’s lecture – iPad and Life Cycle
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
14
Assignment #2 Comments
 Sloppiness
 @synthesize foo=_foo;

_foo should only be used in setter and getter
 [[calculatorBrain class] runProgram…] instead of [CalculatorBrain runProgram]

Sometimes you do use [self class] to properly refer to subclasses.
 Group methods commonly run together into group method that is called in
place of calling the individual methods.
 Improper use of first letter capitalization
 Class names start UpperCase. Method names in lowerCase.
 Think through the data structures before writing too much code. The proper
data structure makes many things easier.

If you find a task too difficult, it may be because of the way your organized
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
15
What is coming up in the assignments?
 Assignment #3 – Graphing Calculator






Core Graphics, views, frames, bounds, etc.
Navigation Controllers
Storyboards and Segues
Gesture recognizers
Protocols and Delegates
iPad apps, Universal Apps, SplitView controllers
 Assignment #1 was easy. #2 was more difficult. #3
incorporates many new paradigms

Will need to watch through video 7 for iPad information
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
16
What is coming up in the assignments?
 Assignment #4 – Flickr Top Places




Tab bar controllers
TableView controllers
ScrollViews
Data from the internet
 Assignment #5 – Fast Flickr Map



Builds on Assignment #4
Multi Threading / Grand Central Dispatch
MapKit
 Assignment #6 – Core Data Flickr


UIDocument
Core Data
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
17
Video Sequence
 Evidence that people are starting the assignments
prior to watching the videos – DON’T
 I have worked to pace my lectures and COMP 446
assignment deadlines with listed videos roughly
paralleling Stanford progression.
 Most sets tell theory in one lecture and give a related
demo in the next.
 Sometimes reversed.
 Video demos VERY useful for your homework
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
18
Review of Video 3 Items
 Many of the slides to follow come directly
from the Fall 2011 Stanford CS193p slide
deck.
 Some come from earlier versions of CS193p
which I think were a bit clearer than the
current deck
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
19
UIView
 Top level drawing class with many defined
subclasses
 Top level rectangular area for drawing.
 Often contains multiple subviews and
possibly one superview.
 Views are ordered with definable
transparency.
 Memory Management: A superview maintains
a strong pointer to its subviews.
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
20
Drawing Coordinates
 C based floats and structs



CGFloat data type
Two CGFloats make up a CGPoint or CGSize.
A CGPoint and a CGSize make a CGRect


SEC - 9/12/12
CGRect aRect = CGRectMake (5.1, 7, 20, 30);
aRect.size.height =75;
COMP 446 / ELEC 446 - Week 4
21
Drawing Coordinates
 Origin (0, 0) in upper left.
 Units in points and not Pixels

@property CGFloat contentScaleFactor; //pixel
 Three important @properties:

@property CGRect bounds;


@property CGPoint center;


Your view’s “bounding” rectangle
Your view’s center in superview’s coordinates
@property CGRect frame;

SEC - 9/12/12
A rectangular area in superview’s coordinates that
encompasses your view.
COMP 446 / ELEC 446 - Week 4
22
Custom Views
 Views often created in .storyboard file
 Can be created in code with custom class


UIView subclass
Override drawRect: method
 You NEVER call drawRect

Call UIView’s –(void)setNeedsDisplay; method
 The drawing API is C, not object-oriented.
 More (), less *
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
23
Drawing Process
 First get a drawing context
Context is fancy word that collects the various
drawing parameters.
 CGContextRef context =
UIGraphicsGetCurrentContext();
 No memory management (no *)
Create paths out of lines, arcs, etc.
Set colors, fonts, textures, etc.
Stroke or fill created paths to draw
Push and Pop context to make temporary changes





SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
24
Drawing Text and Images
 Text normally drawn through UILabel subclass
 NSString has methods to draw text using a UIFont object
 -(void) drawAtPoint: withFont:; //NSString method
 Images normally drawn through UIImageView subclass
 UIImage can be used to create an image from a file or
many other things
 Can draw one through CGContext
 Can extract NSData class bits from UIImages
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
25
UIViewControllers
 Many important subclasses
 @property (nonatomic, strong) UIView *view;
 Is instantiated in one of two ways (not both):
 - (id) initWinthNibName: bundle:;
 [[UIViewController alloc] init];//xib and bundle are nil
 After initialized: viewDidLoad or Awake from Nib is called
 Before appearance: viewWillAppear: animated:; called.
 Other lifecycle methods:
 viewWillDisappear: animated:
 “did” versions of above
 Methods to handle rotation
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
26
Rotation
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)orientation
{
return UIInterfaceOrientationIsPortrait(orientation); // only support portrait
return YES; // support all orientations
return (orientation != UIInterfaceOrientationPortraitUpsideDown); // anything but
}

Complementarey viewWillAutorotateToInterfaceOrientation: and
viewDidAutorotate…

Proper use of Struts and Springs in Storyboard will help keep things looking correct
 @property (nonatomic) UIViewContentMode contentMode; //determines how
views redraw by default.
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
27
Protocols/Delegates and Target/Action
 Mechanism for crossing MVC boundaries
 Mechanism for customizing opaque designs
 Often sound scarier than they are
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
28
Target / Action
 When a controller wants a view to get back to it when
something happens, it use Target / Action.
 The Target is the class instance to receive a
message from the view when something happens
 The Action is the method sent to the Target when the
trigger happens.
 View items, like buttons, can have multiple
target/action pairs.
 A target and its associated method can be triggered
by multiple situations.
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
29
Protocols, Delegates and DataSources
 Protocols define a set of required and optional methods and
properties to accomplish something

Protocols can be placed in an existing or a separate header file.


Use @class className to forward reference a class
Protocols can inherit other protocols – adding the inherited requirements
and optional methods to their own
 Delegates are classes which publicize that they handle the
requirements of a protocol. These classes get set as the delegate
normally in a property of the class defining the protocol.


It is safe to send a required protocol method to a class that states it
handles a protocol. It must check respondsTo for optional methods.
<myProtocol> is used to identify that a class responds to myProtocol

Can also be added to an iVar or property.
 DataSources are Delagates handling data values
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
30
UIGestureRecognizer
 Abstract superclass for UIPanGestureRecognizer,
UIPinchGR, UIRotationGR, UISwipeGR, UITapGR
 Recognition done in view.
 GestureRecognizer usually set up in controller
 Recognizer handled in view or controller as
appropriate.
 Most recognizers handled in incremental mode where
handler resets item that changed.
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
31
Controller of Controllers
 UINavigationController

Extremely common stack of cards views
 UITabBarController

Managing separate sections of an app
 UISplitViewController

iPad specific Master/Slave view controller
 UITableViewController


Efficient way to display a lot of data in a table form.
Most often subclassed
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
32
UINavigationController
 Deep Dive view controller

Managed push and pop of views showing more detail
 Top level object or as a section of a UITabBarController
 Instantiation:


Create with alloc / init and add controller’s view property to view
hierarchy
Use Storyboard and embed controller in UINavigtionController
 UIViewControllers under a UINavigationController have a
navigationController property used to push new views
 ViewControllers have strong pointers their views.
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
33
Segues
 Mechanism to transition from one MVC to
another
 Most often setup in StoryBoard via control
drag

Remember to name the Segue
 Will receive prepareForSegue:Sender:
 Can be initiated solely in code
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
34
Protocols and Assignment #3
 The Calculator is an MVC with the
CalculatorBrain as the Model
 The Graphing MVC is supposed to be generic
and use a protocol for its view’s data
(valueAtPointX)
 Where should the protocol be defined?
 Where should the protocol be implemented?
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
35
Assignment #3 Questions
SEC - 9/12/12
COMP 446 / ELEC 446 - Week 4
36