将间距添加到CardView TableViewCell

Question

我正在使用卡片视图来构建我的表格单元格并且它正在工作，但我希望能够更改外观。

看起来像这样：

我希望它看起来像这样，表格单元格与每个表格单元格之间的边缘和空间之间有空格：

以下是我创建卡片视图表格单元的代码：

class ModelCell: UITableViewCell {

// Outlets
@IBOutlet weak var modelTitleLabel: UILabel!
@IBOutlet weak var modelDescriptionLabel: UILabel!


override func awakeFromNib() {
    super.awakeFromNib()
    // Initialization code
}

override func setSelected(_ selected: Bool, animated: Bool) {
    super.setSelected(selected, animated: animated)

    // Configure the view for the selected state
}

@IBInspectable var cornerRadius: CGFloat = 10

@IBInspectable var shadowOffsetWidth: Int = 0
@IBInspectable var shadowOffsetHeight: Int = 3
@IBInspectable var shadowColor: UIColor? = UIColor.white
@IBInspectable var shadowOpacity: Float = 0.5

override func layoutSubviews() {
    layer.cornerRadius = cornerRadius
    let shadowPath = UIBezierPath(roundedRect: bounds, cornerRadius: cornerRadius)

    layer.masksToBounds = false
    layer.shadowColor = shadowColor?.cgColor
    layer.shadowOffset = CGSize(width: shadowOffsetWidth, height: shadowOffsetHeight);
    layer.shadowOpacity = shadowOpacity
    layer.shadowPath = shadowPath.cgPath
    layer.borderWidth = 1.0
    layer.borderColor = UIColor(red:0.00, green:0.87, blue:0.39, alpha:1.0).cgColor



    }

}

提前感谢您的帮助。

Answer 1

您可以在表格视图中轻松添加行的分隔。

这是一种方法：

在您的单元格中添加UIView，其中包含两个标签。然后从侧面和顶部和底部给出该视图的插图。顶部/底部插图将为您提供行之间的间距。

然后将边框和阴影效果应用到“内部”视图 - 此处以浅灰色显示，以便您可以看到它：

结果（左图为灰色背景，右图为白色背景）：

将“内部视图”分配给IBOutlet，您的代码更改为：

override func layoutSubviews() {

    // just use the layer's shadow... adding the Bezier         
    //let shadowPath = UIBezierPath(roundedRect: innerView.bounds, cornerRadius: cornerRadius)
    //innerView.layer.shadowPath = shadowPath.cgPath

    innerView.layer.cornerRadius = cornerRadius
    innerView.layer.masksToBounds = false
    innerView.layer.shadowColor = shadowColor?.cgColor
    innerView.layer.shadowOffset = CGSize(width: shadowOffsetWidth, height: shadowOffsetHeight);
    innerView.layer.shadowOpacity = shadowOpacity
    innerView.layer.borderWidth = 1.0
    innerView.layer.borderColor = UIColor(red:0.00, green:0.87, blue:0.39, alpha:1.0).cgColor

}