iOS |工具包 |将头像图像调整到图像容器时出错

Question

我正在开发一个从端点获取数据的聊天视图，它有一个给我头像的密钥 URL，在转换该数据并将其显示在自定义聊天单元格上之后，它没有t 在自定义单元格中获取图像视图的高度和宽度（我将其限制为 32x32）

我添加了 Table View Controller 和 Table Cell Controller 的代码以及视图和单元格布局的参考图像。

自定义聊天单元格

屏幕错误

聊天单元代码


class MessageCell: UITableViewCell {

    @IBOutlet weak var userImage: UIImageView!
    @IBOutlet weak var userName: UILabel!
    @IBOutlet weak var userMessage: UILabel!
    
    override func awakeFromNib() {
        super.awakeFromNib()
        
        // set message corner radius as 8px and border
        userMessage.layer.backgroundColor = #colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0) // set the background color
        userMessage.layer.cornerRadius = 8 // set the corner radius
        userMessage.layer.masksToBounds = true // this will make sure that the corner radius bounds are all color of the layerBG
        userMessage.layer.borderWidth = 1
        userMessage.layer.borderColor = #colorLiteral(red: 0.937254902, green: 0.937254902, blue: 0.937254902, alpha: 1)
        

    }  
}

聊天视图控制器


class ChatTableViewController: UIViewController {
    // Cell ID
    let cellId = "ReusableCell"
    
     // table view where chat bubbles will be displayed.
    @IBOutlet var chatBoxTableView: UITableView!
    
    // Set up the messages data structure to capture the chat client data
    var messages : [MessageData]?
    
    override func viewDidLoad() {
        super.viewDidLoad()
        overrideUserInterfaceStyle = .light
        
        // set background color of the tableview
        chatBoxTableView.backgroundColor = #colorLiteral(red: 0.9764705882, green: 0.9764705882, blue: 0.9764705882, alpha: 1)
        
        // register the custom cell xib file (previously nib file)
        chatBoxTableView.register(UINib(nibName: "MessageCell", bundle: nil), forCellReuseIdentifier: cellId)
        
        // remove separators
        chatBoxTableView.separatorStyle = .none
        chatBoxTableView.dataSource = self
        
        
        // call out chat client to fetch data from the
        ChatClient().getData { [weak self] (message) in
            self?.messages = message // initiate the messages data from the chat client
            
            DispatchQueue.main.async {
                self?.chatBoxTableView.reloadData() // reload the table to show it.
            }
        }
        
    }
    
    
    
}

extension ChatTableViewController : UITableViewDataSource {
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        messages?.count ?? 0
    }

    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: cellId, for: indexPath) as! MessageCell

        
//         download image to display on the cell
        if let url = URL(string: messages?[indexPath.row].avatar_url ?? "Google.com") {
            URLSession.shared.dataTask(with: url) { [weak self] data , _ , error in
                if let data = data, error == nil {
                    // on the main thread
                    DispatchQueue.main.async {
                        cell.imageView?.image = UIImage(data: data)?.circleMask
                        self?.chatBoxTableView.reloadData()
                    }
                } else {
                    print("error data")
                }
            }.resume()
        }
        
        
        // give the cell data
        cell.userMessage.text = messages?[indexPath.row].message
        cell.userName.text = messages?[indexPath.row].name
        
        return cell

    }
}

Answer 1

您设置了自动布局约束的图像视图称为 userImage。

class MessageCell: UITableViewCell {
    @IBOutlet weak var userImage: UIImageView!

但是您正在将图像设置为不同图像视图：

cell.imageView?.image = UIImage(data: data)?.circleMask

那不是 userImage，是 imageView。它们是两个不同的东西。

iOS |工具包 |将头像图像调整到图像容器时出错

iOS | UIKit | Error sizing the avatar images to the image container

swift

uikit

message