将背景渐变应用于Grouple表格单元格 [英] Applying background gradient to a Grouple table cell

问题描述

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

I am using the following piece of code to create a gradient background for a UITableViewCell. While this works perfectly for a plain table cell, the gradient only appears at the left and right corners of the grouped table cell. It is as if the gradient is applied then, the cell is drawn on top of it.

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

Can someone suggest a modification to the code, that would work well with grouped table cell? Or is there a completely different way of doing this?

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

感谢您的帮助。

推荐答案

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

I don't understand why people try and write over-complicated drawing routines to render a custom UITableViewCell. Set the value of your cell's backgroundView and selectedBackgroundView properties to a standard UIImageView with all the borders, bevels, gradients, rounded corners and whatever else you like in an image.

对于圆形表格视图，您将创建4个图像;如果您的表只有一行，则一个用于顶部单元格，另一个用于底部单元格，另一个用于单个单元格。

For rounded table views, you would create 4 images; one for the top cell, another for the bottom cell, one for the middle cell, and another for a single cell if your table only has one row.

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

Matt Gallagher has written a good article on this at Cocoa with Love, titled Easy custom UITableView drawing.

这篇关于将背景渐变应用于Grouple表格单元格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！