如何在自定义 UITableViewCell 中创建 UIImageVIew？ （迅速）

Posted 2023-03-04

【中文标题】如何在自定义 UITableViewCell 中创建 UIImageVIew？ （迅速）

【英文标题】：How to create UIImageVIew in custom UITableViewCell? (Swift)

【发布时间】：2016-03-19 18:40:36

【问题描述】：

我在UIViewController 中有一个UITableView，还有一个在我自己的自定义单元类中定义的原型单元。我在右上角有一个UIImageView，带有顶部和尾部边距约束，以及固定的宽度和高度：

In Interface Builder

问题是，当我运行程序时，TableView 已创建，但 imageView 过大：

At runtime

在这个网站上研究了一些类似的问题后，我得出的结论是：

单元格的 imageView 仅在您分配 图像。

我已经在自定义单元类中尝试了以下代码，以及cellForRowAtIndexPath 函数：

cell.imageView?.frame = CGRectMake(300, 52, 292, 136)
cell.imageView?.clipsToBounds = true
cell.contentView.addSubview(cell.imageView!)

我是否遗漏了什么或者我该怎么做才能使imageView 达到我对其进行限制的大小？

提前谢谢你！

【问题讨论】：

是的，您需要在单元格的包含视图中添加约束，并且无需以编程方式设置 imageView 的框架。例如：postimg.org/image/utqzbrjn1

你能在storyboard中给你的tableviewCell截图吗？如果您向我们展示您的限制，它会有所帮助。广告也可以在cellForRowAtIndexPath 下显示您的完整代码。

【参考方案1】：

UIView 具有属性 contentMode - 尝试将其定义为 ScaleToFill：

self.someImage.contentMode = .ScaleToFill 

【参考方案2】：

感谢大家的帮助！

我犯了一个愚蠢的错误，因为我引用了自定义单元格的通用 imageView?，而不是我用不同名称创建的 IB Outlet。

错误：

cell.imageView?.image = UIImage(named: "whatever name")

对：

cell.dogImageView.image = UIImage(named: "labrador")

【参考方案3】：

出于兴趣，固定宽度和高度约束的值是多少？由于视图控制器的大小不同，很难区分界面构建器和设备屏幕截图。

我的建议是取消固定的宽度和高度限制，而是：

• 将图像视图的底部固定到单元格的底部 - 这为图像视图提供了高度。

• 为图像视图添加纵横比约束 - 这会根据其高度为图像视图提供宽度。

这意味着即使您最终更改了单元格的高度，您的图像视图也将始终位于单元格内。

感谢使用原型单元格和 UITableViewCell 子类 - 我完全同意这种方法！

【讨论】：

感谢马修的快速回复！我已经尝试了你的建议，但它给了我相同的结果。宽度为 292，高度为 136。我应该提到该设备是 iPhone 6。imageView 是唯一的问题，似乎是因为它的约束没有被应用。

你能否提供更多关于设置表格视图本身的代码，以及 cellForRowAtIndexPath: 方法？然后我们也许可以查看您是否在做不应该做的事情，或者忘记做您应该做的事情！

【参考方案4】：

尽管我同意您使用自定义单元类，但您的代码似乎含糊不清。这样做是尝试下载所有图像集，如果无法下载，它将用保存在资产上的图像占位符替换图像。所有图像在加载时具有相同的大小。

您可以采取以下措施使其发挥作用。这是您的自定义类。

class SomeCell: UITableViewCell 

    @IBOutlet weak var imgMain: UIImageView!
    @IBOutlet weak var lblMain: UILabel!

    override func awakeFromNib() 
        super.awakeFromNib()
        // Initialization code
        imgMain.layer.cornerRadius = 5.0
        imgMain.clipsToBounds = true
    

    override func setSelected(selected: Bool, animated: Bool) 
        super.setSelected(selected, animated: animated)

        // Configure the view for the selected state
    

    func configureCell(image: UIImage, text: String)
        imgMain.image = image
        lblMain.text = text
    

然后在你的 ViewController 上

class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate 

    @IBOutlet weak var tableView: UITableView!

    var somePics = ["http://www.something.com/pic1.jpg","http://www.something.net/pic2.jpg","http://www.something.com/pic3.jpg","http://www.something.com/pic4.jpg","http://www.something.net/pic5.jpg"]

    var someTitles = ["Picture 1", "Picture 2", "Picture 3", "Picture 4", "Picture 5"]

    override func viewDidLoad() 
        super.viewDidLoad()
        tableView.delegate = self
        tableView.dataSource = self
        // Do any additional setup after loading the view, typically from a nib.
    

    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell 
        if let cell = tableView.dequeueReusableCellWithIdentifier("SomeCell") as? SomeCell 

            var img: UIImage!

            let url = NSURL(string: somePics[indexPath.row])!

            if let data = NSData(contentsOfURL: url) 
                img = UIImage(data: data)
            else 
                img = UIImage(named: "somePlaceholderpic")
            

            cell.configureCell(img, text: someTitles[indexPath.row])

            return cell

         else 

            return SomeCell()

        
    

    func numberOfSectionsInTableView(tableView: UITableView) -> Int 
        return 1
    

    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int 
        return somePics.count
    

    override func didReceiveMemoryWarning() 
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    

希望这会有所帮助。 :)