iOS. Приемы программирования — страница 5 из 124

Постановка задачи

Вы хотите дать пользователям возможность включать и отключать определенные функции.

Решение

Воспользуйтесь классом UISwitch.

Обсуждение

Класс UISwitch предоставляет инструмент управления ON/OFF (Вкл./Выкл.), как на рис. 1.7. Этот инструмент используется для работы с автоматической капитализацией, автоматическим исправлением орфографических ошибок и т. д.


Рис. 1.7. Переключатель UISwitch, применяемый в приложении Settings (Настройки) в iPhone


Создать переключатель можно либо с помощью конструктора интерфейса, либо сделав экземпляр такого переключателя в коде. Решим эту задачу вторым способом. Итак, следующая проблема — определить, в каком классе разместить соответствующий код. Это должен быть класс View Controller (Контроллер вида), который мы еще не изучали, но, поскольку в этой главе мы создаем программу типа Single View Application (Приложение с единственным видом), файл реализации (.m) контроллера вида будет называться ViewController.m. Откроем этот файл.

Создадим свойство типа UISwitch и назовем его mainSwitch:


#import «ViewController.h»


@interface ViewController ()

@property (nonatomic, strong) UISwitch *mainSwitch;

@end


@implementation ViewController

Теперь перейдем к файлу реализации контроллера вида (файлу. m) и синтезируем свойство mySwitch:

#import «Creating_and_Using_Switches_with_UISwitchViewController.h»


@implementation Creating_and_Using_Switches_with_UISwitchViewController


@synthesize mySwitch;



Можно продолжить и перейти к созданию переключателя. Найдем метод viewDidLoad в файле реализации нашего контроллера вида:


— (void)viewDidLoad{

[super viewDidLoad];

}

Создадим переключатель и поместим его в виде, в котором находится контроллер нашего вида:

— (void)viewDidLoad{

[super viewDidLoad];


/* Создаем переключатель */

self.mainSwitch = [[UISwitch alloc] initWithFrame:

CGRectMake(100, 100, 0, 0)];


[self.view addSubview: self.mainSwitch];

}


Итак, мы выделили объект типа UISwitch и применили метод initWithFrame: для инициализации переключателя. Обратите внимание: параметр, который мы должны передать этому методу, относится к типу CGRect. CGRect определяет границы прямоугольника, отсчитывая их от точки с координатами (x; y), находящейся в левом верхнем углу прямоугольника, и также используя данные о его ширине и высоте. Можно создать CGRect, воспользовавшись встраиваемым методом CGRectMake, где первые два параметра, передаваемые методу, — это координаты (x; y), а следующие два — высота и ширина прямоугольника.

Создав переключатель, мы просто добавляем его к виду нашего контроллера.

Теперь запустим приложение на эмуляторе iPhone. На рис. 1.8 показано, что происходит.


Рис. 1.8. Переключатель, размещенный в виде


Как видите, по умолчанию переключатель находится в состоянии Off (Выкл.). Чтобы задать в качестве стандартного противоположное состояние, можно изменить значение свойства on экземпляра UISwitch. Или можно вызвать метод setOn:, относящийся к переключателю:

[self.mySwitch setOn: YES];

Мы можем немного облегчить работу пользователю, применив метод переключателя setOn: animated:. Параметр animated принимает логическое значение. Если логическое значение равно YES, то при переходе переключателя из состояния on в состояние off этот процесс будет анимироваться, а также будут анимироваться любые взаимодействия пользователя с переключателем.

Очевидно, вы можете считывать информацию свойства on переключателя, чтобы узнавать, включен переключатель в данный момент или выключен. В качестве альтернативы можно пользоваться методом переключателя isOn:


if ([self.mySwitch isOn]){

NSLog(@"The switch is on.");

} else {

NSLog(@"The switch is off.");

}


Если вы хотите получать уведомления о том, когда переключатель переходит в состояние «включено» или «выключено», необходимо указать ваш класс как цель (Target) переключателя, воспользовавшись методом addTarget: action: forControlEvents: класса UISwitch:


[self.mySwitch addTarget: self

action:@selector(switchIsChanged:)

forControlEvents: UIControlEventValueChanged];


Затем реализуем метод switchIsChanged:. Когда среда времени исполнения вызовет этот метод в ответ на событие переключателя UIControlEventValueChanged, она передаст переключатель как параметр данного метода и вы сможете узнать, какой именно переключатель инициировал данное событие:


— (void) switchIsChanged:(UISwitch *)paramSender{


NSLog(@"Sender is = %@", paramSender);


if ([paramSender isOn]){

NSLog(@"The switch is turned on.");

} else {

NSLog(@"The switch is turned off.");

}


}


Теперь попробуем запустить наше приложение в эмуляторе iOS. В окне консоли вы увидите примерно такие сообщения:


Sender is = 

frame = (100 100; 79 27);

layer = >

The switch is turned off.

Sender is = 

frame = (100 100; 79 27);

layer = >

Переключатель включен.

1.3. Оформление UISwitch

Постановка задачи

Вы вставили в ваш пользовательский интерфейс несколько экземпляров UISwitch и теперь хотите оформить их так, чтобы они вписывались в этот графический интерфейс.

