Yo19
Yo19

Reputation: 223

Shadow in collectionview cell is not acting the same way as the other cells in swift

I am trying to create a shadow on a collectionview cell using diffable data source, and I can do that, but the problem is that on some of the cells the shadow is different than the other cells.

enter image description here

I want it to look like the second cell down, where the shadow has a small shadow around the whole cell, instead of looking like the first cell where the shadow is at the bottom.

This is the extension I created for the shadow:

    extension UIView {
    
    func shadowSetUp() {
        layer.masksToBounds = false
        clipsToBounds = false
        layer.shadowColor = UIColor.black.withAlphaComponent(0.2).cgColor
        layer.shadowOpacity = 1
        layer.shadowOffset = CGSize.zero
        layer.shadowRadius = 10.0
        layer.shadowPath = UIBezierPath(rect: self.bounds).cgPath
        layer.shouldRasterize = true
        layer.rasterizationScale = UIScreen.main.scale
    }
    
}

I put this extension in the collectionview cell view, like so:

    private lazy var setUpView: Void = {
        contentView.addSubview(cellBackground)
        cellBackground.addSubview(title)
        cellBackground.addSubview(imgView)
        cellBackground.translatesAutoresizingMaskIntoConstraints = false
        imgView.translatesAutoresizingMaskIntoConstraints = false
        title.translatesAutoresizingMaskIntoConstraints = false
        self.clipsToBounds = false
        contentView.backgroundColor = colors.Colors.views
        cellBackground.backgroundColor = colors.Colors.views
        title.textColor = .label
        title.numberOfLines = 3
        title.textAlignment = .left
        title.adjustsFontSizeToFitWidth = true
        title.font = UIFontMetrics.default.scaledFont(for: UIFont.systemFont(ofSize: 25, weight: .bold))
        title.adjustsFontSizeToFitWidth = false
        title.adjustsFontForContentSizeCategory = true
        
        title.isHidden = true
        imgView.isHidden = true

        cellBackground.layer.cornerRadius = 15

        contentView.layer.cornerRadius = 15
        contentView.shadowSetUp() <---- This is where i put the shadow extension
        
        NSLayoutConstraint.activate([
            cellBackground.topAnchor.constraint(equalTo: topAnchor),
            cellBackground.leadingAnchor.constraint(equalTo: leadingAnchor),
            cellBackground.trailingAnchor.constraint(equalTo: trailingAnchor),
            cellBackground.bottomAnchor.constraint(equalTo: bottomAnchor),
            imgView.heightAnchor.constraint(equalTo: heightAnchor, multiplier: 0.25),
            imgView.widthAnchor.constraint(equalTo: heightAnchor, multiplier: 0.25),
            imgView.topAnchor.constraint(equalTo: cellBackground.topAnchor, constant: 5),
            imgView.leadingAnchor.constraint(equalTo: cellBackground.leadingAnchor, constant: 10),
            title.leadingAnchor.constraint(equalTo: cellBackground.leadingAnchor, constant: 10),
            title.trailingAnchor.constraint(equalTo: cellBackground.trailingAnchor, constant: -10),
            title.topAnchor.constraint(equalTo: imgView.bottomAnchor, constant: 5),
            title.bottomAnchor.constraint(equalTo: cellBackground.bottomAnchor, constant: -5)
        ])
        
        
    }()
    

I tried changing many different things, like putting the shadow on the cellBackground, just putting it as shadowSetUp(), and changing the bezier path to different versions, like using:

layer.shadowPath = UIBezierPath(roundedRect: self.bounds, cornerRadius: 15).cgPath

and

layer.shadowPath = UIBezierPath(roundedRect: self.bounds, byRoundingCorners: <#T##UIRectCorner#>, cornerRadii: <#T##CGSize#>)

I also tried to remove the bezierPath, and it does work, but I know that for cells it is better to use bezierPath because of lagging issues.

I know that similar questions have been asked, but when I have looked around, nothing seems to work for me. I looked at:

I was just wondering where I was going wrong. When I has trying to recreate it, I couldn't get it to happen again. If you have any questions please ask. Thank you

Upvotes: 0

Views: 1062

Answers (1)

AMIT
AMIT

Reputation: 924

Try with this code below for making shadow.

    DispatchQueue.global(qos: .background).async {
        DispatchQueue.main.async {
            myView.layer.rasterizationScale = UIScreen.main.scale
            myView.layer.shouldRasterize = true
            //myView.layer.masksToBounds = true
            myView.layer.cornerRadius = 8
            myView.layer.shadowOffset = CGSize(width: 3, height: 3)
            myView.layer.shadowRadius = 8
            myView.layer.shadowColor = UIColor.gray.cgColor
            myView.layer.shadowOpacity = 0.4
        }
    }

Upvotes: 0

Related Questions