Xcode 4.5 Rotation in UIViewController Auto Layout

1. Good to see you
Michael

2. Over 365 million iOS Devices
80% is iOS 5

3. Most used programming language
2012
Position Language
1 C
2 Java
3 Objective-C
http://bit.ly/JnA6fh

4. Objective-C
%
9.00
6.75
4.50
2.25
0
2007 2008 2009 2010 2011 2012

5. Strange in iOS SDK 6
Support iOS 5 runtime

6. Valid Architecture
armv7s - remove

7. How about Auto Layout
Disable it
NSLayoutConstraint
not supported in iOS 5

8. Facebook API
Don’t use 3.1 3.1
Use 3.0 or Deprecated ones
Accounts only on iOS 6

9. Unwind

10. Unwind Segue
Motivation
We want this

11. Need some codes and
Exit -

12. Codes
-(IBAction) dismissNext:(UIStoryboardSegue *)segue{
[self dismissViewControllerAnimated:YES
completion:^{
NSLog(@"dismissed");
}];
}

13. Codes - where ?
-(IBAction) dismissNext:(UIStoryboardSegue *)segue;
GLViewController
GLPage2ViewController

14. Codes - in the source direction of segue
-(IBAction) dismissNext:(UIStoryboardSegue *)segue{
[self dismissViewControllerAnimated:YES
completion:^{
NSLog(@"dismissed");
}];
}
GLViewController

15. Drag & Drop
GLPage2ViewController

16. Running on iOS 5
Terminating app due to uncaught exception
'NSInvalidUnarchiveOperationException', reason: 'Could not instantiate
class named UIStoryboardUnwindSegueTemplate'

17. Demo
StoryDemo

18. More

19. Rotate View Controller

20. Small but important
-shouldAutorotateToInterfaceOrientation:

21. Small but important
-shouldAutorotateToInterfaceOrientation:
shouldAutorotate
supportedInterfaceOrientations

22. Example - 只支援水平導向
-(BOOL) shouldAutorotate{
return YES;
}
-(NSUInteger)supportedInterfaceOrientations{
return UIInterfaceOrientationMaskLandscape;
}
in UIViewController

23. UIInterfaceOrientationMask
typedef enum {
UIInterfaceOrientationMaskPortrait = (1 << UIInterfaceOrientationPortrait),
UIInterfaceOrientationMaskLandscapeLeft = (1 << UIInterfaceOrientationLandscapeLeft),
UIInterfaceOrientationMaskLandscapeRight = (1 << UIInterfaceOrientationLandscapeRight),
UIInterfaceOrientationMaskPortraitUpsideDown = (1 <<
UIInterfaceOrientationPortraitUpsideDown),
UIInterfaceOrientationMaskLandscape =
(UIInterfaceOrientationMaskLandscapeLeft | UIInterfaceOrientationMaskLandscapeRight),
UIInterfaceOrientationMaskAll =
(UIInterfaceOrientationMaskPortrait | UIInterfaceOrientationMaskLandscapeLeft |
UIInterfaceOrientationMaskLandscapeRight |
UIInterfaceOrientationMaskPortraitUpsideDown),
UIInterfaceOrientationMaskAllButUpsideDown =
(UIInterfaceOrientationMaskPortrait | UIInterfaceOrientationMaskLandscapeLeft |
UIInterfaceOrientationMaskLandscapeRight),
} UIInterfaceOrientationMask;

24. Layout notice
當 View Controller 被整頁性的 View Controller (如
presentViewController:animated:completion: )蓋住時，被蓋住的 View
Controller 中的 willRotateToInterfaceOrientation:duration:,
willAnimateRotationToInterfaceOrientation:duration: 和
didRotateFromInterfaceOrientation: 不會被呼叫。
善用 viewWillLayoutSubviews

25. Landscape - only App
invoke a portrait-only view controller (such as the Game Center login screen)
Crash

26. Add protocol method in AppDelegate.m
- (NSUInteger)application:(UIApplication *)application
supportedInterfaceOrientationsForWindow:(UIWindow
*)window{
return UIInterfaceOrientationMaskAllButUpsideDown;
}

27. Demo
AutoConstraintDemo

28. Auto Layout
Constraint-based

29. Why auto layout ? 768
320
480 Phone
1024 Pad
320
568 iPhone 5 ?

30. Why auto layout - Localization
Hello こんにちは
English Japanese

31. Why auto layout - Example
Hello こんにちは
English Japanese

32. What is Constraint
200
20
60 60

33. What is Constraint - code
NSLayoutConstraint *constraint = [NSLayoutConstraint
constraintWithItem:button1
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeTrailing
multiplier:1.0f
constant:-60.0f];
[self.view addConstraint:constraint];
button1.trainling = self.view.trainling*1.0-60
60

34. Enable Auto Layout
button1.translatesAutoresizingMaskIntoConstraints = NO;

35. What is Constraint - more
1
button1.leading = self.view.leading*1.0+60
2
button1.trainling = self.view.trainling*1.0-60
4 3
200 button1.bottom = self.view.bottom*1.0-20
4
button1.width = nil*1.0+200
20
3
1
60 60 2

36. What is Constraint - more and code

37. What is Constraint - more and code

