swift - 实现tableViewCell高度自适应(随cell内部textView高度的变化而变化)

实现思路:

1)设置cell的高度为自动计算:UITableView.automaticDimension

2)为cell内部的view控件添加上下约束

如图所示,当cell高度自动计算,且约束添加成功时,cell竖直方向被撑满,这样cell的高度就会随着view控件的高度变化了 。

​​​​​​​实现步骤:

步骤一(自定义tableViewCell,设置约束!!!这里只使用一个label标题和一个textView模拟):创建TableViewControllerCell.swift文件,并添加如下代码:

// 自定义TableViewCell。以便使用“复用”特性
class TableViewControllerCell: UITableViewCell {
    var titleLabel = UILabel()
    var textView = UITextView()
    
    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: .value1, reuseIdentifier: nil)
        
        // 设置label控件
        self.titleLabel.frame = CGRect(x: 20, y: 15, width: 60, height: 20)
        self.titleLabel.backgroundColor = .yellow
        self.contentView.addSubview(self.titleLabel)
        
        // 设置textView控件
        self.textView.frame = CGRect(x: 100, y: 10, width: 100, height: 20)
        self.textView.backgroundColor = .green
        // 设置textView的内容不能滑动
        self.textView.isScrollEnabled = false
        self.contentView.addSubview(self.textView)
        
        // 为textView添加约束
        self.constraintsTextView()
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    // 为textView添加约束
    func constraintsTextView() {
        // 将textView的autolayout设置为失效,否则下面约束不起作用
        self.textView.translatesAutoresizingMaskIntoConstraints = false
        
        // 设置顶部约束
        self.textView.superview?.addConstraint(NSLayoutConstraint(item: self.textView, attribute: .topMargin, relatedBy: .equal, toItem: self.contentView, attribute: .topMargin, multiplier: 1.0, constant: 10))
        // 设置底部约束
        self.textView.superview?.addConstraint(NSLayoutConstraint(item: self.textView, attribute: .bottomMargin, relatedBy: .equal, toItem: self.contentView, attribute: .bottomMargin, multiplier: 1.0, constant: -10))
        // 设置左侧约束
        self.textView.superview?.addConstraint(NSLayoutConstraint(item: self.textView, attribute: .leftMargin, relatedBy: .equal, toItem: self.contentView, attribute: .leftMargin, multiplier: 1.0, constant: 100))
        // 设置宽度约束
        self.textView.addConstraint(NSLayoutConstraint(item: self.textView, attribute: .width, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier: 1.0, constant: 200))
        // 设置高度约束
        self.textView.addConstraint(NSLayoutConstraint(item: self.textView, attribute: .height, relatedBy: .greaterThanOrEqual, toItem: nil, attribute: .notAnAttribute, multiplier: 1.0, constant: 30))  
    }
    
}

步骤二(创建tableView控件):创建TableViewController.swift文件,并添加如下代码,这里一定要设置tableview的代理和数据源。cell复用机制的使用请移步 UITableViewCell复用机制的使用步骤 一文。

import UIKit

class TableViewController: UIViewController {
    private var tableView: UITableView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // 添加tableView控件
        self.tableView = UITableView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width, height: self.view.frame.height))
        // 注册tableviewCell复用池
        self.tableView.register(TableViewControllerCell.self, forCellReuseIdentifier: "cell")
        // 设置代理
        self.tableView.delegate = self
        // 设置数据源
        self.tableView.dataSource = self
        
        self.view.addSubview(self.tableView)
    }
    
    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(true)
        
        // 刷新tableView的数据
        self.tableView.reloadData()
    }
    
}

步骤三(设置cell的高度为自动计算UITableView.automaticDimension!!!):tableView各项设置的代码如下,注意在cellForRowAt方法中设置tetxview的代理。

extension TableViewController: UITableViewDelegate, UITableViewDataSource {
    
    // 设置tableView每行的预估高度
    func tableView(_ tableView: UITableView, estimatedHeightForRowAt indexPath: IndexPath) -> CGFloat {
        return 55
    }
    
    // 设置tableView每行的高度自适应
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return UITableView.automaticDimension
    }

    // 设置tableView的Section数量
    func numberOfSections(in tableView: UITableView) -> Int {
        return 2
    }

    // 设置tableView每一个section的行数
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }

    // 设置tableView每一行的内容
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // 复用tableViewCell
        let cell = self.tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath) as! TableViewControllerCell
        
        // 设置每一行的标题
        cell.titleLabel.text = "第" + String(indexPath.section) + "行"
        // 设置textView的代理
        cell.textView.delegate = self
        
        return cell
    }
    
}

步骤四实现textview高度自适应

// 设置textView高度自适应
extension TableViewController: UITextViewDelegate {
    func textViewDidChange(_ textView: UITextView) {
        // 储存原textView的大小
        let oldSize = textView.frame.size
        
        // 预设textView的大小,宽度设为固定宽度,高度设为CGFloat的最大值
        let presetSize = CGSize(width: textView.frame.size.width, height: CGFloat.greatestFiniteMagnitude)
        
        // 重新计算textView的实际大小
        let newSize = textView.sizeThatFits(presetSize)
        
        // 更新textView的大小
        textView.frame = CGRect(origin: CGPoint(x: textView.frame.origin.x, y: textView.frame.origin.y), size: CGSize(width: textView.frame.size.width, height: newSize.height))
        
        // 当高度变化时,刷新tableview(beginUpdates和endUpdates必须成对使用)
        if newSize.height != oldSize.height {
            self.tableView.beginUpdates()
            self.tableView.endUpdates()
        }
    }
    
}

实现效果:

  • 2
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要根据文字内容自动撑开TableViewCell高度,可以按照以下步骤操作: 1. 首先,在TableViewCell中添加一个UILabel,并设定好约束。 2. 在TableView的代理方法中,实现heightForRowAt方法。该方法返回值为该行的高度。在该方法中,计算UILabel的高度,并返回该高度。代码如下: ```swift func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat { let text = dataArray[indexPath.row] let width = UIScreen.main.bounds.size.width - 20 let font = UIFont.systemFont(ofSize: 17) let size = CGSize(width: width, height: CGFloat(MAXFLOAT)) let paragraph = NSMutableParagraphStyle() paragraph.lineBreakMode = .byWordWrapping let attributes = [NSAttributedString.Key.font: font, NSAttributedString.Key.paragraphStyle: paragraph] let rect = text.boundingRect(with: size, options: [.usesLineFragmentOrigin, .usesFontLeading], attributes: attributes, context: nil) return rect.height + 20 } ``` 3. 在TableViewCell中,设置UILabel的numberOfLines为0,并设定好约束。 4. 在TableView的代理方法中,实现cellForRowAt方法。在该方法中,设置UILabel的text属性。代码如下: ```swift func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath) let label = cell.viewWithTag(100) as! UILabel label.text = dataArray[indexPath.row] return cell } ``` 这样,就可以根据文字内容自动撑开TableViewCell高度了。其中,dataArray是存储文字内容的数组。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值