Noveo iOS school. Lecture 5.

1. iOS Internship 2014
UIKit (part II)

2. UIKit
framework
UIView subclassing
CALayer, transformations
UIScrollView
UITableView + UITableViewCell
UICollectionView +
UICollectionViewCell
лекция 5
(продолжение)

3. UIKit Framework
- (id)initWithFrame:(CGRect)frame — designated initializer
- (id)initWithCoder:(NSCoder *)aCoder — при создании объекта view из XIB/Storyboard
- (void)layoutSubviews — определяет расположение вложенных view
- (void)updateConstraints — определяет расположение вложенных view
- (void)drawRect:(CGRect)rect — выполняет отрисовку полностью кастомной view
- (CGSize)sizeThatFits:(CGSize)size — предпочтительный размер
UIView subclassing

4. UIKit Framework
Свойства, которые можно анимировать:
● frame
● bounds
● center
● transform
● alpha
● backgroundColor
● contentStretch
UIView animation

5. UIKit Framework
[UIView animateWithDuration:2 animations:^{
self.aView.transform =
CGAffineTransformRotate(self.view.transform, M_PI / 3.0);
self.textLabel.center = destinationPoint;
}];
UIView animation

6. UIKit Framework
Содержится в каждой UIView, отвечает за отрисовку.
● @property CGPoint anchorPoint
● @property CGColorRef borderColor
● @property CGFloat borderWidth
● @property CGFloat cornerRadius
● @property BOOL masksToBounds
● @property CGColorRef shadowColor
● @property CGSize shadowOffset
● @property float shadowOpacity
● @property CATransform3D transform
В реальности для фонов, рамок, скруглений и прочего используются картинки, т.к. это даёт
больше гибкости и работает ощутимо быстрее.
CALayer

7. UIKit Framework
CALayer
self.textLabel = [[UILabel alloc] initWithFrame:self.view.bounds];
self.textLabel.layer.shadowColor = [UIColor whiteColor].CGColor;
self.textLabel.layer.shadowRadius = 12;
self.textLabel.layer.shadowOpacity = 1;
self.textLabel.layer.masksToBounds = NO;
self.button = [[UIButton alloc] initWithFrame:(CGRect){20, 20, 100, 40}];
self.button.backgroundColor = [UIColor brownColor];
self.button.layer.masksToBounds = YES;
self.button.layer.cornerRadius = 8;
self.button.layer.borderWidth = 2;
self.button.layer.borderColor = [UIColor blackColor].CGColor;

8. UIKit Framework
● Скроллинг по контенту, который не влезает на экран полностью
● Зум контента с помощью стандартных жестов
● Анимированная навигация по отдельным экранам (паджинация)
UIScrollView

9. UIKit Framework
@interface ViewController ()
//...
@property (strong, nonatomic) IBOutlet UIImageView *imageView;
@property (strong, nonatomic) IBOutlet UIScrollView *contentScroller;
@end
@implementation ViewController
- (void)viewDidLoad
{
[super viewDidLoad];
self.contentScroller = [[UIScrollView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:self.contentScroller];
self.imageView = [[UIImageView alloc] initWithImage:self.image];
[self.contentScroller addSubview:self.imageView];
self.contentScroller.contentSize = self.imageView.frame.size;
}
@end
UIScrollView

10. UIKit Framework
Показ большого (но конечного) количества элементов с навигацией свайпами.
UIScrollView
34 3635
cur nextprev content view
scroll view (visible area)

11. UIKit Framework
Показ большого (но конечного) количества элементов с навигацией свайпами.
UIScrollView
34 3635
cur nextprev content view
scroll view (visible area)
373635
cur next content viewprev
obj_1 obj_2 obj_3
obj_2 obj_3 obj_1
34
obj_1

12. UIKit Framework
- (void)viewDidLoad
{
[super viewDidLoad];
self.contentScroller = [[UIScrollView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:self.contentScroller];
self.contentScroller.delegate = self;
//...
}
// Вызывается постоянно во время скролла,
// наш код должен работать быстро!
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
// Вычисляем номер элемента, центр которого ближе всего
// Если это не текущий элемент:
// - делаем видимый элемент центральным
// - подгружаем новый соседний элемент
// - исправляем координаты соседних элементов.
}
UIScrollView

13. UIKit Framework
● Список однородных элементов (ячейки могут быть разного типа, но основной смысл всё-таки в
повторении)
● Стандартная схема для переиспользования объектов
● Реакция на прокрутку, нажатие, свайпы
● Стандартная реализация добавления/удаления/перемещения (включая анимации)
UITableView

14. UIKit Framework
● Таблица запрашивает количество групп, количество ячеек, а так же сами ячейки у объекта, объявившего
себя DataSource-ом этой таблицы.
● Таблица сообщает о выделении (тап), удалении (свайп влево) и т.д. объекту, объявившему себя
Delegate-ом этой таблицы.
● Таблица запрашивает размеры ячеек, размеры и вьюхи заголовков и прочие параметры кастомизации у
делегата.
● Каждая ячейка таблицы принадлежит классу UITableViewCell (или наследнику).
● В памяти находятся только видимые ячейки (+ иногда несколько "запасных"). Когда ячейка уходит из
области видимости, она перемещается в буфер. Когда нужно показать новую ячейку, она не создаётся, а
берётся из буфера. Это позволяет экономит память (меньшее количество элементов) и повышает
скорость (поменять данные в имеющемся объекте обычно быстрее, чем создать новый).
UITableView

15. UIKit Framework
Необходимый минимум для работы с таблицей:
● создать объект-таблицу и поместить его на видимую view
● задать dataSource (объект должен отвечать протоколу UITableViewDataSource)
● в DataSource переопределить следующие методы:
- (UITableViewCell *)tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)ip
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
UITableView

16. UIKit Framework
Необходимый минимум для работы с таблицей:
● создать объект-таблицу и поместить его на видимую view
● задать dataSource (объект должен отвечать протоколу UITableViewDataSource)
● в DataSource переопределить следующие методы:
- (UITableViewCell *)tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)ip
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
Для обработки нажатия на элемент списка необходимо:
● задать delegate (объект должен отвечать протоколу UITableViewDelegate )
● в Delegate переопределить метод
- (void)tableView:(UITableView *)tv didSelectRowAtIndexPath:(NSIndexPath *)ip
UITableView

17. UIKit Framework
UITableView
#import "MyCell.h"
//...
- (void)viewDidLoad
{
[super viewDidLoad];
// При использовании отдельной XIB для вьюхи ячейки MyCell
[self.tableView registerNib:[MyCell cellNib] forCellReuseIdentifier:[MyCell cellIdentifier]];
}
- (UITableViewCell *)tableView:(UITableView *)tv cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
MyCell *myCell = [tv dequeueReusableCellWithIdentifier:[MyCell cellIdentifier]];
// Кастомизация myCell (меняем данные на актуальные для элемента по индексу indexPath)
//...
//...
return myCell;
}

18. UIKit Framework
UICollectionView
● двумерная коллекция (однородных) элементов
● работа с коллекцией очень похожа на UITableView
● мощные средства кастомизации лейаута элементов

19. UIKit Framework
Необходимый минимум для работы с коллекцией:
● создать объект-коллекцию и поместить его на видимую view
● задать dataSource (объект должен отвечать протоколу UICollectionViewDataSource)
● в DataSource переопределить следующие методы:
- (NSInteger)collectionView:(UICollectionView *)collectionView
numberOfItemsInSection:(NSInteger)section
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
cellForItemAtIndexPath:(NSIndexPath *)indexPath
Для обработки нажатия на элемент коллекции необходимо:
● задать delegate (объект должен отвечать протоколу UICollectionViewDelegate )
● в Delegate переопределить метод
- (void)collectionView:(UICollectionView *)collectionView
didSelectItemAtIndexPath:(NSIndexPath *)indexPath
UICollectionView