1. EEC-492/693/793 iPhone Application Development
Lecture 18
Wenbing Zhao & Nigamanth Sridhar
11/28/2018
EEC492/693/793 - iPhone Application Development

2. EEC492/693/793 - iPhone Application Development
Outline
Accelerometer
Core Graphic and Quartz 2D
Assignment:
Build the Ball app in chapter 15
Challenge: add the touch feature
Build the Draw app for CG drawing
11/28/2018
EEC492/693/793 - iPhone Application Development

3. What Are Accelerometers?
Measure changes in force
Y direction: opposite of coordinate system
11/28/2018
EEC492/693/793 - iPhone Application Development

4. EEC492/693/793 - iPhone Application Development
Kinds of Orientation
Physical orientation
How is the device positioned?
Interface orientation
Where is the status bar?
11/28/2018
EEC492/693/793 - iPhone Application Development

5. Getting the Physical Orientation
UIDevice class
Start notifications
beginGeneratingDeviceOrientationNotifications
Get Orientation
// delivered to registered observers
UIDeviceOrientationDidChangeNotification
orientation property
Stop notifications
endGeneratingDeviceOrientationNotifications
11/28/2018
EEC492/693/793 - iPhone Application Development

6. Getting the Interface Orientation
UIApplication class
statusBarOrientation property
Defines interface orientation, not device orientation
UIViewController class
interfaceOrientation property
- (BOOL)shouldAutorotateToInterfaceOrientation:
(UIInterfaceOrientation)interfaceOrientation
11/28/2018
EEC492/693/793 - iPhone Application Development

