Используя iOS, как мне создать красную кнопку "удалить", аналогичную той, которая использовалась при удалении контактов на iPhone?
Как я могу создать большой красный UIButton с iOS?
Ответ 1
Сначала вы начинаете с растягиваемого изображения:
Затем вы создаете кнопку с растянутым изображением в качестве фона и применяете текст.
UIButton *sampleButton = [UIButton buttonWithType:UIButtonTypeCustom];
[sampleButton setFrame:CGRectMake(kLeftMargin, 10, self.view.bounds.size.width - kLeftMargin - kRightMargin, 52)];
[sampleButton setTitle:@"Button Title" forState:UIControlStateNormal];
[sampleButton setFont:[UIFont boldSystemFontOfSize:20]];
[sampleButton setBackgroundImage:[[UIImage imageNamed:@"redButton.png"] stretchableImageWithLeftCapWidth:10.0 topCapHeight:0.0] forState:UIControlStateNormal];
[sampleButton addTarget:self action:@selector(buttonPressed) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:sampleButton];
Очевидно, вам нужно будет отрегулировать начало и размер кадра в соответствии с вашим приложением, а также цель, селектор и заголовок.
Ответ 2
Я также сделал несколько кнопок... версии сетчатки и не-сетчатки
Если вы хотите использовать их в ячейке, просто используйте следующий код в cellForRowAtIndexPath:
UIButton *sampleButton = [UIButton buttonWithType:UIButtonTypeCustom];
[sampleButton setFrame:[cell.contentView frame]];
[sampleButton setFrame:CGRectMake(0, 0, cell.bounds.size.width-20, 44)];
[sampleButton setBackgroundImage:[UIImage imageNamed:@"button_red.png"] forState:UIControlStateNormal];
[cell addSubview:sampleButton];
Ответ 3
Я думаю, что эти лучше (и они отлично смотрятся на дисплее сетчатки):
.png, сгенерированный из этого очень приятного .psd файла: http://www.teehanlax.com/blog/2010/08/12/iphone-4-gui-psd-retina-display/
И затем используйте его как растяжимое изображение для фона вашего UIButton:
UIImage * greenButton = [UIImage imageNamed: @ "UIButton_green.png" ];
UIImage * newImage = [greenButton stretchableImageWithLeftCapWidth: greenButton.size.width/2 topCapHeight: greenButton.size.height/2];
[callButton setBackgroundImage: newImage forState: UIControlStateNormal];
Ответ 4
Я добавил некоторые изображения кнопок, доступные свободно под лицензией MIT, на мой сайт, которые более точно соответствуют кнопкам стекла iOS. (но этот форум не позволит мне отправлять изображения b/c, я новичок)
Чтобы загрузить их и пример кода, см.:
http://www.geneticmistakes.com/articles/1000/stretchable-dynamic-images-for-buttons
Ответ 5
Я сделал это недавно и создаю для него эту кнопку (и некоторый пример кода Monotouch для любых монотухов):
alt text http://www.yetanotherchris.me/storage/downloads/uiglassbutton-template.png
У него меньше скоса, которое лучше работает на любом фоне, но точно не соответствует iPhone UIGlassButton.
Ответ 6
Чтобы упростить любой цвет, я создал свой собственный рендеринг для UIButton, который позволяет вам настроить пользовательский оттенок.
Для тех, кого это интересует, его можно найти на github at
https://github.com/appsinyourpants/Pants-Framework/blob/master/Classes/Views/PFTintedButton.m
Ответ 7
Возможно, самый простой способ сделать это: этот файл графического интерфейса пользователя iPhone, содержащий множество элементов пользовательского интерфейса в PSD-слоях, затем измените оттенок большой кнопки в Photoshop и сохранить его как PNG.
Одно из преимуществ этого способа состоит в том, что вы также можете создавать версии для выбранной кнопки и/или выделять состояние и назначать изображения стандартным UIButton.
Ответ 8
Вы можете создать отдельный раздел в сводном представлении таблицы, дать этому разделу только одну строку и установить фоновое изображение ячейки на изображение с красным градиентом. Однако вам придется воссоздать это изображение самостоятельно.
Ответ 9
Я хотел бы внести решение, которое не использует изображения, но которое дает такой же вид, как кнопка "удалить" в "Контакты". В приведенном ниже примере я буду использовать UITableView с сгруппированными, статическими ячейками, разработанными в раскадровке. Сделайте один из разделов только одной ячейкой. Эта ячейка будет кнопкой "удалить". Дайте ячейке красный цвет фона (например, красный 221, зеленый 0, синий 2)
Что мы сделаем, так это добавить в ячейку два GradientLayers. Первый будет охватывать верхнюю половину ячейки. Второй будет охватывать нижнюю половину.
Добавьте QuartzCore в ваш файл реализации:
#import <QuartzCore/QuartzCore.h>
Начните с создания выхода в эту ячейку:
@property (strong, nonatomic) IBOutlet UITableViewCell *cellDelete;
Создайте метод, в котором ячейка будет отформатирована:
- (void)formatCellDelete
{
// Top Gradient //
CAGradientLayer *gradientTop = [CAGradientLayer layer];
// Make a frame for the layer based on the size of the cells contentView
// Make it half the height
// The width will be -20 so the gradient will not overflow
CGRect frame = CGRectMake(0, 0, _cellDelete.contentView.frame.size.width - 20, _cellDelete.contentView.frame.size.height / 2);
gradientTop.frame = frame;
gradientTop.cornerRadius = 8;
UIColor* topColor = [UIColor colorWithWhite:1.0f alpha:0.75f];
UIColor* bottomColor = [UIColor colorWithWhite:1.0f alpha:0.0f];
gradientTop.colors = [NSArray arrayWithObjects:(id)[topColor CGColor], (id)[bottomColor CGColor], nil];
[_cellDelete.contentView.layer setMasksToBounds:YES];
[_cellDelete.contentView.layer insertSublayer:gradientTop atIndex:0];
// Bottom Gradient //
CAGradientLayer *gradientBottom = [CAGradientLayer layer];
// Make a frame for the layer based on the size of the cells contentView
// Make it half the height
// The width will be -20 so the gradient will not overflow
frame = CGRectMake(0, 0, _cellDelete.contentView.frame.size.width - 20, _cellDelete.contentView.frame.size.height / 2);
// And move to bottom
frame.origin.y = frame.size.height;
gradientBottom.frame = frame;
topColor = [UIColor colorWithWhite:0.0f alpha:0.05f]; //0.20
bottomColor = [UIColor colorWithWhite:0.0f alpha:0.0f];
gradientBottom.colors = [NSArray arrayWithObjects:(id)[topColor CGColor], (id)[bottomColor CGColor], nil];
[_cellDelete.contentView.layer setMasksToBounds:YES];
[_cellDelete.contentView.layer insertSublayer:gradientBottom atIndex:0];
// Define a selected-backgroundColor so the cell changes color when the user tabs it
UIView *bgColorView = [[UIView alloc] init];
[bgColorView setBackgroundColor:[UIColor colorWithRed:(float)(0.502) green:0.0 blue:0.0 alpha:1.000]];
bgColorView.layer.cornerRadius = 10;
[_cellDelete setSelectedBackgroundView:bgColorView];
}
Вышеприведённое изображение придаст вашей ячейке стеклянную кнопку "Удалить" в "Контакты". Но мы также хотим, чтобы он менял цвет, когда пользователь удаляет его. Это то, что сделает последний фрагмент кода в указанном выше методе. Он будет устанавливать другое представление с более темным цветом в качестве выбранногоBackgroundView.
После нажатия ячейки останется выбранным и сохранит свой темный цвет. Чтобы автоматически отменить выбор ячейки, мы делаем следующее:
Начните с константы, которая определяет секцию nr вашей ячейки delete:
static NSInteger const SECTION_DELETE = 1;
Теперь реализуем метод (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath (определенный в UITableViewDelegate):
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
if(indexPath.section == SECTION_DELETE){
[tableView deselectRowAtIndexPath:indexPath animated:YES];
}
// Navigation logic may go here. Create and push another view controller.
/*
 *detailViewController = [[ alloc] initWithNibName:@"" bundle:nil];
// ...
// Pass the selected object to the new view controller.
[self.navigationController pushViewController:detailViewController animated:YES];
*/
}