Решение

Используйте одно из свойств настройки тонов/изображений класса UISwitch, например tintColor или onTintColor.

Обсуждение

Apple проделала огромную работу по обеспечению оформления компонентов пользовательского интерфейса, в частности UISwitch. В предыдущих версиях SDK разработчикам приходилось производить подкласс от UISwitch лишь для того, чтобы изменить внешний вид и цвет элемента. В современном iOS SDK такие задачи решаются гораздо проще.

Существует два основных способа оформления переключателя.

 Работа с оттенками. Оттенки — это цветовые тона, которые вы можете применять к компоненту пользовательского интерфейса, например к UISwitch. Новый оттенок накладывается поверх актуального цвета компонента. Например, при работе с обычным UISwitch вы наверняка сталкивались с разными цветами. Когда вы применяете оттенок поверх цвета, этот цвет смешивается с наложенным оттенком. Таким образом создается разновидность оттенка, действующая в данном элементе пользовательского интерфейса.

 Изображения. Переключателю соответствуют:

 изображение включенного состояния. Находится на переключателе, когда он включен. Ширина изображения составляет 77 точек, высота — 22 точки;

 изображение выключенного состояния. Находится на переключателе, когда он выключен. Ширина изображения составляет 77 точек, высота — 22 точки.

На рис. 1.9 показаны примеры изображений, используемых при включенном и выключенном переключателе.


Рис. 1.9. Переключатель UISwitch и изображения, соответствующие его включенному и выключенному состояниям


Итак, переключатель может находиться в одном из двух состояний — он либо включен, либо выключен. Теперь рассмотрим, как изменить оттенок переключателя, находящегося в пользовательском интерфейсе. Это можно сделать с помощью трех важных свойств класса UISwitch (все эти свойства относятся к типу UIColor):

tintColor — оттенок, применяемый к переключателю в выключенном состоянии. К сожалению, Apple подобрала для него не совсем точное название (правильнее было бы, конечно, назвать это свойство offTintColor);

• thumbTintColor — оттенок, который будет применяться к рычажку переключателя;

• onTintColor — оттенок, применяемый к переключателю во включенном состоянии.

Далее приведен простой пример кода, изменяющий оттенок переключателя во включенном состоянии на красный, в выключенном — на коричневый. При этом рычажок будет иметь зеленый цвет. Это не самая лучшая комбинация цветов, но в целях, поставленных в данном разделе, я остановлюсь именно на таком варианте:


— (void)viewDidLoad

{

[super viewDidLoad];


/* Создаем переключатель */

self.mainSwitch = [[UISwitch alloc] initWithFrame: CGRectZero];

self.mainSwitch.center = self.view.center;

[self.view addSubview: self.mainSwitch];


/* Оформляем переключатель */


/* Изменяем оттенок, который будет у переключателя в выключенном виде */

self.mainSwitch.tintColor = [UIColor redColor];

/* Изменяем оттенок, который будет у переключателя во включенном виде */

self.mainSwitch.onTintColor = [UIColor brownColor];

/* Изменяем также оттенок рычажка на переключателе */

self.mainSwitch.thumbTintColor = [UIColor greenColor];

}


Теперь, когда мы закончили работу с оттенками переключателя, перейдем к оформлению внешнего вида переключателя, связанному с использованием изображений «включено» и «выключено». При этом не забываем, что заказные изображения «включено» и «выключено» поддерживаются только в iOS 6 и старше. iOS 7 игнорирует такие изображения и при оформлении внешнего вида работает только с оттенками. Как было указано ранее, оба варианта изображения на переключателе — как для включенного, так и для выключенного состояния — должны иметь ширину 77 точек и высоту 22 точки. Поэтому я подготовил новый комплект таких изображений (для работы с обычным и сетчатым дисплеем). Я добавил их в мой проект в Xcode под названиями On@2x.png и Off@2x.png (для сетчатого дисплея), а также поместил здесь разновидности изображений для обычного дисплея. Теперь нам предстоит создать переключатель, но присвоить ему заказные изображения «включено» и «выключено». Для этого воспользуемся следующими свойствами UISwitch:

onImage — как указано ранее, это изображение будет использоваться, когда переключатель включен;

• offImage — это изображение соответствует переключателю в состоянии «выключено».

А вот код, позволяющий добиться такого эффекта:


— (void)viewDidLoad

{

[super viewDidLoad];


/* Создаем переключатель */

self.mainSwitch = [[UISwitch alloc] initWithFrame: CGRectZero];

self.mainSwitch.center = self.view.center;

/* Убеждаемся, что переключатель не выглядит размытым в iOS-эмуляторе */

self.mainSwitch.frame = [self roundedValuesInRect: self.mainSwitch.frame];

[self.view addSubview: self.mainSwitch];


/* Оформляем переключатель */

self.mainSwitch.onImage = [UIImage imageNamed:@"On"];

self.mainSwitch.offImage = [UIImage imageNamed:@"Off"];

}

См. также

Раздел 1.2.

1.4. Выбор значений с помощью UIPickerView