Ajout d'une vue de superposition à UICollectionViewCell - superposition continue

Question

J'essaie d'ajouter une vue alpha 50% noire sur chaque cellule de vue de collection. Les cellules de vue de collection ont une photo d'arrière-plan et un texte sur le dessus. Je voudrais que la vue de superposition soit entre les deux.

Dans ma méthode de cellForItemAt, j'utiliser les éléments suivants:

let overlayView = UIView() 
overlayView.backgroundColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0.5) 
overlayView.frame = cell.bounds 
cell.addSubview(overlayView) 

Le problème est que je défiler vers le bas, puis vers le haut, la superposition continue d'ajouter, ce qui rend l'alpha beaucoup plus sombre que 50%. De plus, overlayView est ajouté au-dessus de mon texte (j'en ai besoin sous le texte.)

Comment puis-je empêcher la superposition d'ajouter plusieurs fois et de l'ajouter entre les couches correctes de la cellule?

Answer 1

Cela se produit parce que vos cellules sont retirées et réutilisées plusieurs fois, par conséquent, vous ajoutez plusieurs couches.

Mettez ce code dans votre classe de cellules

override func awakeFromNib() { 
    super.awakeFromNib() 
    let overlayView = UIView() 
    overlayView.backgroundColor = UIColor(red: 0, green: 0, blue: 0, alpha: 0.5) 
    overlayView.frame = self.bounds 
    self.addSubview(overlayView) 
} 

Ou si vous voulez obtenir le même résultat que vous pouvez définir backgroundColor noir et définir l'alpha de imageView à 50%

cell.backgroundColor = .black 
cell.imageView.alpha = 0.5 

Answer 2

Évitez d'ajouter cela dans cellForItem. Les cellules sont réutilisées, donc si vous continuez à ajouter la vue, il ajoutera un sommet de l'autre. En réutilisant la cellule, la vue ajoutée précédemment n'est pas supprimée. Au lieu de cela, vous pouvez ajouter la vue dans la cellule prototype ou XIB et définir son alpha à ce que vous voulez. Ou si vous créez la cellule par programmation, vous pouvez le faire dans awakeFromNib()

Answer 3

UITableView a une méthode de réutiliser des cellules pour le rendre plus efficace (en gardant seulement les cellules requises en mémoire). Pour cette raison, la cellule réutilisée peut déjà avoir cette sous-vue, donc appeler à nouveau addSubview entraîne l'ajout d'une autre vue sur celle-ci.

Voici comment résoudre ceci:

Déplacer addSubview(overlayView) la méthode layoutSubviews() dans votre sous-classe de cellules.

override func layoutSubviews() { 
    super.layoutSubviews() 
    addSubview(overlayView) 
} 

Retirez la vue de recouvrement dans la méthode prepareForReuse() dans votre sous-classe de cellules.

override func prepareForReuse() { 
    super.prepareForReuse() 
    overlayView.removeFromSuperview() 
} 

Notez que cela vous oblige à définir la vue de recouvrement dans la sous-classe de la cellule (que vous devriez probablement faire depuis la cellule elle-même devrait être responsable de ses propres sous-vues).