thumnailImageView에서 .video 와 .poster 분기 처리하기

 

 

https://explorer89.tistory.com/334

📌 컬렉션 뷰에서 .video 아이템 클릭 시 YouTube 영상 재생하기

 

⭐️ 현재는 didTapThumbnail()에서 .video만 처리하고 있어서 .poster를 위한 로직도 추가

 

1️⃣ MediaCollectionViewCellDelegate에 didTapPoster 추가

✅ .poster 클릭 시 이미지를 전체 화면으로 띄우기 위해 새로운 메서드 추가!

protocol MediaCollectionViewCellDelegate: AnyObject {
    func didTapVideo(with videoKey: String)
    func didTapPoster(with posterPath: String)
}

 

 

2️⃣ MediaCollectionViewCell에서 posterPath 변수 추가

✅ .video와 .poster 모두 thumbnailImageView를 사용하기 때문에,
✅ 탭했을 때 .video인지 .poster인지 구분할 변수를 추가

class MediaCollectionViewCell: UICollectionViewCell {
    
    // MARK: - Variable
    static let reuseIdentifier = "MediaCollectionViewCell"
    weak var delegate: MediaCollectionViewCellDelegate?   // ✅ Delegate 선언

    private var videoKey: String?    // ✅ 클릭 시 YouTube 영상 키 저장
    private var posterPath: String?  // ✅ 클릭 시 Poster 경로 저장

    // MARK: - UI Component
    private let thumbnailImageView: UIImageView = {
        let imageView = UIImageView()
        imageView.contentMode = .scaleAspectFill  
        imageView.clipsToBounds = true  
        imageView.layer.cornerRadius = 0  
        return imageView
    }()
    
    override init(frame: CGRect) {
        super.init(frame: frame)
        configureConstraints()
        setupTapGesture()  // ✅ 탭 제스처 추가
    }

    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func prepareForReuse() {
        super.prepareForReuse()
        thumbnailImageView.image = nil  
        videoKey = nil   // ✅ 기존 값 초기화
        posterPath = nil // ✅ 기존 값 초기화
    }
}

 

3️⃣ configure(with content: MediaInfo)에서 videoKey와 posterPath 저장

✅ .video는 videoKey를,
✅ .poster는 posterPath를 저장!

✅ "nil"을 통해 구분 

func configure(with content: MediaInfo) {
    let baseUrl = "https://img.youtube.com/vi/"
    
    switch content {
    case .video(let video):
        if let key = video.key {
            let thumbnailUrl = URL(string: "\(baseUrl)\(key)/hqdefault.jpg")
            thumbnailImageView.sd_setImage(with: thumbnailUrl, completed: nil)
            videoKey = key  // ✅ YouTube 영상 키 저장
            posterPath = nil // ✅ 포스터 값 초기화 (필요 없음)
        }

    case .poster(let poster):
        if let posterPath = poster.filePath {
            let posterUrl = URL(string: "https://image.tmdb.org/t/p/w500/\(posterPath)")
            thumbnailImageView.sd_setImage(with: posterUrl, completed: nil)
            self.posterPath = posterPath  // ✅ 포스터 경로 저장
            videoKey = nil // ✅ YouTube 값 초기화 (필요 없음)
        }
    }
}

 

4️⃣ didTapThumbnail()에서 .video와 .poster 구분

✅ .video라면 유튜브 실행
✅ .poster라면 이미지 전체 화면으로 보기 

private func setupTapGesture() {
    let tapGesture = UITapGestureRecognizer(target: self, action: #selector(didTapThumbnail))
    thumbnailImageView.isUserInteractionEnabled = true
    thumbnailImageView.addGestureRecognizer(tapGesture)
}

// ✅ 터치했을 때 `.video`와 `.poster` 분기 처리
@objc private func didTapThumbnail() {
    if let videoKey = videoKey {
        delegate?.didTapVideo(with: videoKey)  // ✅ 유튜브 실행
    } else if let posterPath = posterPath {
        delegate?.didTapPoster(with: posterPath)  // ✅ 전체 화면 이미지 보기
    }
}

 

5️⃣ MediaTableViewCell에서 MediaCollectionViewCellDelegate 구현

✅ didTapPoster를 구현해서, .poster를 클릭하면 이미지 뷰어를 띄우도록 처리

extension MediaTableViewCell: MediaCollectionViewCellDelegate {
    
    func didTapVideo(with videoKey: String) {
        delegate?.didTapVideo(with: videoKey)  // ✅ 유튜브 실행 (DetailViewController로 전달)
    }

    func didTapPoster(with posterPath: String) {
        delegate?.didTapPoster(with: posterPath)  // ✅ 이미지 전체 보기 (DetailViewController로 전달)
    }
}

 

6️⃣ DetailViewController에서 didTapPoster 구현

✅ 새로운 PosterViewController를 띄워서 전체 화면으로 보여주기

extension DetailViewController: MediaTableViewCellDelegate {
    
    func didTapVideo(with videoKey: String) {
        let trailerVC = TrailerViewController(trailerTitle: videoKey)
        present(trailerVC, animated: true)
    }

    func didTapPoster(with posterPath: String) {
        let posterVC = PosterViewController(posterPath: posterPath) // ✅ 새 뷰컨 생성
        present(posterVC, animated: true)  // ✅ 모달로 띄우기
    }
}