ios - 在具有较大 contentSize 的 UIScrollView 中居中 UIImageView

Question

我有一个全面屏scrollView ，我在其中添加了 imageView作为 subview 。我想要 imageView居中并缩放填充 scrollView的大小(即屏幕大小)在开始时，但随后允许用户在两​​个方向(垂直和水平)滚动图像，在左、右、上和下具有相等的偏移量。

我的意思是:我已经设置了 ScrollView 的 contentSize成为 CGSize(width: screenWidth + 200, height: screenHeight + 200) ，如果我运行该应用程序，我发现我只能将这 200 点的偏移量滚动到图像的右侧和底部。我希望图像以内容大小为中心，并且能够以每侧偏移 100 pts 的方式将其水平滚动到左侧和右侧(垂直滚动时与顶部和底部类似)。

我怎么能做到这一点？

注:我在代码中设置所有 UI，我没有使用 Storyboard，也没有 xib文件

Answer 1

您可能会发现使用约束和自动布局比使用 screenWidth 更容易/更直观。和 screenHeight :

//
//  CenteredScrollViewController.swift
//  SW4Temp
//
//  Created by Don Mag on 4/18/18.
//

import UIKit

class CenteredScrollViewController: UIViewController {

    let theScrollView: UIScrollView = {
        let v = UIScrollView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = UIColor.green
        return v
    }()

    let theImageView: UIImageView = {
        let v = UIImageView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = UIColor.blue
        return v
    }()

    override func viewDidLoad() {
        super.viewDidLoad()

        // add the scrollView to the main view
        view.addSubview(theScrollView)

        // add the imageView to the scrollView
        theScrollView.addSubview(theImageView)

        // pin the scrollView to all four sides
        theScrollView.topAnchor.constraint(equalTo: view.topAnchor, constant: 0.0).isActive = true
        theScrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 0.0).isActive = true
        theScrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 0.0).isActive = true
        theScrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 0.0).isActive = true

        // constrain the imageView's width and height to the scrollView's width and height
        theImageView.widthAnchor.constraint(equalTo: theScrollView.widthAnchor, multiplier: 1.0).isActive = true
        theImageView.heightAnchor.constraint(equalTo: theScrollView.heightAnchor, multiplier: 1.0).isActive = true

        // set the imageView's top / bottom / leading / trailing anchors
        // this *also* determines the scrollView's contentSize (scrollable area)
        // with 100-pt padding on each side
        theImageView.topAnchor.constraint(equalTo: theScrollView.topAnchor, constant: 100.0).isActive = true
        theImageView.bottomAnchor.constraint(equalTo: theScrollView.bottomAnchor, constant: -100.0).isActive = true
        theImageView.leadingAnchor.constraint(equalTo: theScrollView.leadingAnchor, constant: 100.0).isActive = true
        theImageView.trailingAnchor.constraint(equalTo: theScrollView.trailingAnchor, constant: -100.0).isActive = true

    }

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        // set the scrollView's contentOffset (to center the imageView)
        theScrollView.contentOffset = CGPoint(x: 100, y: 100)
    }

}