Swift - CollectionView - 선택한 셀 UI 변경

📑 학습 내용

1. 선택된 셀의 인덱스 경로를 저장할 변수 추가

•     var selectedItemIndex : Int?

   

2. didSelectItemAt 메서드에서 선택된 셀의 인덱스 업데이트 후 reloadData() 호출

      .
      .
      .		
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        self.selectedItemIndex = indexPath.row
        
        collectionView.reloadData()
    }

 

3. cellForItemAt 메서드에서 저장된 인덱스로 UI 변경

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: PurchaseCollectionViewCell.identifier, for: indexPath) as? PurchaseCollectionViewCell else {
            return UICollectionViewCell()
        }
        let _ = item.sizes?[indexPath.row].map { size, price in
            cell.config(size: size, price: price)
        }
        
        if indexPath.row == selectedItemIndex {
            cell.setBoldCell()
        } else {
            cell.setBasicCell()
        }
        
        return cell
    }

 

→ UI 변경 코드(PurchaseCollectionViewCell 내부)

  func setBoldCell() {
        boldLabel(label: lblSize, size: 14, isBold: true)
        boldLabel(label: lblPrice, size: 12, isBold: true)
        borderView(isBold: true)
    }
    
    func setBasicCell() {
        boldLabel(label: lblSize, size: 14, isBold: false)
        boldLabel(label: lblPrice, size: 12, isBold: false)
        borderView(isBold: false)
    }
    
    private func boldLabel(label : UILabel, size : CGFloat, isBold : Bool){
        
        if isBold {
            // 기존 속성을 유지하고 font만 변경
            if let attributedText = label.attributedText {
                let mutableAttributedText = NSMutableAttributedString(attributedString: attributedText)
                mutableAttributedText.addAttribute(.font, value: UIFont.systemFont(ofSize: size, weight: .bold), range: NSRange(location: 0, length: mutableAttributedText.length))
                label.attributedText = mutableAttributedText
            }
        } else {
            // 기존 속성을 유지하고 font만 변경
            if let attributedText = label.attributedText {
                let mutableAttributedText = NSMutableAttributedString(attributedString: attributedText)
                mutableAttributedText.addAttribute(.font, value: UIFont.systemFont(ofSize: size), range: NSRange(location: 0, length: mutableAttributedText.length))
                label.attributedText = mutableAttributedText
            }
        }

    }
    private func borderView(isBold : Bool) {
        if isBold {
            grpView.layer.borderColor = UIColor.black.cgColor
        } else {
            grpView.layer.borderColor = UIColor(hex: "#F2F2F2")?.cgColor
        }
    }

📚 참고 자료

• https://developer.apple.com/documentation/uikit/uicollectionviewdelegate/1618032-collectionview
• https://ios-development.tistory.com/359
• https://developer.apple.com/documentation/foundation/nsmutableattributedstring

NSMutableAttributedString | Apple Developer Documentation

 

[iOS - swift] attributedText, NSMutableAttributedString (원하는 문자열 속성 지정, 문자열 attributedText 반환)

 

collectionView(_:didSelectItemAt:) | Apple Developer Documentation