Текст книги "iOS. Приемы программирования"
Автор книги: Вандад Нахавандипур
Жанр: Зарубежная компьютерная литература, Зарубежная литература
сообщить о неприемлемом содержимом
Текущая страница: 15 (всего у книги 59 страниц)
Разделы 2.0 и 10.5.
2.6. Присваивание характеристик динамическим эффектам
Постановка задачиВероятно, вас устраивает стандартная физика, по умолчанию встроенная в динамические поведения из UIKit. Но при работе с элементами, которыми вы управляете с помощью динамических поведений, может потребоваться присваивать этим элементам и иные характеристики, например массу и эластичность.
РешениеИнстанцируйте объект типа UIDynamicItemBehavior и присвойте ему ваши динамические элементы. После инстанцирования пользуйтесь различными свойствами этого класса для изменения характеристик динамических элементов. Затем добавьте это поведение к аниматору (см. раздел 2.0) – и все остальное аниматор сделает за вас.
ОбсуждениеДинамические поведения отлично подходят для добавления реалистичной физики к элементам, соответствующим протоколу UIDynamicItem, например ко всем видам типа UIView. Но в некоторых приложениях вам может понадобиться явно указать характеристики конкретного элемента. Например, в приложении, где используются эффекты тяготения и столкновения (см. разделы 2.1 и 2.2), вы, возможно, захотите указать, что один из элементов на экране, подвергающийся действию тяготения и столкновениям, должен отскакивать от границы сильнее, чем другой элемент. В другом случае, возможно, захотите указать, что в ходе воплощения различных визуальных эффектов, применяемых аниматором к элементу, этот элемент вообще не должен вращаться.
Подобные задачи решаются без труда с помощью экземпляров класса UIDynamicItemBehavior. Эти экземпляры также являются динамическими поведениями, и мы можем добавлять их к аниматору с помощью метода экземпляра addBehavior:, относящегося к классу UIDynamicAnimator, – в этой главе мы так уже делали. Когда вы инициализируете экземпляр этого класса, вы вызываете метод-инициализатор initWithItems: и передаете ваш вид либо какой угодно объект, соответствующий протоколу UIDynamicItem. В качестве альтернативы можете инициализировать экземпляр элемента с динамическим поведением с помощью метода init, а потом добавлять к этому поведению разнообразные объекты, пользуясь методом addItem:.
Экземпляры класса UIDynamicItemBehavior обладают настраиваемыми свойствами, которые вы можете корректировать, чтобы модифицировать поведение динамических элементов (например, видов). Далее перечислены и объяснены некоторые наиболее важные свойства этого класса.
• allowsRotation – логическое значение. Если оно равно YES, то, как понятно из названия, это свойство позволяет аниматору вращать динамические элементы в ходе применения к ним визуальных эффектов. В идеале вы должны устанавливать значение этого свойства в YES, если желаете имитировать реалистичную физику, но если по каким-то причинам в приложении необходимо гарантировать, что определенный элемент ни при каких условиях вращаться не будет, задайте для этого свойства значение NO и прикрепите элемент к этому поведению.
• resistance – сопротивление элемента движению. Это свойство может иметь значения в диапазоне от 0 до CGFLOAT_MAX. Чем выше значение, тем сильнее будет сопротивление, оказываемое элементом воздействующим на него силам (тем силам, которые вы к нему прикладываете). Например, если вы добавите к аниматору поведение тяготения и создадите в центре экрана вид с сопротивлением CGFLOAT_MAX, то тяготение не сможет сдвинуть этот вид к центру экрана. Вид просто останется там, где вы его создали.
• friction – это значение с плавающей точкой в диапазоне от 0 до 1. Оно указывает силу трения, которая должна действовать на края данного элемента, когда другие элементы соударяются с ним или проскальзывают по его краю. Чем выше значение, тем больше сила трения, применяемая к элементу.
Чем больше будет сила трения, которую вы применяете к элементу, тем более клейким он становится. Такая склонность элемента к прилипанию выражается в том, что когда другие элементы с ним сталкиваются, они задерживаются около клейкого элемента чуть дольше, чем обычно. Представьте себе, как действует трение на шины автомобиля. Чем больше сила трения между шинами и асфальтом, тем медленнее будет двигаться автомобиль, но тем лучше будет сцепление шин с дорогой, даже с довольно скользкой. Именно такой тип трения это свойство позволяет присваивать вашим элементам.
• elasticity – это значение с плавающей точкой в диапазоне от 0 до 1. Оно указывает, насколько эластичным должен быть элемент. Чем выше это значение, тем более пластичным и «желеобразным» будет этот элемент с точки зрения аниматора. О том, что такое эластичность, подробно рассказано в разделе 2.5.
• density – это значение с плавающей точкой в диапазоне от 0 до 1 (по умолчанию применяется значение 1). Оно не используется непосредственно для воздействия на поведение динамических поведений элементов, но с его помощью аниматор рассчитывает массу объектов и то, как эта масса отражается на визуальных эффектах. Например, если вы столкнете один элемент с другим (см. раздел 2.3), но у одного из них будет плотность 1, а у другого – 0,5, то при одинаковых высоте и ширине обоих элементов масса первого элемента будет больше, чем масса второго. Аниматор вычисляет массу элементов, исходя из их плотности и размеров экрана. Поэтому если вы столкнете маленький вид с высокой плотностью с большим видом с очень низкой плотностью, то маленький вид, в зависимости от конкретного размера и плотности этого элемента, может быть воспринят аниматором как более массивный объект, нежели крупный вид. В таком случае, аниматор может сильнее оттолкнуть тот элемент, который на экране кажется более крупным, тогда как толчок, сообщаемый крупным элементом мелкому, получится не столь значительным.
Перейдем к примеру. Он отчасти основан на примере, рассмотренном в разделе 2.2. В примере из этого раздела мы собираемся расположить один вид на другом, но тот вид, который находится снизу, будет очень эластичным, а эластичность вида, расположенного сверху, будет сравнительно невысока. Таким образом, когда оба вида упадут на дно экрана, где столкнутся с нижней границей, нижний вид отскочит от нее значительно сильнее, чем верхний. Итак, начнем с определения аниматора и других свойств контроллера вида:
#import «ViewController.h»
@interface ViewController ()
@property (nonatomic, strong) UIDynamicAnimator *animator;
@end
@implementation ViewController
<# Оставшаяся часть вашего кода находится здесь #>
Далее напишем удобный метод, с помощью которого сможем создавать виды с заранее заданными центральной точкой и цветом фона. Этот метод мы используем для создания двух очень похожих видов с разными центральными точками и окрашенных в разные фоновые цвета:
– (UIView *) newViewWithCenter:(CGPoint)paramCenter
backgroundColor:(UIColor *)paramBackgroundColor{
UIView *newView =
[[UIView alloc] initWithFrame:
CGRectMake(0.0f, 0.0f, 50.0f, 50.0f)];
newView.backgroundColor = paramBackgroundColor;
newView.center = paramCenter;
return newView;
}
Теперь, как только основной вид отобразится на экране, создадим два этих вида и также выведем их на дисплей:
UIView *topView = [self newViewWithCenter: CGPointMake(100.0f, 0.0f)
backgroundColor: [UIColor greenColor]];
UIView *bottomView = [self newViewWithCenter: CGPointMake(100.0f, 50.0f)
backgroundColor: [UIColor redColor]];
[self.view addSubview: topView];
[self.view addSubview: bottomView];
Далее добавим к видам поведение тяготения – этому мы научились в разделе 2.1:
self.animator = [[UIDynamicAnimator alloc]
initWithReferenceView: self.view];
/* Создаем тяготение */
UIGravityBehavior *gravity = [[UIGravityBehavior alloc]
initWithItems:@[topView, bottomView]];
[self.animator addBehavior: gravity];
Мы не хотим, чтобы виды выпадали за пределы экрана, достигнув его дна. Поэтому воспользуемся знаниями, приобретенными в разделе 2.2, и зададим для аниматора нижнюю границу, а также запрограммируем поведение столкновения:
/* Создаем обнаружение столкновений */
UICollisionBehavior *collision = [[UICollisionBehavior alloc]
initWithItems:@[topView, bottomView]];
collision.translatesReferenceBoundsIntoBoundary = YES;
[self.animator addBehavior: collision];
Наконец, очень важно добавить видам динамическое поведение, чтобы сделать верхний вид менее эластичным, чем нижний:
/* Теперь указываем эластичность элементов */
UIDynamicItemBehavior *moreElasticItem = [[UIDynamicItemBehavior alloc]
initWithItems:@[bottomView]];
moreElasticItem.elasticity = 1.0f;
UIDynamicItemBehavior *lessElasticItem = [[UIDynamicItemBehavior alloc]
initWithItems:@[topView]];
lessElasticItem.elasticity = 0.5f;
[self.animator addBehavior: moreElasticItem];
[self.animator addBehavior: lessElasticItem];
Итак, можете запустить приложение и посмотреть, как виды будут отскакивать от нижней границы экрана, как только ударятся об нее (рис. 2.4).
Рис. 2.4. Один вид эластичнее другого
См. такжеРаздел 2.0.
Глава3. Автоматическая компоновка и язык визуального форматирования
3.0. Введение
Выравнивание компонентов пользовательского интерфейса всегда было для программиста большой проблемой. В большинстве контроллеров видов в сложных приложениях для iOS содержится множество кода, решающего такие якобы тривиальные задачи, как упорядочение на экране фрейма с графическими элементами, выравнивание компонентов по горизонтали и вертикали и обеспечение того, что компоненты будут нормально выглядеть в различных версиях iOS. Причем проблема не только в этом, ведь многие программисты желают пользоваться одними и теми же контроллерами видов на разных устройствах, например на iPhone и iPad. Из-за этого код дополнительно усложняется. Apple упростила для нас решение таких задач, предоставив возможность автоматической компоновки (Auto Layout). Автоматическая компоновка, давно применявшаяся в OS X, теперь реализована и в iOS. Чуть позже мы подробно поговорим об автоматической компоновке, но для начала я позволю себе краткое введение и расскажу, для чего она нужна.
Допустим, у вас есть кнопка, которая обязательно должна находиться в центре экрана. Отношение между центром кнопки и центром вида, в котором она находится, можно упрощенно описать следующим образом:
• свойство кнопки center.x равно свойству вида center.x;
• свойство кнопки center.y равно свойству вида center.y.
Разработчики Apple заметили, что многие проблемы, связанные с позиционированием элементов пользовательского интерфейса, решаемы с помощью простой формулы:
object1.property1 = (object2.property2 * multiplier) + constant value
Например, воспользовавшись этой формулой, я могу без труда центрировать кнопку в ее вышестоящем виде, вот так:
button.center.x = (button.superview.center.x * 1) + 0
button.center.y = (button.superview.center.y * 1) + 0
С помощью этой же формулы вы можете делать некоторые по-настоящему отличные вещи при разработке пользовательского интерфейса приложений для iOS – вещи, которые ранее были просто неосуществимы. В iOS SDK вышеупомянутая формула обернута в класс, который называется NSLayoutConstraint. Каждый экземпляр этого класса соответствует ровно одному ограничению. Например, если вы хотите расположить кнопку в центре вида, владеющего этой кнопкой, то требуется центрировать координаты x и y этой кнопки. Таким образом, речь идет о создании двух ограничений. Но далее в этой главе мы познакомимся с языком визуального форматирования (Visual Format Language). Он отлично дополняет язык программирования для iOS и еще сильнее упрощает работу с макетами пользовательского интерфейса.
Ограничения можно создавать с помощью так называемых перекрестных видов. Например, если в одном виде у вас находится две кнопки и вы хотите, чтобы по вертикали между ними было 100 точек свободного пространства, то нужно создать ограничение, благодаря которому выполнялось бы это правило, но добавить его к общему родителю обеих этих кнопок. Скорее всего, это владеющий ими вид. Вот эти правила.
• Если ограничение находится между двумя видами, которые располагаются в общем родительском виде (то есть у обоих этих видов один и тот же вышестоящий родительский вид), добавьте ограничения к родительскому виду.
• Если ограничение находится между видом и его родительским видом, добавьте ограничение к родительскому виду.
• Если ограничение находится между двумя видами, которые не располагаются в общем родительском виде, добавьте это ограничение к общему предку интересующих вас видов.
На рис. 3.1 показано, как именно действуют эти ограничения.
Рис. 3.1. Отношения между ограничениями и видами, к которым эти ограничения должны добавляться
Ограничения создаются с помощью метода класса constraintWithItem: attribute: related By: toItem: attribute: multiplier: constant:, который относится к классу NSLayoutConstraint. Этот метод принимает следующие параметры:
• constraintWithItem – параметр типа id. Он соответствует объекту object1 в формуле, рассмотренной ранее;
• attribute – этот параметр представляет свойство property1 в вышеупомянутой формуле и должен относиться к типу NSLayoutAttribute;
• relatedBy – параметр соответствует знаку равенства в нашей формуле. Значение этого параметра относится к типу NSLayoutRelation и, как вы вскоре убедитесь, может выступать не только в качестве знака равенства, но и в роли знаков «больше» и «меньше». Мы подробно обсудим эти нюансы в данной главе;
• toItem – это параметр типа id. Он соответствует объекту object2 в формуле, рассмотренной ранее;
• attribute – параметр представляет свойство property2 в вышеупомянутой формуле и должен относиться к типу NSLayoutAttribute;
• multiplier – это параметр типа CGFloat, представляющий множитель в нашей формуле;
• constant – параметр также относится к типу CGFloat и представляет константу в формуле.
После создания ограничений вы сможете просто добавить их к соответствующему виду (рис. 3.1), воспользовавшись одним из следующих методов класса UIView:
• addConstraint: – метод позволяет добавить к виду одно ограничение типа NSLayoutConstraint;
• addConstraints: – этот метод позволяет добавить к виду массив ограничений. Ограничения должны относиться к типу NSLayoutConstraint, но в данном случае они будут обернуты в массив типа NSArray.
Автоматическая компоновка позволяет решать разнообразные задачи, в чем вы убедитесь в оставшейся части этой главы. Тем не менее чем подробнее вы будете знакомиться с этой темой, тем очевиднее будет становиться следующий факт: применяя автоматическую компоновку, вы вынуждены создавать все новые ограничения типа NSLayoutConstraint. Из-за этого ваш код будет разрастаться, а поддержка его – постоянно усложняться. Именно поэтому компания Apple разработала язык визуального форматирования, на котором можно описывать ограничения, пользуясь обычными символами ASCII. Например, если у вас есть две кнопки и вы хотите, чтобы по горизонтали эти кнопки всегда отстояли друг от друга на 100 точек, то нужно написать на языке визуального форматирования подобный код:
[button1]-100-[button2]
Ограничения, выражаемые на языке визуального форматирования, создаются с помощью метода класса constraintsWithVisualFormat: options: metrics: views:, относящегося к классу NSLayoutConstraint. Вот краткое описание каждого из параметров этого метода:
• constraintsWithVisualFormat – выражение на языке визуального форматирования, записанное как NSString;
• options – параметр типа NSLayoutFormatOptions. При работе с языком визуального форматирования этому параметру обычно передается значение 0;
• metrics – словарь констант, которые вы используете в выражении на языке визуального форматирования. Пока ради упрощения примеров будем передавать этому параметру значение nil;
• views – это словарь видов, для которых вы написали ограничение в первом параметре данного метода. Чтобы создать такой словарь, просто воспользуйтесь функцией NSDictionaryOfVariableBindings из языка C и передайте этому методу ваши новые объекты. Ключи в этом словаре – это названия видов, которые вы должны использовать в первом параметре метода. Не переживайте, если пока все это кажется странным и даже бессмысленным. Вскоре все будет понятно! Как только вы изучите несколько примеров, сразу получится стройная картина.
Вооружившись базовой информацией, не забивая голову ничем лишним, перейдем к практическим разделам. В качестве зарядки поупражняемся немного с ограничениями. Готовы? Поехали!
3.1. Размещение компонентов пользовательского интерфейса в центре экрана
Постановка задачиТребуется поместить компонент пользовательского интерфейса в центре экрана. Иными словами, мы собираемся расположить вид в центре его вышестоящего вида с помощью ограничений.
РешениеСоздайте два ограничения: одно для выравнивания позиции center.x целевого вида по позиции center.x вышестоящего вида, другое – для выравнивания позиции center.y целевого вида по позиции center.y вышестоящего вида.
ОбсуждениеНачнем с создания простой кнопки, которую выровняем по центру экрана. Как было указано в подразделе «Решение» текущего раздела, для этого всего лишь требуется гарантировать, что координаты x и y центра нашей кнопки будут соответствовать координатам x и y центра того вида, в котором находится кнопка. Для этого мы напишем два ограничения и добавим их к виду, включающему нашу кнопку (вышестоящему виду этой кнопки). Вот простой код, позволяющий добиться такого эффекта:
#import «ViewController.h»
@interface ViewController ()
@property (nonatomic, strong) UIButton *button;
@end
@implementation ViewController
– (void)viewDidLoad{
[super viewDidLoad];
/* 1) Создаем кнопку */
self.button = [UIButton buttonWithType: UIButtonTypeSystem];
self.button.translatesAutoresizingMaskIntoConstraints = NO;
[self.button setTitle:@"Button" forState: UIControlStateNormal];
[self.view addSubview: self.button];
UIView *superview = self.button.superview;
/* 2) Создаем ограничение для центрирования кнопки по горизонтали */
NSLayoutConstraint *centerXConstraint =
[NSLayoutConstraint constraintWithItem: self.button
attribute: NSLayoutAttributeCenterX
relatedBy: NSLayoutRelationEqual
toItem: superview
attribute: NSLayoutAttributeCenterX
multiplier:1.0f
constant:0.0f];
/* 3) Создаем ограничение для центрирования кнопки по вертикали */
NSLayoutConstraint *centerYConstraint =
[NSLayoutConstraint constraintWithItem: self.button
attribute: NSLayoutAttributeCenterY
relatedBy: NSLayoutRelationEqual
toItem: superview
attribute: NSLayoutAttributeCenterY
multiplier:1.0f
constant:0.0f];
/* Добавляем ограничения к вышестоящему виду кнопки */
[superview addConstraints:@[centerXConstraint, centerYConstraint]];
}
@end
Этот контроллер вида пытается сообщить iOS, что он поддерживает все возможные ориентации интерфейса, применимые на этом устройстве. Этот факт подтверждает, что кнопка действительно будет расположена в центре экрана, независимо от типа устройства и его ориентации. Тем не менее, прежде чем этот метод начнет действовать, вы должны убедиться, что активировали все необходимые виды ориентации внутри самого проекта. Для этого перейдите в Xcode к свойствам целевого проекта, откройте вкладку General (Общие), а в ней найдите раздел Device Orientation (Ориентация устройства). Затем активизируйте все возможные виды ориентации (рис. 3.2).
Рис. 3.2. Активизируем в Xcode все виды ориентации, поддерживаемые для целевого проекта
Теперь, если запустить это приложение на устройстве или эмуляторе, вы увидите на экране обычную кнопку. Сколько бы вы ни вращали устройство, кнопка никуда не сдвигается с центра экрана. Мы смогли достичь этого, не написав ни строки кода для настройки фрейма кнопки, а также без прослушивания каких-либо изменений ориентации и без корректирования положения кнопки. Фактически здесь были применены только возможности автоматической компоновки (рис. 3.3). Этот подход выигрышен по той простой причине, что наш код теперь будет работать на любом устройстве, независимо от его ориентации и разрешения экрана. Напротив, если бы мы программировали фрейм для компонентов пользовательского интерфейса, то пришлось бы создавать отдельные фреймы для каждого целевого устройства во всех интересующих нас ориентациях, поскольку на разных устройствах с iOS могут использоваться экраны с довольно несхожими разрешениями. В частности, приложение, написанное в этом разделе, будет отлично работать и на iPad, и на iPhone, причем кнопка будет находиться в центре экрана независимо от ориентации устройства и разрешения его экрана.
Рис. 3.3. Кнопка остается в центре экрана при любой ориентации
Правообладателям!
Это произведение, предположительно, находится в статусе 'public domain'. Если это не так и размещение материала нарушает чьи-либо права, то сообщите нам об этом.
