Question

在Stocks和Spotlight中看到的整个UITableView上获得圆角的最佳方法是什么？分组的样式不能解决问题，因为圆角会随着单元格滚动。我正在尝试剪切视图，因此无论滚动位置如何，角落总是圆的。

我看到另一个关于对UIImage执行此操作的讨论，建议用另一个图像掩盖它。我不确定这是否有效，因为我需要点击才能传递到桌面。这对我来说并不理想，因为我希望通过角落显示背景图案。

Answer 1

这是一个老问题，但也许你仍然想知道如何做到这一点。

我在Stocks / Spotlight中复制了一个tableView。诀窍是

view.layer.cornerRadius = 10;

为此，您需要将QuartzCore包含在您调用该属性的类中：

#import <QuartzCore/QuartzCore.h>

我听说这只适用于OS 3.0。但是，由于我的应用程序使用的是核心数据，因此它不是问题，因为它已经用于OS 3.0和高度。

我使用带有cornerRadius 10和

的子视图创建了一个自定义UIView

view.backgroundColor = [UIColor clearColor];

然后，您必须在该子视图中放置UITableView分组样式。您需要将backgroundColor设置为clearColor，将separatorColor设置为clearColor。然后，您必须将tableview放置在圆角视图内，这可以通过设置框架大小和原点来完成。我的自定义UIView的loadView类看起来像这样：

self.view = [[UIView alloc] init];
self.view.backgroundColor = [UIColor clearColor];

CustomUIViewClass *scherm = [[CustomUIViewClass alloc] init];

CGRect frame;
frame.origin.x = 10;
frame.origin.y = 50;
frame.size.width = 300;
frame.size.height = 380;

scherm.frame = frame;
scherm.clipsToBounds = YES;
scherm.layer.cornerRadius = 10;

[self.view addSubview:scherm];

CustomUITableViewClass *table = [[CustomUITableViewClass alloc] initWithStyle:UITableViewStyleGrouped];

frame.origin.y = -10;
frame.origin.x = -10;
frame.size.width = 320;
frame.size.height = 400;

table.tableView.frame = frame;
[scherm addSubview:table.tableView];

我希望你能理解我的英语，也许我会用一个示例项目写一篇关于这个技术的简短博客文章，当我准备好时，会在这里发布链接。

Answer 2

更简单的方法是将QuartzCore框架导入项目。 #import <QuartzCore/QuartzCore.h>到你的tableViewController，然后设置

myTableView.layer.cornerRadius=5;

这将为您提供圆角，而无需将您的tableview添加到superView或剪切它。

Answer 3

而不是通过代码破解，这里很容易模仿分组的样式。如果你想要的只是一个部分，这就有效。

在Interface Builder中：

将UITableView样式设置为Plain，并使框架左右两侧有一些填充，可能x = 10，宽度= 300。

然后自己设置角半径和颜色：

 #import <QuartzCore/QuartzCore.h>

 self.tableView.layer.borderColor = [UIColor colorWithWhite:0.6 alpha:1].CGColor;   
 self.tableView.layer.borderWidth = 1;
 self.tableView.layer.cornerRadius = 4;

Answer 4

您是否尝试过“分组”表格样式？

self.tableView.style = UITableViewStyleGrouped;

有关详细信息，请参阅Table View Programming Guide。 “关于表视图”一章有一些很好的截图，描述了不同的样式。

Answer 5

我最近遇到了这个问题并以不同的方式解决了这个问题。我以为我会和大家分享结果。

我创建了一个带有清晰圆角内部的矩形UIView，然后将其放置在UITableView的顶部。您可以在my programming blog找到完整说明。

它完全符合我的要求。

Answer 6

嗯，有很多方法可以解决这个问题。

但是，在我的情况下，一切都无法正常工作。我的桌子有时小于桌子大小。

我将分享我的方式。我相信比上面的一些选择更容易和更快。

将第一个和最后一个项目舍入。

为顶部（左侧|右侧）和底部（左侧|右侧）创建CAShapeLayer。

shapeTop = [CAShapeLayer layer];
shapeTop.path = [UIBezierPath 
bezierPathWithRoundedRect:CGRectMake( 0.0f, 0.0f, 306.0f, 58.0f )
byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight
cornerRadii:CGSizeMake( 6.0f, 6.0f )].CGPath;

shapeBottom = [CAShapeLayer layer];
shapeBottom.path = [UIBezierPath 
bezierPathWithRoundedRect:CGRectMake( 0.0f, 0.0f, 306.0f, 58.0f )
byRoundingCorners:UIRectCornerBottomLeft | UIRectCornerBottomRight
cornerRadii:CGSizeMake( 6.0f, 6.0f )].CGPath;

该表需要背景为clearColor;
细胞必须是彩色背景;

设置它的layer.mask

UIView* backgroundView = [[UIView alloc] initWithFrame:CGRectZero];
backgroundView.backgroundColor = [UIColor whiteColor];
cell.backgroundView = backgroundView;

不要忘记#import <QuartzCore/QuartzCore.h>

Answer 7

以下是Swift版本的代码：

 let redColor = UIColor.redColor()
 self.tableView.layer.borderColor = redColor.colorWithAlphaComponent(0.9).CGColor
 self.tableView.layer.borderWidth = 1;
 self.tableView.layer.cornerRadius = 4;

确保导入部分中有import QuartzCore。

Answer 8

以下是快速扩展名：

extension UITableView {
     public var cornerRadius: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
            layer.masksToBounds = true
        }
    }
}

以这种方式使用

  tableView.cornerRadius = 7.5

Answer 9

UITableViewStyleInsetGrouped

表格视图，其中分组部分插入圆角。

示例代码： self.tableView = [[UITableView alloc] initWithFrame:CGRectZero style:UITableViewStyleInsetGrouped];

看起来像： Settings looking table view sections

UITableView上的圆角

9 个答案: