如何用iPhone SDK创build一个大的红色UIButton？

使用iPhone SDK，我将如何去创build一个类似于删除iPhone上的联系人使用的红色“删除”button？

Answer 1

你首先从一个可拉伸的图像开始：

替代文字http://grab.by/4lP

然后你用拉伸的图像作为背景制作一个button并应用文本。

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]; 

显然，你需要调整框架的原点和大小来匹配你的应用程序，以及目标，select器和标题。

Answer 2

我也做了一些button…视网膜和非视网膜版本

如果您想在Cell中使用它们，请在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]; 

Answer 3

我认为那些更好（ 在视网膜显示器上它们也很好 ）：

从这个非常不错的.psd文件生成.png： 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];

Answer 4

我已经在我的网站上添加了一些按照MIT许可证免费提供的button图像，这些button图像与iOS玻璃button更加匹配。 （但这个论坛不会让我张贴图像B / C我是新来的）

要下载它们以及示例代码，请参阅：

http://www.geneticmistakes.com/articles/1000/stretchable-dynamic-images-for-buttons

Answer 5

我最近也做了这个，并且为它创build了这个button（ 以及一些Monotouch示例代码 ）：

替代文字http://www.yetanotherchris.me/storage/downloads/uiglassbutton-template.png

它有一个在任何背景下工作更好的斜面，但不完全匹配的iPhone UIGlassButton 。

Answer 6

为了方便任何颜色，我为UIButton创build了自己的渲染，让您设置自定义的色调。

对于那些感兴趣的，可以在github上find

https://github.com/appsinyourpants/Pants-Framework/blob/master/Classes/Views/PFTintedButton.m

Answer 7

可能最简单的方法就是抓住这个包含大量PSD图层的iPhonegraphics用户界面Photoshop文件 ，然后在Photoshop中改变大button的色调，并将其保存为PNG格式。

这样做的一个好处是，您还可以创buildbuttonselect和/或突出显示状态的版本，并将图像分配给标准的UIButton。

Answer 8

您可以在分组表格视图中创build一个单独的部分，仅为该部分提供一行，并将该单元格的背景图像设置为红色渐变图像。 不过，您必须自己重新创build该图像。

Answer 9

我想提供一个解决scheme，不使用图像，但提供了与联系人中的“删除”button相同的外观。 在下面的例子中，我将使用假设一个UITableView 分组静态单元格，在故事板中devise。 使其中一个部分只有一个单元格。 该单元格将是“删除”button。 给单元格一个红色的背景颜色（铁红221，绿0，蓝2）

我们要做的是将两个GradientLayer添加到单元格中。 第一个将覆盖细胞的上半部分。 第二个将覆盖下半部分。

将QuartzCore添加到您的实现文件中：

 #import <QuartzCore/QuartzCore.h> 

从这个单元格开始出发：

 @property (strong, nonatomic) IBOutlet UITableViewCell *cellDelete; 

创build一个单元格将被格式化的方法：

 - (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]; } 

上面的内容将使您的单元格看起来像联系人中的“删除”button。 但是我们也希望当用户点击它时改变颜色。 这是上述方法中的最后一段代码将会执行的操作。 它将使用较深的颜色设置不同的视图作为selectedBackgroundView。

点击后，单元格将保持选中状态并保持其深色。 要自动取消select单元格，我们执行以下操作：

从定义删除单元格的nr部分开始：

 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]; */ }