38. Visual Format
4
200
V:[button1]-(20)-|
20 |-(60)-[button1(200)]-(60)-|
3
1
60 60 2

39. Visual Format - Code
-(void) virtualForm{
NSDictionary * bindingDict =
NSDictionaryOfVariableBindings(button1);
NSArray * constraints = [NSLayoutConstraint
constraintsWithVisualFormat:@"|-(60)-[button1(200)]-(60)-|" options:
0 metrics:nil views:bindingDict];
[self.view addConstraints:constraints];
constraints = [NSLayoutConstraint
constraintsWithVisualFormat:@"V:[button1]-(20)-|" options:0
metrics:nil views:bindingDict];
[self.view addConstraints:constraints];
}

40. What is Constraint - Landscape
unable to satisfy all constraints
200 200
20 20
60 60 60 60

41. Unable to simultaneously satisfy constraints.
(
"<NSAutoresizingMaskLayoutConstraint:0x74563f0 h=--& v=--& V:
[UIView:0x743d0d0(480)]>",
"<NSLayoutConstraint:0x744a310 H:[UIRoundedRectButton:
0x743c350(200)]>",
"<NSLayoutConstraint:0x744a500 H:|-(60)-[UIRoundedRectButton:
0x743c350] (Names: '|':UIView:0x743d0d0 )>",
"<NSLayoutConstraint:0x744a370 H:[UIRoundedRectButton:0x743c350]-
(60)-| (Names: '|':UIView:0x743d0d0 )>"
)
Will attempt to recover by breaking constraint
<NSLayoutConstraint:0x744a370 H:[UIRoundedRectButton:0x743c350]-(60)-|
(Names: '|':UIView:0x743d0d0 )>
Break on objc_exception_throw to catch this in the debugger.
The methods in the UIConstraintBasedLayoutDebugging category on UIView
listed in <UIKit/UIView.h> may also be helpful.

42. Visual Format - Not Equal
-(void) virtualForm{
NSDictionary * bindingDict =
NSDictionaryOfVariableBindings(button1);
NSArray * constraints = [NSLayoutConstraint
constraintsWithVisualFormat:@"|-(>=60)-[button1(200)]-(>=60)-|"
options:0 metrics:nil views:bindingDict];
[self.view addConstraints:constraints];
constraints = [NSLayoutConstraint
constraintsWithVisualFormat:@"V:[button1]-(20)-|" options:0
metrics:nil views:bindingDict];
[self.view addConstraints:constraints];
}

43. Result

44. AMBIGUOUS LAYOUT - Detect
@interface UIWindow (AutoLayoutDebug)
+ (UIWindow *)keyWindow;
- (NSString *)_autolayoutTrace;
@end private method for debug
@implementation GLViewController
-(void) viewDidAppear:(BOOL)animated{
[super viewDidAppear:animated];
NSLog(@"%@", [[UIWindow keyWindow] _autolayoutTrace]);
}
- (void)didRotateFromInterfaceOrientation:
(UIInterfaceOrientation)fromInterfaceOrientation
{
[super didRotateFromInterfaceOrientation:
fromInterfaceOrientation];
NSLog(@"%@", [[UIWindow keyWindow] _autolayoutTrace]);
}
@end

45. AMBIGUOUS LAYOUT - Console
*<UIWindow:0x7198500>
| *<UIView:0x719b040>
| | *<UIView:0x719ae10>
| | *<UIRoundedRectButton:0x719ab40>
| | | <UIGroupTableViewCellBackground:0x719bfb0>
| | | <UIImageView:0x719c850>
| | | <UIButtonLabel:0x719db30>
*<UIWindow:0x7198500>
| *<UIView:0x719b040>
| | *<UIView:0x719ae10>
| | *<UIRoundedRectButton:0x719ab40> - AMBIGUOUS LAYOUT
| | | <UIGroupTableViewCellBackground:0x719bfb0>
| | | <UIImageView:0x719c850>
| | | <UIButtonLabel:0x719db30>

46. Exercise AMBIGUOUS
[button1 addTarget:button1 action:@selector(exerciseAmbiguityInLayout)
forControlEvents:UIControlEventTouchUpInside];

47. Add Center X
NSLayoutConstraint *constraint = [NSLayoutConstraint
constraintWithItem:button1
attribute:NSLayoutAttributeCenterX
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeCenterX
multiplier:1.0f
constant:0.0];
[self.view addConstraint:constraint];

48. It works, But...
樣好像比較順眼
Some one with the force
200 300

49. Virtual Format - Try
|-(>=60)-[button1(200)]-(>=60)-|
|-(>=60)-[button1(300)]-(>=60)-|
60
300

50. Virtual Format - Priority
-(void) virtualForm{
NSDictionary * bindingDict =
NSDictionaryOfVariableBindings(button1);
NSArray * constraints = [NSLayoutConstraint
constraintsWithVisualFormat:@"|-(60)-[button1(300@999)]-(60)-|"
options:0 metrics:nil views:bindingDict];
[self.view addConstraints:constraints];
constraints = [NSLayoutConstraint
constraintsWithVisualFormat:@"V:[button1]-(20)-|" options:0
metrics:nil views:bindingDict];
[self.view addConstraints:constraints];
} Priority 1000 means required, and default is 1000

51. Great
Demo - AutoConstraintDemo