使用Swift进行卡片查看

Question

我怎样才能UITableView在帖子上做出像这样的图片？
我想复制这个Flat Effect,项目之间有空格.

想要的结果:

我有:

Answer 1

您可以使用此cardview,告诉我它是否适合您,它对我有用.

https://github.com/aclissold/CardView/blob/master/README.md

//
//  The MIT License (MIT)
//
//  Copyright (c) 2014 Andrew Clissold
//
//  Permission is hereby granted, free of charge, to any person obtaining a copy
//  of this software and associated documentation files (the "Software"), to deal
//  in the Software without restriction, including without limitation the rights
//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
//  copies of the Software, and to permit persons to whom the Software is
//  furnished to do so, subject to the following conditions:
//
//      The above copyright notice and this permission notice shall be included in all
//      copies or substantial portions of the Software.
//
//      THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
//      IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
//      FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
//      AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
//      LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
//      OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
//      SOFTWARE.
//

import UIKit

@IBDesignable
class CardView: UIView {

    @IBInspectable var cornerRadius: CGFloat = 2

    @IBInspectable var shadowOffsetWidth: Int = 0
    @IBInspectable var shadowOffsetHeight: Int = 3
    @IBInspectable var shadowColor: UIColor? = UIColor.blackColor()
    @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
    }

}

Answer 2

在集合视图的单元格中，我创建了另一个 UIVIew 并提供了这些属性。

cardView.backgroundColor = .white

cardView.layer.cornerRadius = 10.0

cardView.layer.shadowColor = UIColor.gray.cgColor

cardView.layer.shadowOffset = CGSize(width: 0.0, height: 0.0)

cardView.layer.shadowRadius = 6.0

cardView.layer.shadowOpacity = 0.7

我取得的结果是这样的——

Answer 3

这看起来更适合 UICollectionView，您可以在其中设置集合视图项的插图。或者，您可以在表视图单元格的内容视图内创建一个视图，并设置约束，将视图的边缘固定到距表视图边缘设定的距离