Читать книгу iOS. Приемы программирования - Вандад Нахавандипур - Страница 24

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

Необходимо дать пользователям возможность указывать определенное значение из диапазона и предоставить для этого удобный в применении и интуитивно понятный пользовательский интерфейс.

Решение

Используйте класс UISlider.

Обсуждение

Вероятно, вы уже знаете, что такое слайдер. Пример слайдера показан на рис. 1.17.

Рис. 1.17. В нижней части экрана находится слайдер, регулирующий уровень громкости

Чтобы создать слайдер, нужно инстанцировать объект типа UISlider. Создадим слайдер и поместим его на вид нашего контроллера. Начнем с файла реализации нашего контроллера вида:

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic, strong) UISlider *slider;

@end

@implementation ViewController

…

Теперь рассмотрим метод viewDidLoad и создадим сам компонент-слайдер. В этом коде мы будем создавать слайдер, позволяющий выбирать значения в диапазоне от 0 до 100. По умолчанию ползунок слайдера будет установлен в среднем значении шкалы:

– (void)viewDidLoad{

[super viewDidLoad];

self.slider = [[UISlider alloc] initWithFrame: CGRectMake(0.0f,

0.0f,

200.0f,

23.0f)];

self.slider.center = self.view.center;

self.slider.minimumValue = 0.0f;

self.slider.maximumValue = 100.0f;

self.slider.value = self.slider.maximumValue / 2.0;

[self.view addSubview: self.slider];

}

Диапазон слайдера совершенно не зависит от его внешнего вида. С помощью указателя диапазона мы приказываем слайдеру вычислить его (слайдера) значение, основываясь на относительной позиции в рамках диапазона. Например, если для слайдера задан диапазон от 0 до 100, то когда ползунок слайдера расположен у левого края шкалы, свойство слайдера value равно 0, а если ползунок стоит у правого края, оно равно 100.

Как будут выглядеть результаты? Теперь вы можете запустить приложение в эмуляторе (рис. 1.18).

Рис. 1.18. Обычный слайдер в центре экрана

Для получения желаемых результатов мы использовали несколько свойств слайдера. Что это за свойства?

• minimumValue – задает минимальное значение диапазона, поддерживаемого слайдером.

• maximumValue – задает максимальное значение диапазона, поддерживаемого слайдером.

• value – текущее значение слайдера. Это свойство доступно как для чтения, так и для изменения, то есть вы можете как считывать это значение, так и записывать в него информацию. Если вы хотите, чтобы при перемещении ползунка в это значение включалась анимация, то можно вызвать метод слайдера setValue: animated: и передать YES в качестве значения параметра animated.

Ползунок слайдера называется также бегунком. Если вы хотите получать событие всякий раз, когда передвигается ползунок слайдера, нужно добавить ваш объект, которому требуется информация о таких событиях, в качестве цели слайдера с помощью относящегося к слайдеру метода addTarget: action: forControlEvents::

– (void) sliderValueChanged:(UISlider *)paramSender{

if ([paramSender isEqual: self.mySlider]){

NSLog(@"New value = %f", paramSender.value);

}

}

– (void)viewDidLoad{

[super viewDidLoad];

self.view.backgroundColor = [UIColor whiteColor];

self.mySlider = [[UISlider alloc] initWithFrame: CGRectMake(0.0f,

0.0f,

200.0f,

23.0f)];

self.slider.center = self.view.center;

self.slider.minimumValue = 0.0f;

self.slider.maximumValue = 100.0f;

self.slider.value = self.slider.maximumValue / 2.0;

[self.view addSubview: self.slider];

[self.slider addTarget: self

action:@selector(sliderValueChanged:)

forControlEvents: UIControlEventValueChanged];

}

Если сейчас запустить приложение в эмуляторе, вы увидите, что вызывается целевой метод sliderValueChanged: и это происходит всякий раз, как только перемещается ползунок слайдера. Возможно, именно этого вы и хотели. Но в некоторых случаях уведомление требуется лишь тогда, когда пользователь отпустил ползунок, установив его в новом значении. Если вы хотите дождаться такого уведомления, установите для свойства слайдера continuous значение NO. Если это свойство имеет значение YES (задаваемое по умолчанию), то на цели слайдера вызов будет идти непрерывно все то время, пока движется ползунок.

В SDK iOS разработчик также может изменять внешний вид слайдера. Например, ползунок может иметь нестандартный вид. Чтобы изменить внешний вид ползунка, просто пользуйтесь методом setThumbImage: forState: и передавайте нужное изображение, а также второй параметр, который может принимать одно из двух значений:

• UIControlStateNormal – обычное состояние ползунка, когда его не трогает пользователь;

• UIControlStateHighlighted – изображение, которое должно быть на месте ползунка, когда пользователь начинает его двигать.

Я подготовил два изображения: одно для стандартного состояния ползунка, а другое – для активного (затронутого) состояния. Добавим их к слайдеру:

[self.slider setThumbImage: [UIImage imageNamed:@"ThumbNormal.png"]

forState: UIControlStateNormal];

[self.slider setThumbImage: [UIImage imageNamed:@"ThumbHighlighted.png"]

forState: UIControlStateHighlighted];

Теперь взглянем, как выглядит в эмуляторе неактивный слайдер (рис. 1.19).

Рис. 1.19. Слайдер со специально оформленным ползунком