将背景渐变应用于Grouple表格单元格

Question

我正在使用以下代码为UITableViewCell创建渐变背景.虽然这适用于普通表格单元格,但渐变仅出现在分组表格单元格的左右角落.就好像然后应用渐变一样,细胞被绘制在它上面.

有人可以建议修改代码,这对分组表格单元格有效吗？或者有一种完全不同的方式吗？

- (void)drawRect:(CGRect)rect {
CGContextRef c = UIGraphicsGetCurrentContext();

CGGradientRef myGradient;
CGColorSpaceRef myColorspace;

size_t num_locations = 2;
CGFloat locations[2] = {0.0, 1.0};
CGFloat components[8] = {0.8f, 0.8f, 0.8f, 1.0f, // Bottom Colour: Red, Green, Blue, Alpha.
    0.9f, 0.9f, 0.9f, 1.0}; // Top Colour: Red, Green, Blue, Alpha.

myColorspace = CGColorSpaceCreateDeviceRGB();
myGradient = CGGradientCreateWithColorComponents (myColorspace, components,
                                                  locations, num_locations);

CGColorSpaceRelease(myColorspace);

CGPoint startPoint, endPoint;
startPoint.x = 0.0;
startPoint.y = self.frame.size.height;
endPoint.x = 0.0;
endPoint.y = 0.0;
CGContextDrawLinearGradient (c, myGradient, startPoint, endPoint, 0);

const CGFloat topSepColor[] = { 0.8f, 0.8f, 0.8f, 1.0f }; // Cell Seperator Colour - Top

CGGradientRelease(myGradient);

CGContextSetStrokeColor(c, topSepColor);

CGContextMoveToPoint(c, 0.0, 0.0);
CGContextSetLineWidth(c, 1.0);
CGContextSetLineCap(c, kCGLineCapRound);
CGContextAddLineToPoint(c, self.frame.size.width, 0.0);
CGContextStrokePath(c);

const CGFloat bottomSepColor[] = { 0.5f, 0.5f, 0.5f, 1.0f }; // Cell Seperator Colour - Bottom
CGContextSetStrokeColor(c, bottomSepColor);

CGContextMoveToPoint(c, 0.0, self.frame.size.height);
CGContextSetLineWidth(c, 1.0);
CGContextSetLineCap(c, kCGLineCapRound);
CGContextAddLineToPoint(c, self.frame.size.width, self.frame.size.height);
CGContextStrokePath(c);

[[UIColor blackColor] set];
}

谢谢你的帮助.

Answer 1

我不明白为什么人们会尝试编写过于复杂的绘图例程来渲染自定义UITableViewCell.将单元格backgroundView和selectedBackgroundView属性的值设置为标准,UIImageView包含所有边框,斜角,渐变,圆角以及图像中您喜欢的任何其他内容.

对于圆形表视图,您将创建4个图像; 一个用于顶部单元格,另一个用于底部单元格,一个用于中间单元格,另一个用于单个单元格(如果您的表格只有一行).

Matt Gallagher在Cocoa with Love上写了一篇很好的文章,名为Easy custom UITableView drawing.

Answer 2

使用单元格背景的自定义视图可以完全自定义单元格的外观,但在更改屏幕方向时可能无法很好地缩放.此外,如果您只需要一个适用于普通单元格和分组样式单元格的渐变背景,那么最好使用此...

我有另一种解决方案,它的代码少得多,只需要一个渐变图像.组单元格样式的圆角仍然由框架绘制,因此我们无需担心为顶部,中间和底部单元格样式提供自定义图像以使用此方法来满足圆角.这是它的样子:

梯度图像是单个像素宽并且与单元一样高(在该示例中为44像素).

cell.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"cellBackground_1x44.png"]];

该代码在UIColor上使用了colorWithPatternImage方法,从iOS 2.0开始提供.应该调用此代码tableView:cellForRowAtIndexPath:.只有在最初创建单元时,才可以在重新使用单元时重复调用.

为了使用我正在使用的灰度渐变,我发现为所选单元格的匹配选择颜色设置很有用:

cell.selectionStyle = UITableViewCellSelectionStyleGray;

您可能还想要更改单元格边框的颜色,使用类似于:

[self.tableView setSeparatorColor:[UIColor darkGrayColor]];

嗯,就是这样.我希望人们觉得这很有用.我昨天在网上搜索了几个小时,只得到了包含自定义绘图代码的参考资料,这些代码生成了渐变和圆角,或者我找到了Matt Coneybeare的"如何在核心图形的集合式UITABLEVIEW中制作定制的渐变背景"的链接帖子.一切正常,但如果你只是想要一些简单的东西,我相信这就是它.