|
Май
20
|
В создании кнопок и привязке к ним действий нет ничего сложного, но и результат оригинальностью не блещет.
Так выглядит стандартная кнопка:
Она же в нажатом (активированном) состоянии:
Закругленные углы — это, конечно, неплохо. Активированная версия тоже ничего. А вот белый фон меня совершенно не устраивает. Откройте приложение “Clock” и переключитесь на секундомер (Stopwatch). По-моему, кнопки “Start/Stop” и “Reset/Lap” выглядят приличнее.
Возможно, вы уже обратили внимание, что в редакторе Interface Builder есть возможность настроить цвет фона для метода “UIButton“. Ниже показана кнопка с зеленым фоном:
Это все! Вот и мы и добрались до сути. На этом закончим — до следующего урока. 
Извините за шутку, не сдержался. Представленная выше кнопка больше похожа на телевизор 90-х, чем на зеленую кнопку. Чтобы результат был таким же, как в секундомере, нужно избавиться от метода “UIButton“, заменив его на “UISegmentedControl“.
Метод “UISegmentedControl“, как правило, встречается в опциях/настройках представлений, где на выбор предлагается несколько вариантов.
В этот раз мы будем редактировать следующий метод “UISegmentedControl“:
превратив его в такую вот приятную кнопку:
Обойтись исключительно средствами редактора Interface Builder у нас не получится. Необходимо будет создать спецификатор “IBOutlet” и связать его с созданным в IB методом “UISegmentedControl“.
1 | IBOutlet UISegmentedControl *myShinyButton; |
В редакторе IB переключитесь на атрибуты “UISegmentedControl” и установите “Segments=1“, чтобы метод включал только один сегмент — кнопку. Установите флажок “momentary“: в приведенном выше примере с методом “UISegmentedControl” (First | Second) сначала выбирается значение “First“, после чего кнопка остается в этом состоянии, пока вы не выберете “Second“. При установке флажка “momentary” сегмент вернется в нормальное состояние через секунду. Для опции “Style” укажите значение “Bar“, поскольку предложенным мной способом можно отредактировать только такой объект. Последним шагом снимите для текущего сегмента флажок “selected“. После двойного щелчка на кнопке введите любой текст. Теперь кнопка должна выглядеть примерно так:
Можно выбрать для нее цвет, но сделать это необходимо в Xcode. Воспользуйтесь свойством “tintColor“:
1 | myShinyButton.tintColor = [UIColor darkGrayColor]; |
Вот как после этого будет выглядеть кнопка:
Обратите внимание - в качестве свойства “tintColor” лучше не выбирать насыщенные оттенки. В противном случае, разницы между нормальным состоянием кнопки и активированным, когда цвет становится интенсивнее, практически не будет. Соответственно, вместо “blackColor” лучше выбрать “darkGrayColor“. При желании поэкспериментируйте с RGB-цветами, где есть возможность контролировать насыщенность красного, зеленого и синего.
Программный код.
1 2 3 4 5 6 | codeButton = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObject:@"My Button"]]; codeButton.segmentedControlStyle = UISegmentedControlStyleBar; codeButton.momentary = YES; codeButton.tintColor = [UIColor lightGrayColor]; codeButton.center = CGPointMake(160,400); [self.view addSubview:codeButton]; |
Примечание: здесь я не буду вдаваться в подробности, но не забывайте, что в качестве кнопки всегда можно воспользоваться изображением (тип “UIButton”: custom). Пример простого кода:
1 2 3 | [button setImage:[UIImage imageNamed:@"myButton.png"] forState:UIControlStateNormal]; [button setImage:[UIImage imageNamed:@"myButton_highlighted.png"] forState:UIControlStateHighlighted]; [button setImage:[UIImage imageNamed:@"myButton_selected.png"] forState:UIControlStateSelected]; |
Для нужного эффекта достаточно подобрать соответствующее изображение.
Действия.
Для установки связей между действиями и кнопками, созданными с помощью “UISegmentedControl“, вместо “Touch Up Inside” воспользуйтесь событием “value changed“. В редакторе IB это крайне простая операция, но попробуйте выполнить ее программными средствами.
1 | [codeButton addTarget:self action:@selector(simpleAction) forControlEvents:UIControlEventValueChanged]; |
И напоследок образец проекта:
Исходный код скачать можно [здесь]
Текст оригинальной статьи на английском языке [здесь]
Уважаемые читатели, данный материал был переведен и подготовлен к публикации проектом LookApp.ru, при публикации на другом сайте ссылка на LookApp.ru обязательна.
(2 голосов, средний: 4.50 из 5)
Загрузка ...
Ноябрь 1st, 2009 at 12:25
Для установки связей между действиями и кнопками, созданными с помощью “UISegmentedControl“, вместо “Touch Up Inside” воспользуйтесь событием “value changed“.
Для этого приходится два раза кнопку нажимать чтобы свершилось действие, можно ли как то избавится?