title: Swift: Dequeueing CollectionViewCells with Image in Assets
body: <p>I am working on a chat app interface and my icon images disappear when I scroll up and down. I understand that this could be due to the dequeueing nature of the collection view cells. This <a href="https://stackoverflow.com/questions/23613186/uitableviewcell-imageview-disappears-when-scrolling">post</a> on SO suggests that this can be solved by caching the images. However, in my application, my icon images are loaded in Assets and not downloaded from a URL. </p>
  
  <p>My code so far:</p>
  
  <pre><code>func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -&gt; UICollectionViewCell {
      let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! ChatBubbleCollectionViewCell
      let item = messages[indexPath.item]
  
      if item.fromUserUID == fromUserUID {
          cell.bubbleView.backgroundColor = .customPink
          cell.textView.text = item.message
          cell.textView.textColor = .white
          cell.imageTextView.textColor = .white
          cell.bubbleLeftAnchor.isActive = false
          cell.bubbleRightAnchor.isActive = true
  
          if let _ = item.imageUrl {
              cell.imageIconView.image = UIImage(named: "ic_photo_white")
          }
      } else {
          cell.bubbleView.backgroundColor = .faintGray
          cell.textView.text = item.message
          cell.textView.textColor = .black
          cell.imageTextView.textColor = .darkGray
          cell.bubbleLeftAnchor.isActive = true
          cell.bubbleRightAnchor.isActive = false
  
          if let _ = item.imageUrl {
              cell.imageIconView.image = UIImage(named: "ic_photo_pink")
          }
      }
  
      let longPressGesture = UILongPressGestureRecognizer(target: self, action: #selector(longPressOnImage))
      longPressGesture.minimumPressDuration = 1
  
      if let message = item.message {
          cell.bubbleWidthAnchor.isActive = false
          cell.bubbleWidthAnchor.constant = estimatedFrame(for: message).width + 11
          cell.bubbleWidthAnchor.isActive = true
          cell.bubbleHeightAnchor.isActive = false
          cell.imageContainerView.isHidden = true
          cell.textView.isHidden = false
          cell.messageImageView.isHidden = true
          cell.removeGestureRecognizer(longPressGesture)
      } else {
          cell.bubbleWidthAnchor.isActive = false
          cell.bubbleWidthAnchor.constant = 120
          cell.bubbleWidthAnchor.isActive = true
          cell.bubbleHeightAnchor.isActive = true
          cell.messageImageView.isHidden = true
          cell.imageTextView.text = "Fetching..."
  
          if let imageReadReceipt = item.readReceipt {
              if imageReadReceipt {
                  DispatchQueue.main.async {
                      cell.imageTextView.text = "Deleted"
                      cell.imageIconView.image = UIImage(named: "ic_visibility_off")
                      cell.isUserInteractionEnabled = false
                  }
              } else {
                  if let imageUrlString = item.imageUrl {
                      cell.messageImageView.sd_setImage(with: URL(string: imageUrlString), completed: { (image, error, cache, url) in
                          if let error = error {
                              print(error.localizedDescription)
                          } else if let _ = image {
                              DispatchQueue.main.async {
                                  cell.isUserInteractionEnabled = true
                                  cell.imageContainerView.isHidden = false
                                  cell.imageTextView.text = "Tap and hold to view"
                                  cell.textView.isHidden = true
                                  cell.imageContainerView.addGestureRecognizer(longPressGesture)
                              }
                          }
                      })
                  }
              }
          }
      }
  
      return cell
  }
  </code></pre>
  
  <p>The cellForRow needs to do quite a few things which I doubt is a reason for the disappearing icon images. It will have to identify whether the message is received or sent (so that the bubble can be drawn on the left or right), or if the message is an image message or a text message.</p>
  
  <p>The results are like this after doing various scrolls up and down:</p>
  
  <p>Before scrolls
  <a href="https://i.stack.imgur.com/WBbnm.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WBbnm.png" alt="enter image description here"></a></p>
  
  <p>After scrolling a few times
  <a href="https://i.stack.imgur.com/2UBIU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2UBIU.png" alt="enter image description here"></a></p>
  
  <p>One can observe that the deleteIcon image is gone with the "Deleted" text. Would anyone help to point out where did I go wrong? Thanks.</p>