【Swift】画像の表示が上手くいきません

前提・実現したいこと

tableview cellにユーザーの画像と名前の情報が載っているのですが、画像の表示がうまくいきません。画像の通り、各セルにスワイプアクションがあり一度スワイプをすると画像が表示されるようになりますが、ページを初めて表示すると画像は表示されません。さらに画像の輪郭を丸くするコードも入れているのですが機能しておらず、原因がよくわかっていません。

該当のソースコード

import UIKit

import FirebaseFirestore
import FirebaseAuth
import FirebaseStorage
import Nuke

import Kingfisher

class InterestMatchListViewController: UIViewController, UITableViewDelegate, UITableViewDataSource{
    
    
    
    @IBOutlet var userListTableView: UITableView!
    
    let imageIV = CustomImageView()
    
    var interestedInUser = [User]()
    var mutuallyInterestedUser = [User]()
    
    override func viewDidLoad() {
         super.viewDidLoad()
        
        userListTableView.delegate = self
        userListTableView.dataSource = self
        
        
        loadInterestedInUsers {
            
            self.loadInterestedFromUsers {
                
                
                self.userListTableView.reloadData()
                
            }
            
        }
        
        userListTableView.reloadData()
        
     }
    
    
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        mutuallyInterestedUser.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        
        let cell = tableView.dequeueReusableCell(withIdentifier: "Cell")!
        cell.textLabel?.text = mutuallyInterestedUser[indexPath.row].userName
        if cell.imageView != nil{
            
            cell.imageView?.layer.cornerRadius = cell.imageView!.bounds.width / 2.0
            cell.imageView?.layer.masksToBounds = true
            
            
            let urlString = mutuallyInterestedUser[indexPath.row].profileImageUrl
            guard let url = URL(string: mutuallyInterestedUser[indexPath.row].profileImageUrl) else { return cell}
            DispatchQueue.main.async {
                Nuke.loadImage(with: url, into: cell.imageView!)
            }
            
            
            
            
            
            
            
            
        }
        
        
        return cell
    }
    
    
    func loadInterestedInUsers(completion: @escaping () -> Void){
        guard let loggedInUser = Auth.auth().currentUser else { return }
        
        Firestore.firestore().collection("users").document(loggedInUser.uid).collection("interestedTo").getDocuments { (interestedToUsers, error) in
            if error != nil {
                print(error)
            }else{
                interestedToUsers?.documents.forEach({ (snapshot) in
                    let dic = snapshot.data()
                    
                    let interestedUserInfo = User(dic: dic)
                    
                    self.interestedInUser.append(interestedUserInfo)
                    
                    
                })
            }
            completion()
        }
        
    }
    
    func loadInterestedFromUsers(completion: @escaping () -> Void){
        
        guard let loggedInUser = Auth.auth().currentUser else { return }
        
        interestedInUser.forEach { (user) in
            
            let userId = user.userId
            Firestore.firestore().collection("users").document(userId).collection("interestedTo").getDocuments { (snapshot, error) in
                if error != nil{
                    print(error)
                }else{
                    snapshot?.documents.forEach({ (document) in
                        let dic = document.data()
                        
                        let interestedToUsersInterestedUser = User(dic: dic)
                        
                        
                        if interestedToUsersInterestedUser.userId == loggedInUser.uid{
                            self.mutuallyInterestedUser.append(user)
                            
                        }
                        
                    })
                }
                completion()
            }
        }
        
        
        
    }
    
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        
        if segue.identifier == "toDetail"{
            let detailViewController = segue.destination as! DetailViewController
            
            let selectedIndex = userListTableView.indexPathForSelectedRow
            
            let userId = mutuallyInterestedUser[selectedIndex!.row].userId
            
            let userName = mutuallyInterestedUser[selectedIndex!.row].userName
            
            detailViewController.passedUserId = userId
            detailViewController.passedUserName = userName
            
            
            
            
        }
    }
    
    func tableView(_ tableView: UITableView, trailingSwipeActionsConfigurationForRowAt indexPath: IndexPath) -> UISwipeActionsConfiguration? {

        let message = goToMessage(at: indexPath)
        message.backgroundColor = .systemYellow
        
        
        return UISwipeActionsConfiguration(actions: [message])
    }
    
    
    
    
    func goToMessage(at indexPath: IndexPath) -> UIContextualAction{
        
        
        
        let messageAction = UIContextualAction(style: .normal, title: "メッセージを送る") { (action, view, completion) in
            
            
        
            
            let uid = Auth.auth().currentUser!.uid
            let partnerUid = self.mutuallyInterestedUser[indexPath.row].userId
            let members = [uid, partnerUid]
            
            let sortedArray = members.sorted(by: { $0 < $1 })
            
            let chatRoomDocumentId = sortedArray[0]+sortedArray[1]
            
            
            let docData = [
                "members": members,
                "latestMessageId": "",
                "createdAt": Timestamp()
            ] as [String: Any]
            
            
            
            
            
            Firestore.firestore().collection("chatRooms").document(chatRoomDocumentId).setData(docData) { (error) in
                if error != nil{
                    print("ChatRoom情報の保存に失敗しました。(error)")
                }else{
                    print("ChatRoom情報の保存に成功しました。")
                }
            }
            
            Firestore.firestore().collection("users").document(partnerUid).getDocument { (snapshot, error) in
                if error != nil{
                    print(error)
                }else{
                    print("完了")
                    
                    
                }
            }
            let vc = MessageKitChatViewController()

            vc.passedId = self.mutuallyInterestedUser[indexPath.row].userId
            vc.passedDisplayName = self.mutuallyInterestedUser[indexPath.row].userName
            vc.passedChatroomId = chatRoomDocumentId

            self.navigationController?.pushViewController(vc, animated: true)
            
            
            
            completion(true)
        
        }
        
        
        return messageAction
    }
    
    
    
}

試したこと

コードのいろんな箇所にreloadData()を入れるなどしてみましたが上手くいきませんでした。

hoshi-takanori

2021/02/07 23:04

たぶんデフォルトの UITableViewCell をそのままお使いだと思いますが、その場合 imageView に画像を設定しないと imageView は表示されません。特に、Nuke などで非同期で画像を設定する場合、次にセルをレイアウトするタイミングが来るまで imageView が表示されません。解決方法としては、カスタムセルにして imgeView を常に表示されるようにするのが良いと思います。

退会済みユーザー

2021/02/08 15:19

カスタムセルにするとできました。ありがとうございました。