1. iOS Theming Engine
Ruotger Deecke,
eBay

2. Who am I
Ruotger Deecke
10 years experience developing for Cocoa on OS X and iOS.
Working in Berlin, Germany for eBay Classifieds.
My team is based in Portland/OR, USA

3. Our challenge
We build 10
classifieds apps for 9
countries from one
code base.

4. Our challenge
They all look different!

5. Our challenge
- Redesign for iOS 7

6. Redesign: Style guide
Have your designer create a styleguide! Why?
- Makes implementation a lot easier
- A good document to discuss matters
- Helps you and your designer focus
- A good exercise in discipline

7. Creating the style guide
- Colors
- Typography
- Functional styles

8. Designing a theme

9. Old theming engine
Problems:
-Complicated One-Size-Fits-All solution for iOS 4
-Many dependencies all over the whole project
-Uses plist files to store theming information
-General code quality ...
„leaves room for improvement“
New theming engine needed

10. New theming engine
Design goals:
- Reasonably simple
- Flexible enough to accomodate for changing needs
- All theme information in code
- Capture as many patterns as possible
„Make it as simple as possible
but no simpler!“
- Albert Einstein

11. New theming engine
Three areas of responsibility:
- Encapsulating the theme information.
- Applying the theme with UIAppearance
- Odds and ends that UIAppearance cannot do for us.

12. Encapsulating the information
- Some things are the same in every app
- Some things are the same in every Gumtree App or Kijiji App
- Some things are specific one single App.
Inheritance!

13. Encapsulating the information
Base
KijijiGumtree
TWCAAUUK

14. Three Levels of Indirection

15. And iOS 6 ...?
Base
KijijiGumtree
TWCAAUUK
Base6
Kijiji6Gumtree6
TW6CA6AU6UK6
Theme Overlay:

16. UIAppearance
- Introduced by Apple with iOS 5
- Useful since iOS 6
- Still very useful on iOS 7

17. UIAppearance
- Get a UIAppearanceProxy for a class:
UIView *appearanceProxy = UIView.appearance;
- Apply theming information once to a UIAppearance proxy
appearanceProxy.backgroundColor = UIColor.redColor;
- After that Cocoa will create new UI elements already themed

18. UIAppearance
- There are some things UIAppearance can‘t do.
- For example: setting a text style to a button.
- But you can write your own UI_APPEARANCE_SELECTOR
Read up on it:
- Apple Docs
- http://nshipster.com/uiappearance

19. Lessons we learned
- don‘t underestimate the amount of theme information that an
app has.
- Your design will change many times
- In design there are no hard rules but merely patterns
- Work closely with your designer.
- Try to come up with the simplest solution that works for you.

20. Links
What other people have done:
-NUI (https://github.com/tombenner/nui),
-NativeCss (http://nativecss.com/),
-Classy (http://classy.as/),
-UISS (https://github.com/robertwijas/UISS),
-Slash (https://github.com/chrisdevereux/Slash),
NSHipster – UIAppearance:
-http://nshipster.com/uiappearance

21. Вопросы?
Ruotger Deecke,
eBay
rdeecke@ebay.com