如何在分組的UITableView上設置選定的背景顏色

Question

我嘗試了各種方法，但都沒有成功。 其分組的UITableView。 要更改所選單元格的背景顏色。

我試圖創建一個視圖，設置背景色並將其設置為cell.selectedBackgroundView。 它可以更改顏色，但是會丟失部分的圓角。

Answer 1

您可以創建4個不同的圖像，頂部為1，底部為1，中間為1，頂部/底部為1（在所有4個角均取整）。 然后根據表中的位置將背景視圖設置為自定義圖像。 另外，如果您要使用視圖，則可以使用以下自定義視圖，該視圖僅舍入特定的角：

。H

#import <UIKit/UIKit.h>

enum {
    RoundedCornerNone        = 0,
    RoundedCornerUpperRight  = 1 << 0,
    RoundedCornerLowerRight  = 1 << 1,
    RoundedCornerLowerLeft   = 1 << 2,
    RoundedCornerUpperLeft   = 1 << 3
};
typedef NSUInteger RoundedCornerOptions;

@interface PartiallyRoundedView : UIView

@property (nonatomic, assign) RoundedCornerOptions roundedCorners;

@end

.m

#import "PartiallyRoundedView.h"


@implementation PartiallyRoundedView

@synthesize roundedCorners;

- (id)initWithFrame:(CGRect)frame
{
    if ((self = [super initWithFrame:frame])) {
    }
    return self;
}

- (void)drawRect:(CGRect)rect
{
    float radius = 10;

    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetLineWidth(context, 1.0);
    CGContextBeginPath(context);
    CGContextSetRGBStrokeColor(context, .6, .6, .6, 1);
    CGContextSetRGBFillColor(context, .968, .968, .968, 1);

    CGContextMoveToPoint(context, rect.origin.x + rect.size.width - radius, rect.origin.y);
    CGContextAddLineToPoint(context, rect.origin.x + radius, rect.origin.y); //Draw top line

    if (self.roundedCorners >=8) { //Round upper-left corner
        CGContextAddArc(context, rect.origin.x + radius, rect.origin.y + radius, radius, 
                        -M_PI / 2, M_PI, 1);

        self.roundedCorners-=8;
    }
    else {
        CGContextAddLineToPoint(context, rect.origin.x, rect.origin.y);
        CGContextAddLineToPoint(context, rect.origin.x, rect.origin.y + radius);
    }

    CGContextAddLineToPoint(context, rect.origin.x, rect.origin.y + rect.size.height - radius); //Draw left line

    if (self.roundedCorners >=4) { //Round lower-left corner
        CGContextAddArc(context, rect.origin.x + radius , rect.origin.y + rect.size.height - radius, 
                        radius, M_PI, M_PI / 2, 1);

        self.roundedCorners-=4;
    }
    else {
        CGContextAddLineToPoint(context, rect.origin.x, rect.origin.y + rect.size.height);
        CGContextAddLineToPoint(context, rect.origin.x + radius, rect.origin.y + rect.size.height);
    }

    CGContextAddLineToPoint(context, rect.origin.x + rect.size.width - radius, rect.origin.y + rect.size.height); //Draw bottom line

    if (self.roundedCorners >=2) { //Round lower-right corner
        CGContextAddArc(context, rect.origin.x + rect.size.width - radius , 
                        rect.origin.y + rect.size.height - radius, radius, M_PI / 2, 0.0f, 1);

        self.roundedCorners-=2;
    }
    else {
        CGContextAddLineToPoint(context, rect.origin.x + rect.size.width, rect.origin.y + rect.size.height);
        CGContextAddLineToPoint(context, rect.origin.x + rect.size.width, rect.origin.y + rect.size.height - radius);
    }

    CGContextAddLineToPoint(context, rect.origin.x + rect.size.width, rect.origin.y + radius); //Draw right line

    if (self.roundedCorners ==1) { //Round upper-right corner
        CGContextAddArc(context, rect.origin.x + rect.size.width - radius, rect.origin.y + radius, 
                        radius, 0.0f, -M_PI / 2, 1);
    }
    else {
        CGContextAddLineToPoint(context, rect.origin.x + rect.size.width, rect.origin.y);
        CGContextAddLineToPoint(context, rect.origin.x + rect.size.width - radius, rect.origin.y );
    }


    CGContextClosePath(context);
    CGContextDrawPath(context, kCGPathFillStroke);
    }


    - (void)dealloc {
        [super dealloc];
    }


    @end

您可以創建此視圖的實例（您需要添加一點以在中間填充所需的任何顏色）。 根據您是第一個，最后一個，中間還是第一個和最后一個單元格，只需傳遞正確的角圓角即可。

Answer 2

如果您想使用Core Graphics實現此功能（不使用圖像），請嘗試一下。 我的方法與您選擇的答案具有相同的概念，但使用簡單的if/else （或switch:case取決於您的數據源大小）來為分組的UITableViewCell繪制正確的背景視圖。 以下代碼僅需要包含在您的實現文件中：

.m

UIView *bgColorView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width-24, 69)];
    bgColorView.backgroundColor = [UIColor magentaColor];
    UIBezierPath *maskPath;
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.frame = bgColorView.bounds;

    if (row == 0) {
      maskPath = [UIBezierPath bezierPathWithRoundedRect:bgColorView.bounds
                                       byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight)
                                             cornerRadii:CGSizeMake(8.0, 8.0)];
      maskLayer.frame = CGRectOffset(bgColorView.bounds, 1, 0);
      if ([self.tableView numberOfRowsInSection:1] == 1) {
        maskPath = [UIBezierPath bezierPathWithRoundedRect:bgColorView.bounds
                                         byRoundingCorners:(UIRectCornerAllCorners)
                                               cornerRadii:CGSizeMake(8.0, 8.0)];
      }
    } else if (row >= [self.tableView numberOfRowsInSection:1]-1) {
      maskPath = [UIBezierPath bezierPathWithRoundedRect:bgColorView.bounds
                                       byRoundingCorners:(UIRectCornerBottomLeft | UIRectCornerBottomRight)
                                             cornerRadii:CGSizeMake(8.0, 8.0)];
      maskLayer.frame = CGRectOffset(bgColorView.bounds, 1, 0);
    } else {
      maskPath = [UIBezierPath bezierPathWithRoundedRect:bgColorView.bounds
                                       byRoundingCorners:nil
                                             cornerRadii:CGSizeMake(0.0, 0.0)];
    }

    maskLayer.path = maskPath.CGPath;

    bgColorView.layer.mask = maskLayer;
    cell.selectedBackgroundView = bgColorView;

如果您使用了可重復使用的單元格，則每種類型的圖形只應出現一次。

希望這可以幫助偶然發現此線程的人...干杯！

Answer 3

如果只想更改選擇顏色，請查看以下建議： UITableView Cell選擇了顏色？ 將其發布在CellForRowAtIndexPath-Method中：

UIView *bgColorView = [[UIView alloc] init];
[bgColorView setBackgroundColor:[UIColor redColor]];
bgColorView.layer.cornerRadius = 10; 
[cell setSelectedBackgroundView:bgColorView];
[bgColorView release];  

並且不要忘記導入QuartzCore。 為我工作（iOS 5）