每个拐角不同的拐角半径，扩展 TableView 单元格视图

Posted 2023-02-24

【中文标题】每个拐角不同的拐角半径，扩展 TableView 单元格视图

【英文标题】：Different Corner Radius for each Corner, Expanding TableView Cell View

【发布时间】：2020-03-03 14:56:15

【问题描述】：

我正在尝试为扩展 tableview 单元格中 UIView 上的每个角创建不同的角半径。我有一个带有 UILabel 作为子视图的 UIView。当有很多文本时，UILabel 会扩展，从而扩展单元格。我要做的是在左上角和右上角设置 UIView 13 的角半径，在底角设置 4 的角半径。

目前，我正在使用this question 使用 layer.cornerRadius 来圆所有角，显示为

然后使用这段代码

let maskPath = UIBezierPath(roundedRect: (originalCell?.messageBackground.bounds)!,
                            byRoundingCorners: [.bottomLeft, .bottomRight],
                            cornerRadii: CGSize(width: 13.0, height: 0.0))

let maskLayer = CAShapeLayer()
maskLayer.path = maskPath.cgPath
originalCell?.messageBackground.layer.mask = maskLayer

尝试绕过视图的底角，但是当我这样做时，单元格显示为

那么有什么办法可以通过扩展单元将顶角和底角圆化为不同的半径？

【问题讨论】：

我很久以前学到的一个技巧是使用图像。这是泡泡聊天，对吧？ JSQMessagesViewController 使用了那个方法。

哦，有趣的解决方案。谢谢！

【参考方案1】：

基于@Glenn 的想法，我建议：

不要使用重度图像，而是使用轻量级 CALayer 作为主视图的子层，将其放在 UIView 层的下方。 它应该观察视图的边界，并在每次父视图更改其边界时重新绘制。 （例如，主 UIView 中的 'override var bounds' 并捕获 'didSet' 会将新的边界向下传播到 CALayer。 在 CALayers 的 draw(_:) 方法中，根据角落绘制路径，然后用灰色填充。

【参考方案2】：

你可以使用这行代码：

yourView.layer.maskedCorners = [.layerMinXMinYCorner, .layerMaxXMaxYCorner]

它会在您需要的特定角落制作角落：

layerMaxXMaxYCorner : 右下角 layerMaxXMinYCorner : 右上角 layerMinXMaxYCorner : 左下角 layerMinXMinYCorner : 左上角

另外，检查文档

https://developer.apple.com/documentation/quartzcore/calayer/2877488-maskedcorners