April iOS Meetup - UIAppearance Presentation

16
What's On For Today? 1.Theming Applications 2.Introducing UIAppearance 3.Example

Transcript of April iOS Meetup - UIAppearance Presentation

Page 1: April iOS Meetup - UIAppearance Presentation

What's On For Today?

1.Theming Applications

2.Introducing UIAppearance

3.Example

Page 2: April iOS Meetup - UIAppearance Presentation

How do you "theme" your application with color, style?

Page 3: April iOS Meetup - UIAppearance Presentation
Page 4: April iOS Meetup - UIAppearance Presentation

Common UI Customizations

– UINavigationBar tint color, title image

– UIToolbar tint color

– UIBarButtonItem tint color, style

– UIButton, UILabel, etc.

Page 5: April iOS Meetup - UIAppearance Presentation

Pre-iOS5, How Did We Customize?

– viewWillAppear:

– Subclassing UIKit classes' drawRect: method

– NSNotificationCenter

Page 6: April iOS Meetup - UIAppearance Presentation

Pre-iOS5, How Did We Customize?

-(void)viewWillAppear:(BOOL)animated:{ [super viewWillAppear:animated]; // What is our current theme? NSUserDefaults *settings = [NSUserDefaults standardUserDefaults]; NSString *theme = [settings objectForKey:@"theme"];

// Set up color based on theme if ([theme isEqualToString:@"red"]) { self.navBar.tintColor = [UIColor redColor]; } else { self.navBar.tintColor = [UIColor blueColor]; }}

Page 7: April iOS Meetup - UIAppearance Presentation

The Problem With All Of This

• Every view controller needs to "know" about how to handle themes/styles

• Lots of copy & pasted code, annoying to maintain or add themes

Swinburne University of Technology

Page 8: April iOS Meetup - UIAppearance Presentation

What's On For Today?

1. Theming Applications

2. Introducing UIAppearance

3. Example

Page 9: April iOS Meetup - UIAppearance Presentation

Without UIAppearance

UINavigationBar

UINavigationBar

UINavigationBar

UIViewController

UIViewController

UIViewController

setTintColor:

setTintColor:

setTintColor:

Page 10: April iOS Meetup - UIAppearance Presentation

With UIAppearance, 1

UINavigationBar

UINavigationBar

UINavigationBar

ThemeManager

setTintColor:

UIAppearance Proxy

setTintColor:

Page 11: April iOS Meetup - UIAppearance Presentation

With UIAppearance, 2

UIAppearance Proxy

UIViewController

-tintColor:UINavigationBar

alloc/init

Page 12: April iOS Meetup - UIAppearance Presentation

Current UIAppearance classes

– UIActivityIndicatorView– UIBarButtonItem– UIBarItem– UINavigationBar– UIProgressView– UISearchBar– UISegmentedControl– UISlider– UISwitch– UITabBar– UITabBarItem– UIToolbar

Source: http://stackoverflow.com/questions/9424112/what-properties-can-i-set-via-an-uiappearance-proxy

Page 13: April iOS Meetup - UIAppearance Presentation

More details…

• Unfortunately, Apple hasn't documented this feature well yet.

• Unfortunately, not all UIView subclasses work yet

• Search for UI_APPEARANCE_SELECTOR in Spotlight

• Full reverse-engineered list here: http://www.raywenderlich.com/4344/user-interface-customization-in-ios-5

Page 14: April iOS Meetup - UIAppearance Presentation

Who is missing?

• UITableViewCell• UITextField• UILabel

Page 15: April iOS Meetup - UIAppearance Presentation

What's On For Today?

1.Theming Applications

2.Introducing UIAppearance

3.Example

Page 16: April iOS Meetup - UIAppearance Presentation

THANK YOU

Questions?