美文网首页
UITableviewCell Autolayout 自适应高度

UITableviewCell Autolayout 自适应高度

作者: 小学生积极 | 来源:发表于2017-05-23 18:25 被阅读0次

    在iOS中,我们可以使用自动布局来定义表格视图单元格的高度,但是,默认情况下,该功能未启用。

    通常,单元格的高度由表视图委托的tableView:heightForRowAtIndexPath:方法决定。要启用自定义表视图单元格,必须将表视图的rowHeight属性设置为UITableViewAutomaticDimension。还必须为estimateRowHeight属性分配一个值。一旦设置了这两个属性,系统将使用自动布局来计算行的实际高度。

    tableView.estimatedRowHeight = 85.0
    tableView.rowHeight = UITableViewAutomaticDimension

    接下来,在Cell的内容视图中布置Cell的内容。要定义单元格的高度,还需要一个完整的约束和视图链(具有明确的高度)来填充内容视图的顶部边缘和底部边缘之间的区域。如果在Cell 中有固定的高度,系统将使用这些值。如果不是,则须向视图或内容视图本身添加适当的高度约束。

    UITableViewController

    import UIKit
    
    class FirstViewController: UITableViewController {
        let cellIdentifier = "cellIdentifier"
        let listData = [("title", "content"),
                        ("Trump 'to do everything' for Middle East peace", "The only credible ideas still require the creation of an independent and sovereign Palestinian state alongside Israel. The reality is that the Israelis and Palestinians are way apart on the main issues - the future of east Jerusalem, the fate of Palestinian refugees and the borders of an independent Palestine. The two sets of leaders also do not trust each other."),
                        ("Everest's Hillary Step: Has it gone or not?", "Days after a British mountaineer claimed that a famous rock feature near the summit of Mount Everest had disintegrated, two Nepali climbers have contradicted him.")]
        
        override func viewDidLoad() {
            super.viewDidLoad()
            
            tableView.register(TableViewCell().classForCoder, forCellReuseIdentifier: cellIdentifier)
            tableView.rowHeight = UITableViewAutomaticDimension
            tableView.estimatedRowHeight = 60.0
        }
        
        override func numberOfSections(in tableView: UITableView) -> Int {
            return 1
        }
        
        override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
            return listData.count
        }
       
        override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
            let cell = tableView.dequeueReusableCell(withIdentifier: cellIdentifier, for: indexPath) as! TableViewCell
            cell.showData(data: listData[indexPath.row])
            return cell
        }
    }
    

    TableViewCell

    import UIKit
    import SnapKit
    
    class TableViewCell: UITableViewCell {
        
        let titleLabel: UILabel = UILabel()
        let contentLabel: UILabel = UILabel()
        
        func showData(data:(String, String)) -> Void {
            titleLabel.text = data.0
            contentLabel.text = data.1
        }
        
        override init(style: UITableViewCellStyle, reuseIdentifier: String?) {
            super.init(style: style, reuseIdentifier: reuseIdentifier)
            
            self.backgroundColor = UIColor.white
            self.contentView.addSubview(titleLabel)
            self.contentView.addSubview(contentLabel)
            
            titleLabel.font = UIFont.systemFont(ofSize: 15)
            titleLabel.textColor = UIColor.darkGray
            titleLabel.numberOfLines = 0
            titleLabel.lineBreakMode = .byWordWrapping
            
            contentLabel.font =  UIFont.systemFont(ofSize: 13)
            contentLabel.textColor = UIColor.gray
            contentLabel.numberOfLines = 0
            contentLabel.lineBreakMode = .byWordWrapping
            
            titleLabel.snp.makeConstraints { (make) in
                make.left.right.equalToSuperview().inset(15)
                make.top.equalToSuperview().inset(14)
            }
            
            contentLabel.snp.makeConstraints { (make) in
                make.left.right.equalTo(titleLabel)
                make.top.equalTo(titleLabel.snp.bottom).offset(5)
                make.bottom.equalToSuperview().inset(15)
            }
        }
        
        required init?(coder aDecoder: NSCoder) {
            fatalError("init(coder:) has not been implemented")
        }
    }
    

    效果图:

    demo.png

    相关文章

      网友评论

          本文标题:UITableviewCell Autolayout 自适应高度

          本文链接:https://www.haomeiwen.com/subject/chsgxxtx.html