Upload
codefest
View
1.120
Download
1
Embed Size (px)
Citation preview
1
Создание кастомныхинтерфейсов для iOSБусыгин Роман,Яндекс
2
План рассказа
• Проблема стандартных элементов управления
• Что нужно знать для создания своего контрола
• Примеры реализованных контролов
• Ограничения
• Как не нужно делать
3
Проблема стандартных элементов управления
4
Знакомо?
4
5
Доступные возможности кастомизации
6
Сделать лучше
7
Что нужно знать для создания своего контрола
8
Основные составляющие
• Графический интерфейс
• Программный интерфейс
• Анимация
9
Графический интерфейс
10
Анатомия графического интерфейса
11
Иерархия subviews
-[UIView subviews]
-[UIView description]
https://gist.github.com/877593
12
Иерархия subviews
#import “UIView-YXDebug.h”- (void)viewDidAppear:(BOOL)animated { [super viewDidAppear:animated]; [self performSelector:@selector(dumpSubtree) withObject:nil afterDelay:2];}- (void)dumpSubtree { NSLog(@”%@”, [self.view subtreeDescription]);}
13
Иерархия sublayers
-[CALayer sublayers]
-[CALayer renderInContext:]
-[CALayer setBorderWidth:]
-[CALayer setBorderColor:]
https://gist.github.com/877611
14
Иерархия sublayers
#import “CALayer-YXDebug.h”- (BOOL)application:(UIApplication *)applicationdidFinishLaunchingWithOptions:(NSDictionary *)launchOptions {... [self performSelector:@selector(highlightSublayers) withObject:nil afterDelay:2];}- (void)highlightSublayers { [self.window.layer highlightSublayerBorders];}
15
Иерархия sublayers
16
UIKit Artwork Extractor
Извлекает все графические элементы системы
http://github.com/0xced/UIKit-Artwork-Extractor
17
UIKit Artwork Extractor
18
Программный интерфейс
19
Основные составляющие
• Приложение
• Фрэймворк
20
Анатомия приложения
• IPA — это ZIP-архив
• YourApp.ipa/Payload/YourApp.app/YourApp
21
Препарируем приложение или фрэймворкotool (например, otool -L, otool -oV) Подробнее: man otool
nm (например, nm -a | grep ‘ FUN ‘) Подробнее: man nm, man stab
class-dump-z
http://code.google.com/p/networkpx/wiki/class_dump_z
22
Препарируем приложениеKey-Value Coding
[yourControl valueForKey:@”yourKey”]
Objective-C runtime
object_getInstanceVariable()
23
Анимация
24
Препарируем анимацию
Плагин для iOS-симулятора — slowmo http://github.com/mschrag/slowmo
25
Применяем на практике
26
Что мы сделали
• YXTabBarController + YXTabBar
• YXSegmentedControl
• YXNavigationBar + YXSearchBar
• YXButton
27
YXTabBarController + YXTabBar
YXTabBar
YXTabBarController
28
YXSegmentedControl
YXSegmentedControl
UISegmentedControl
29
YXSearchBar + YXNavigationBar
30
YXButton
31
Ограничения кастомных компонент
• Недоступность приватных частей iOS
• Отсутствие интеграции с Interface Builder
32
Часто встречающиеся ошибки
• Дизайн ради дизайна
• Программная отрисовка интерфейса
• CoreGraphics
33
Заключение
• Рецепт кастомного интерфейса прост
• Графическая часть
• Программная часть
• Анимация
• Помните про ограничения