UIGlassEffect can leave an unusual grey shadow around the view

Question

IronHam OP

Created 2w

Replies 3

Boosts 0

Participants 2

When adding a glass effect to my UIControl:

            let effectView = UIVisualEffectView()
            let glassEffect = UIGlassEffect()
            glassEffect.isInteractive = true
            effectView.effect = glassEffect
            effectView.cornerConfiguration = .capsule()
            addSubview(effectView)
            effectView.snp.makeConstraints { $0.edges.equalToSuperview() }
            effectView.contentView.addSubview(stackView)
            for subview in effectView.subviews {
                subview.backgroundColor = .clear
            }
            self.effectView = effectView

I find that I get this visual effect:

These controls are the only view within a UICollectionViewCell. Nothing in the hierarchy of the collectionview to the control has a background color. The grey background only seems to appear when I place the glass effect.

Without the glass effect, there is no grey shading.

Answered by IronHam in 855094022

@NSCruiser Actually, I have a solution: Set the collectionView and whatever container the collection is in to not mask their bounds:

layer.masksTobounds = false
collectionView.layer.masksToBounds = false

Boost

Answer 1

NSCruiser OP

2w

I encountered a similar issue. It looks like shadows are part of the glass effects themselves. I set clipToBounds on my UICollectionView to false to avoid clipping the shadows, which made the collectionView look like it had a gray background color.

1

Answer 2

IronHam OP

2w

@NSCruiser interesting. The odd part is that it seems fine in the context of our iPad app, but has the grey-shadow-bg on iOS only.

Maybe worth exploring the concept of shifting to a UIScrollView given I have few elements here.

0

Answer 3

IronHam OP

2w

Accepted Answer

@NSCruiser Actually, I have a solution: Set the collectionView and whatever container the collection is in to not mask their bounds:

layer.masksTobounds = false
collectionView.layer.masksToBounds = false

0