UIImageView 在 UIScrollView 内部剪切

您想使用滚动视图的内容和框架布局指南...

• 将堆栈视图的所有 4 个边限制到滚动视图的内容布局指南
• 将堆栈视图的高度限制为滚动视图的框架布局指南

对于您添加到堆栈视图的每个图像视图：

• 将图像视图的宽度限制为滚动视图的框架布局指南

这是一个完整的例子：

class ViewController: UIViewController,UIScrollViewDelegate {
    
    override func viewDidLoad() {
        super.viewDidLoad()

        // just trying to include what you've shown
        let textSV = UILabel()
        textSV.BACkgroundColor = .yellow
        textSV.text = "textSV"
        textSV.textAlignment = .center
        
        let anotherView = UILabel()
        anotherView.BACkgroundColor = .cyan
        anotherView.text = "anotherView"
        anotherView.textAlignment = .center
        
        [textSV,anotherView].forEach {
            $0.translatesAutoresizingMaskIntoConsTraints = false
            view.addSubview($0)
        }
        
        // respect safe area
        let safeG = view.safeAreaLayoutGuide
        
        NSLayoutConsTraint.activate([
            textSV.topAnchor.consTraint(equalTo: safeG.topAnchor),textSV.leadingAnchor.consTraint(equalTo: safeG.leadingAnchor),textSV.TrailingAnchor.consTraint(equalTo: safeG.TrailingAnchor),textSV.heightAnchor.consTraint(equalToConstant: 60.0),anotherView.leadingAnchor.consTraint(equalTo: safeG.leadingAnchor),anotherView.TrailingAnchor.consTraint(equalTo: safeG.TrailingAnchor),anotherView.bottomAnchor.consTraint(equalTo: safeG.bottomAnchor),anotherView.heightAnchor.consTraint(equalToConstant: 60.0),])

        let scrollView = UIScrollView()
        scrollView.translatesAutoresizingMaskIntoConsTraints = false
        scrollView.BACkgroundColor = .green
        scrollView.showsHorizontalScrollInDicator = false
        scrollView.delegate = self

        view.addSubview(scrollView)
        
        // use a stack view to hold and arrange the scrollView's subviews
        let stackView = UIStackView()
        stackView.translatesAutoresizingMaskIntoConsTraints = false
        
        // add the stackView to the scrollView
        scrollView.addSubview(stackView)
        
        // use scrollView's Content Layout Guide to define scrollable content
        let layoutG = scrollView.contentLayoutGuide
        
        // use scrollView's Frame Layout Guide to define content height (since you want horizontal scrolling)
        let frameG = scrollView.frameLayoutGuide
        
        NSLayoutConsTraint.activate([

            // consTrain scrollView Top to textSV Bottom
            scrollView.topAnchor.consTraint(equalTo: textSV.bottomAnchor),// consTrain scrollView Leading/Trailing to safe area
            scrollView.leadingAnchor.consTraint(equalTo: safeG.leadingAnchor),scrollView.TrailingAnchor.consTraint(equalTo: safeG.TrailingAnchor),// consTrain scrollView Bottom to anotherView Top
            scrollView.bottomAnchor.consTraint(equalTo: anotherView.topAnchor),// consTrain all 4 sides of the stackView to scrollView's Content Layout Guide
            stackView.topAnchor.consTraint(equalTo: layoutG.topAnchor),stackView.bottomAnchor.consTraint(equalTo: layoutG.bottomAnchor),stackView.leadingAnchor.consTraint(equalTo: layoutG.leadingAnchor),stackView.TrailingAnchor.consTraint(equalTo: layoutG.TrailingAnchor),// consTrain stackView's height to scrollView's Frame Layout Guide height
            stackView.heightAnchor.consTraint(equalTo: frameG.heightAnchor),])
        
        // add imageViews to the stack view
        for _ in 1...8 {
            let pageView = UIImageView(image: UIImage(named: "iphone12mockup"))
            //let pageView = UIImageView(image: UIImage(named: "sample"))
            // set image view BACkground color so you can
            //  see its frame (since the image will be aspect-fit scaled)
            pageView.BACkgroundColor = .systemYellow
            pageView.contentMode = .scaleAspectFit
            // add it to the stack view
            stackView.addArrangedSubview(pageView)
            // consTrain its Width to scrollView's Frame Layout Guide Width
            pageView.widthAnchor.consTraint(equalTo: frameG.widthAnchor).isActive = true
        }

    }
    
}

它在启动时看起来像这样（在 iPhone 8 上）：

然后向右滚动一点：

请注意，由于您希望将图像视图设置为 Aspect Fit，因此我给“pageView”图像视图设置了 .systemYellow 的背景色，以便您可以看到 imageView 框架填充了滚动视图框架的宽度和身高。

编辑 -- 如果您希望图像与其高度成正比，而没有“两侧的空白空间”，则需要设置与其高度成正比的图像视图宽度约束，基于图像大小。

用这个替换“添加图像视图”循环：

    // add imageViews to the stack view
    for _ in 1...8 {
        guard let img = UIImage(named: "iphone12mockup") else {
            fatalError("Could not load image!")
        }
        let pageView = UIImageView()
        pageView.image = img
        pageView.contentMode = .scaleToFill
        // add it to the stack view
        stackView.addArrangedSubview(pageView)
        // consTrain its Width proportional to the image height
        pageView.widthAnchor.consTraint(equalTo: pageView.heightAnchor,multiplier: img.size.width / img.size.height).isActive = true
    }

输出将是：

然后向右滚动一点：