UIKit中添加多张图片后UIScrollView无法垂直滚动的问题求助

问题根源 #

你的代码导致UIScrollView无法滚动的核心问题如下：

1. 未定义内容底部边界：UIScrollView需要明确内部内容的总高度才能触发滚动，你最后一个image4没有和scrollView的底部锚点建立约束，系统无法计算内容整体高度，因此无法滚动。
2. 存在编译错误：代码里调用了scroll.addSubview(image5)，但并未定义image5变量，会导致编译失败，需删除这行无效代码。
3. 冗余约束：image1重复设置了两次widthAnchor.constraint(equalTo: scroll.widthAnchor)，多余约束可能引发布局冲突，建议删除。

修复后的完整代码 #

class ViewController: UIViewController {
    private var image: UIImageView = {
        let image = UIImageView()
        image.translatesAutoresizingMaskIntoConstraints = false
        return image
    }()
    private var image1: UIImageView = {
        let image = UIImageView()
        image.translatesAutoresizingMaskIntoConstraints = false
        return image
    }()
    private var image2: UIImageView = {
        let image = UIImageView()
        image.translatesAutoresizingMaskIntoConstraints = false
        return image
    }()
    private var image3: UIImageView = {
        let image = UIImageView()
        image.translatesAutoresizingMaskIntoConstraints = false
        return image
    }()
    private var image4: UIImageView = {
        let image = UIImageView()
        image.translatesAutoresizingMaskIntoConstraints = false
        return image
    }()      
    private var scroll: UIScrollView = {
       let scroll = UIScrollView()
        scroll.translatesAutoresizingMaskIntoConstraints = false
        return scroll
    }()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        view.addSubview(scroll)
        
        // 删除无效的image5添加代码
        scroll.addSubview(image)
        scroll.addSubview(image1)
        scroll.addSubview(image2)
        scroll.addSubview(image3)
        scroll.addSubview(image4)

        let imagetest = UIImage(named: "test")
        image.image = imagetest
        image1.image = imagetest
        image2.image = imagetest
        image3.image = imagetest
        image4.image = imagetest

        NSLayoutConstraint.activate([
            scroll.leadingAnchor.constraint(equalTo: self.view.leadingAnchor),
            scroll.trailingAnchor.constraint(equalTo: self.view.trailingAnchor),
            scroll.topAnchor.constraint(equalTo: self.view.topAnchor),
            scroll.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
            
            image.leadingAnchor.constraint(equalTo: scroll.leadingAnchor),
            image.trailingAnchor.constraint(equalTo: scroll.trailingAnchor),
            image.topAnchor.constraint(equalTo: scroll.topAnchor, constant: 20),
            image.heightAnchor.constraint(equalToConstant: 200),
            image.widthAnchor.constraint(equalTo: scroll.widthAnchor),
    
            
            image1.leadingAnchor.constraint(equalTo: scroll.leadingAnchor),
            image1.trailingAnchor.constraint(equalTo: scroll.trailingAnchor),
            image1.topAnchor.constraint(equalTo: image.bottomAnchor, constant: 20),
            image1.heightAnchor.constraint(equalToConstant: 200),
            image1.widthAnchor.constraint(equalTo: scroll.widthAnchor),

            
            image2.leadingAnchor.constraint(equalTo: scroll.leadingAnchor),
            image2.trailingAnchor.constraint(equalTo: scroll.trailingAnchor),
            image2.topAnchor.constraint(equalTo: image1.bottomAnchor, constant: 20),
            image2.heightAnchor.constraint(equalToConstant: 200),
            image2.widthAnchor.constraint(equalTo: scroll.widthAnchor),

            
            image3.leadingAnchor.constraint(equalTo: scroll.leadingAnchor),
            image3.trailingAnchor.constraint(equalTo: scroll.trailingAnchor),
            image3.topAnchor.constraint(equalTo: image2.bottomAnchor, constant: 20),
            image3.heightAnchor.constraint(equalToConstant: 200),
            image3.widthAnchor.constraint(equalTo: scroll.widthAnchor),

            
            image4.leadingAnchor.constraint(equalTo: scroll.leadingAnchor),
            image4.trailingAnchor.constraint(equalTo: scroll.trailingAnchor),
            image4.topAnchor.constraint(equalTo: image3.bottomAnchor, constant: 20),
            image4.heightAnchor.constraint(equalToConstant: 200),
            image4.widthAnchor.constraint(equalTo: scroll.widthAnchor),
            // 关键：添加内容与scrollView底部的约束，确定总高度
            image4.bottomAnchor.constraint(equalTo: scroll.bottomAnchor, constant: -20)
        ])     
    }
}

其他实现视图滚动的方式 #

如果你的内容是列表类结构，还有更高效的替代方案：

• UITableView：专门用于垂直列表展示，自带单元格复用机制，适合大量重复内容的场景，无需手动管理内容高度。
• UICollectionView：比UITableView更灵活，支持网格、瀑布流等多种布局，同样自带复用机制，适合复杂布局的滚动内容。
• UIStackView + UIScrollView：将所有子视图放入垂直方向的UIStackView，再把StackView嵌套进UIScrollView，只需给StackView设置宽度等于ScrollView，同时对齐StackView与ScrollView的上下左右锚点，即可自动计算内容高度，大幅简化布局代码。

内容的提问来源于stack exchange，提问作者Shillwi2593