7. EEC492/693/793 - iPhone Application Development
Shake Detection
UIEvent type
@property(readonly) UIEventType type;
@property(readonly) UIEventSubtype subtype;
UIEventTypeMotion
UIEventSubtypeMotionShake
- (void)motionBegan:(UIEventSubtype)motion withEvent:(UIEvent *)event; - (void)motionCancelled:(UIEventSubtype)motion withEvent:(UIEvent *)event; - (void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event;
- (void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event {   if (event.type == UIEventSubtypeMotionShake) {     //Your code here   } }
11/28/2018
EEC492/693/793 - iPhone Application Development

8. Getting the Raw Accelerometer Data
Part of the UIKit framework
Delivers 3-axis data
Configurable update frequency (approx 10–100Hz)
Delegate-based event delivery
Classes
UIAccelerometer
UIAcceleration
Protocol
UIAccelerometerDelegate
11/28/2018
EEC492/693/793 - iPhone Application Development

9. Configuring the Accelerometer: Starting the event delivery
- (void)enableAccelerometerEvents {
UIAccelerometer* theAccel = [UIAccelerometer sharedAccelerometer];
theAccel.updateInterval = 1/50; // 50 Hz
theAccel.delegate = self; }
Event delivery begins as soon as you assign the delegate
11/28/2018
EEC492/693/793 - iPhone Application Development

10. Defining Your Delegate Object: Processing the accelerometer data
- (void)accelerometer:(UIAccelerometer*)accelerometer
didAccelerate:(UIAcceleration*)acceleration {
// Get the event data
UIAccelerationValue x, y, z;
x = acceleration.x;
y = acceleration.y;
z = acceleration.z;
// Process the data... }
Only one delegate per application
Delivered asynchronously to main thread
11/28/2018
EEC492/693/793 - iPhone Application Development

11. EEC492/693/793 - iPhone Application Development
Configuring the Accelerometer: Choosing an appropriate update frequency
System range is approximately 10–100Hz
Frequency should be based on need
Determine the minimum frequency for your needs
Don’t update too frequently
Target ranges
Game input: 30–60 Hz
Orientation detection: 10–20 Hz
11/28/2018
EEC492/693/793 - iPhone Application Development

12. Disabling Event Delivery: Stopping the event delivery
- (void)disableAccelerometerEvents {
UIAccelerometer* theAccel =
[UIAccelerometer sharedAccelerometer];
theAccel.delegate = nil; }
11/28/2018
EEC492/693/793 - iPhone Application Development

13. CoreGraphics and Quartz 2D
UIKit offers very basic drawing functionality
UIRectFill(CGRect rect);
UIRectFrame(CGRect rect);
CoreGraphics: Drawing APIs
CG is a C-based API, not Objective-C
CG and Quartz 2D drawing engine define simple but powerful
graphics primitives
Graphics context
Transformations
Paths
Colors
Fonts
Painting operations
11/28/2018
EEC492/693/793 - iPhone Application Development

14. EEC492/693/793 - iPhone Application Development
Graphics Contexts
All drawing is done into an opaque graphics context
Draws to screen, bitmap buffer, printer, PDF, etc.
Graphics context setup automatically before invoking drawRect:
Defines current path, line width, transform, etc.
Access the graphics context within drawRect: by calling
(CGContextRef)UIGraphicsGetCurrentContext(void);
Use CG calls to change settings
Context only valid for current call to drawRect:
Do not cache a CGContext!
11/28/2018
EEC492/693/793 - iPhone Application Development

15. EEC492/693/793 - iPhone Application Development
CG Wrappers
UIColor
Convenience for common colors
Easily set the fill and/or stroke colors when drawing
UIColor *redColor = [UIColor redColor];
[redColor set];
// drawing will be done in red
UIFont
Access system font
Get font by name
UIFont *font = [UIFont systemFontOfSize:14.0];
[myLabel setFont:font];
11/28/2018
EEC492/693/793 - iPhone Application Development

16. EEC492/693/793 - iPhone Application Development
Drawing Custom Views
- (void)drawRect:(CGRect)rect
-[UIView drawRect:] does nothing by default
If not overridden, then backgroundColor is used to fill
Override - drawRect: to draw a custom view
rect argument is area to draw
Should never call drawRect: directly
Call –(void)setNeedsDisplay instead!
11/28/2018
EEC492/693/793 - iPhone Application Development

17. Simple drawRect: Example
Draw a solid color and shape
- (void)drawRect:(CGRect)rect {
CGRect bounds = [self bounds];
[[UIColor grayColor] set];
UIRectFill (bounds);
CGRect square = CGRectMake (10, 10, 50, 100);
[[UIColor redColor] set];
UIRectFill (square);
[[UIColor blackColor] set];
UIRectFrame (square); }
11/28/2018
EEC492/693/793 - iPhone Application Development

18. Drawing More Complex Shapes
Common steps for drawRect: are
Get current graphics context
Define a path
Set a color
Stroke or fill path
Repeat, if necessary
11/28/2018
EEC492/693/793 - iPhone Application Development

19. EEC492/693/793 - iPhone Application Development
CGPath
CoreGraphics paths define shapes
Made up of lines, arcs, curves and rectangles
Creation and drawing of paths are two distinct operations
Define path first, then draw it
CGContext
CGPath
CGContextMoveToPoint
CGPathMoveToPoint
CGContextAddLineToPoint
CGPathAddLineToPoint
CGContextAddArcToPoint
CGPathAddArcToPoint
CGContextClosePath
CGPathCloseSubPath
11/28/2018
EEC492/693/793 - iPhone Application Development

20. EEC492/693/793 - iPhone Application Development
Path Example
- (void)drawRect:(CGRect)rect {
CGContextRef context = UIGraphicsGetCurrentContext();
[[UIColor grayColor] set];
UIRectFill ([self bounds]);
CGContextBeginPath (context);
CGContextMoveToPoint (context, 75, 10);
CGContextAddLineToPoint (context, 10, 150);
CGContextAddLineToPoint (context, 160, 150);
CGContextClosePath (context);
[[UIColor redColor] setFill];
[[UIColor blackColor] setStroke];
CGContextDrawPath (context, kCGPathFillStroke); }
11/28/2018
EEC492/693/793 - iPhone Application Development

21. EEC492/693/793 - iPhone Application Development
Drawing Text & Images
You can draw UIImages in -drawRect:
- [UIImage drawAtPoint:(CGPoint)point]
- [UIImage drawInRect:(CGRect)rect]
- [UIImage drawAsPatternInRect:(CGRect)rect]
You can draw NSString in -drawRect:
- [NSString drawAtPoint:(CGPoint)point withFont:(UIFont *)font]
11/28/2018
EEC492/693/793 - iPhone Application Development

22. EEC492/693/793 - iPhone Application Development
Build Two Apps
11/28/2018
EEC492/693/793 - iPhone Application Development