Как сделать так, чтобы UICollectionViewCells имели закругленные углы и тени?

Question

Я видел некоторые другие ответы на подобные вопросы, но ни одно из решений не помогло мне, даже с некоторыми изменениями.

Как следует из названия, я бы хотел, чтобы мои UICollectionViewCell s имелизакругленные углы и тени (или тени со всех сторон, кроме верхней).На данный момент я добавил два вида к моему UICollectionViewCell - mainView, который отображает необходимое содержимое ячейки и имеет закругленные углы, и shadowView, который имеет тень.Ни одно представление не является подвидом другого, они существуют вместе в одной ячейке.Они оба имеют одинаковые размеры, и mainView явно отображается поверх shadowView.Вот моя текущая реализация кода:

let mainView = cell.viewWithTag(1003) as! UIView       
mainView.layer.cornerRadius = 10.0
mainView.layer.borderWidth = 1.0
mainView.layer.borderColor = UIColor.clear.cgColor
mainView.layer.masksToBounds = true

let shadowView = cell.viewWithTag(1002) as! UIView
shadowView.layer.shadowColor = UIColor.black.cgColor
shadowView.layer.shadowOffset = CGSize(width: 0, height: 2.0)
shadowView.layer.shadowRadius = 2.0
shadowView.layer.shadowOpacity = 0.5
shadowView.layer.masksToBounds = false
shadowView.layer.shadowPath = UIBezierPath(roundedRect: shadowView.bounds, cornerRadius: mainView.layer.cornerRadius).cgPath

Вот что производит этот код: Можно подумать, что углы mainView недостаточно округлены, и чтотень недостаточно велика.

Однако, удалив shadowView и установив черный фон UICollectionView, вы можете видеть, что углы mainView на самом деле довольно округлые:

Таким образом, это означает, что проблема связана с размером тени shadowView.Однако я попытался увеличить смещение тени и радиус тени, но ничего не сделал.Большинство изменений либо создавали очень густую тень вокруг mainView, уменьшали округление mainView еще больше, либо ничего не делали.

Вот изображение соответствующей иерархии представления UITableViewCell в раскадровке:

Answer 1

Вот код Cell:

class CollectionViewCell: UICollectionViewCell {
    override init(frame: CGRect) {
        super.init(frame: frame)


        layer.shadowColor = UIColor.lightGray.cgColor
        layer.shadowOffset = CGSize(width: 0, height: 2.0)
        layer.shadowRadius = 5.0
        layer.shadowOpacity = 1.0
        layer.masksToBounds = false
        layer.shadowPath = UIBezierPath(roundedRect: bounds, cornerRadius: contentView.layer.cornerRadius).cgPath
        layer.backgroundColor = UIColor.clear.cgColor

        contentView.layer.masksToBounds = true
        layer.cornerRadius = 10
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

Вот код использования:

import UIKit

private let reuseIdentifier = "Cell"

class CollectionViewController: UICollectionViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        self.collectionView!.register(CollectionViewCell.self, forCellWithReuseIdentifier: reuseIdentifier)
        (self.collectionView.collectionViewLayout as! UICollectionViewFlowLayout).itemSize = CGSize(width: 100, height: 100)
    }

    override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 10
    }

    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath)
        cell.backgroundColor = .white
        return cell
    }
}

Вот результат:

Answer 2

Обновление

Спасибо за чат в Hangouts.Я загрузил ваш код, и mainView и shadowView были равны нулю.

• Я заметил, что вам не нравится CollectionViewCells.

С этим сказано.Я более чем рад представить нашего друга Runtime Attributes

Не касаясь вашего кода.Выберите вид и добавьте runtime attribute key и установите значение.

Вывод:

Продолжайте и выполнитеработа для тени и остальное.

---

mainView округлено, но shadowView берет весь кредит.

Вам необходимо включить clipsToBounds в обоих видах:

mainView.clipsToBounds = true