iOS uitextView动态高度

原创

mob649e8168f1bb 2024-08-03 09:55:37 ©著作权

©著作权归作者所有：来自51CTO博客作者mob649e8168f1bb的原创作品，请联系作者获取转载授权，否则将追究法律责任

iOS UITextView 动态高度实现指南

在iOS开发中，UITextView 是一个常用的多行文本输入控件。经常会有需求，就是根据文本内容的变化自动调整UITextView的高度。下面我们将通过一个简单的流程，教你如何实现 UITextView 的动态高度。

过程步骤概览

步骤	操作	说明
1	添加UITextView到视图	创建UITextView并布局
2	设置UITextView的Delegate	监听文本变化
3	监听文本变化，计算高度	动态计算并调整高度
4	更新布局	更新UITextView的frame

详细步骤

1. 添加UITextView到视图

let textView = UITextView() // 创建UITextView实例
textView.delegate = self // 设置delegate
textView.isScrollEnabled = false // 关闭滚动以便自适应高度
textView.font = UIFont.systemFont(ofSize: 16) // 设置字体大小
view.addSubview(textView) // 添加到视图中

注释: 这里创建了一个UITextView实例，并将其添加到主视图。此外，我们关闭了滚动功能，以便文本过长时能够根据内容自动调整高度。

2. 设置UITextView的Delegate

class ViewController: UIViewController, UITextViewDelegate {
    // textView的初始化和相关代码
}

注释: 我们的ViewController实现了UITextViewDelegate协议，以监听UITextView的文本变化事件。

3. 监听文本变化，计算高度

func textViewDidChange(_ textView: UITextView) {
    let size = CGSize(width: textView.frame.width, height: .infinity) // 定义一个无限高度
    let estimatedSize = textView.sizeThatFits(size) // 计算文本适应的大小
    textView.constraints.forEach { (constraint) in // 更新高度约束
        if constraint.firstAttribute == .height {
            constraint.constant = estimatedSize.height
        }
    }
}

注释: 在此方法中，我们根据TextView的内容计算它适合的高度，并更新它的高度约束，从而实现动态高度效果。

4. 更新布局

最后，我们需要确保在每次UITextView的文本发生改变时，应用程序都能够重新布局控件。你可以在viewDidLoad方法中初始化约束。

override func viewDidLoad() {
    super.viewDidLoad()
    // 在这里设置初始位置和约束
    textView.translatesAutoresizingMaskIntoConstraints = false // 使用Auto Layout
    NSLayoutConstraint.activate([
        textView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
        textView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
        textView.topAnchor.constraint(equalTo: view.topAnchor, constant: 20)
    ])
}

注释: 这里定义了UITextView的初始位置及约束，确保它在视图中的正确显示。

旅行图

journey
    title iOS UITextView 动态高度实现
    section 准备工作
      创建UITextView: 5: developer
      设置Delegate: 3: developer
    section 实现动态高度
      监听文本变化: 4: developer
      计算并更新高度: 5: developer

甘特图

gantt
    title UITextView动态高度实现计划
    section 准备工作
    添加UITextView    : a1, 2023-10-01, 1d
    设置Delegate       : a2, after a1, 1d
    section 实现动态高度
    监听文本变化       : a3, after a2, 2d
    更新布局           : a4, after a3, 1d