UIImageView 上的 contentMode (scaleAspectFill) - Swift

Question

我试图创建一个小例子说明了contentMode（scaleAspectFill）的一个UIImageView。

一切都经过编码，没有使用故事板。检查了很多有助于解释这一点的例子。但是，找不到任何适合我的要求。

请在下面找到完整的代码。

class ImageViewController: UIViewController {

    let marginSpacing = CGFloat(10)

    lazy var imageView1: UIImageView = {
        let view = UIImageView()
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    lazy var imageView2: UIImageView = {
        let view = UIImageView()
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    lazy var imageView3: UIImageView = {
        let view = UIImageView()
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    lazy var imageView4: UIImageView = {
        let view = UIImageView()
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    lazy var imageView5: UIImageView = {
        let view = UIImageView()
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    lazy var contentView: UIView = {
        let view = UIView()
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    lazy var scrollView: UIScrollView = {
        let view = UIScrollView()
        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    override func viewDidLoad() {
        super.viewDidLoad()
        self.title = "Image Auto-Scale"
        // Do any additional setup after loading the view.
        setupImageView()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


    /*
    // MARK: - Navigation

    // In a storyboard-based application, you will often want to do a little preparation before navigation
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        // Get the new view controller using segue.destinationViewController.
        // Pass the selected object to the new view controller.
    }
    */

    fileprivate func setupImageView() {

        updateImageViews()
        colorImageViews()
        addImageViews()
        setupImageConstraints()
    }

    fileprivate func updateImageViews() {

        self.navigationItem.setRightBarButton(UIBarButtonItem(barButtonSystemItem: .done, target: self, action: #selector(tappedBackButton)), animated: true)

        imageView1.image = #imageLiteral(resourceName: "Sample")
        imageView1.contentMode = .scaleAspectFill

        imageView2.image = #imageLiteral(resourceName: "Sample")
        imageView2.contentMode = .scaleAspectFill

        imageView3.image = #imageLiteral(resourceName: "Sample")
        imageView3.contentMode = .scaleAspectFill

        imageView4.image = #imageLiteral(resourceName: "Sample")
        imageView4.contentMode = .scaleAspectFill

        imageView5.image = #imageLiteral(resourceName: "Sample")
        imageView5.contentMode = .scaleAspectFill

    }

    fileprivate func colorImageViews() {

        contentView.backgroundColor = UIColor.white
    }

    fileprivate func addImageViews() {

        contentView.addSubview(imageView1)
        contentView.addSubview(imageView2)
        contentView.addSubview(imageView3)
        contentView.addSubview(imageView4)
        contentView.addSubview(imageView5)
        scrollView.addSubview(contentView)
        view.addSubview(scrollView)
    }

    fileprivate func setupImageConstraints() {

        if #available(iOS 11, *) {

            NSLayoutConstraint.activate([scrollView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
                                         scrollView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)])
        } else {

            NSLayoutConstraint.activate([scrollView.topAnchor.constraint(equalTo: topLayoutGuide.bottomAnchor),
                                         scrollView.bottomAnchor.constraint(equalTo: bottomLayoutGuide.topAnchor)])
        }

        NSLayoutConstraint.activate([scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
                                     scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
                                     scrollView.widthAnchor.constraint(equalTo: view.widthAnchor),
                                     contentView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
                                     contentView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
                                     contentView.topAnchor.constraint(equalTo: scrollView.topAnchor),
                                     contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
                                     contentView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
                                     contentView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
                                     contentView.heightAnchor.constraint(equalToConstant: 1000),
                                     imageView1.topAnchor.constraint(equalTo: contentView.topAnchor, constant: marginSpacing),
                                     imageView1.widthAnchor.constraint(equalTo: contentView.widthAnchor, multiplier: 0.5, constant: 0),
                                     imageView1.heightAnchor.constraint(equalTo: imageView1.widthAnchor, multiplier: 3.0/4.0, constant: 0),
                                     imageView1.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor),
                                     imageView2.topAnchor.constraint(equalTo: imageView1.bottomAnchor, constant: marginSpacing),
                                     imageView2.widthAnchor.constraint(equalTo: contentView.widthAnchor, multiplier: 0.75, constant: 0),
                                     imageView2.heightAnchor.constraint(equalTo: imageView2.widthAnchor, multiplier: 2.0/3.0, constant: 0),
                                     imageView2.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor),
                                     imageView3.topAnchor.constraint(equalTo: imageView2.bottomAnchor, constant: marginSpacing),
                                     imageView3.widthAnchor.constraint(equalTo: contentView.widthAnchor, multiplier: 0.6, constant: 0),
                                     imageView3.heightAnchor.constraint(equalTo: imageView3.widthAnchor, multiplier: 1.0/1.0, constant: 0),
                                     imageView3.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor),
                                     imageView4.topAnchor.constraint(equalTo: imageView3.bottomAnchor, constant: marginSpacing),
                                     imageView4.widthAnchor.constraint(equalTo: contentView.widthAnchor, multiplier: 0.4, constant: 0),
                                     imageView4.heightAnchor.constraint(equalTo: imageView4.widthAnchor, multiplier: 1.0/3.0, constant: 0),
                                     imageView4.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor),
                                     imageView5.topAnchor.constraint(equalTo: imageView4.bottomAnchor, constant: marginSpacing),
                                     imageView5.widthAnchor.constraint(equalTo: contentView.widthAnchor, multiplier: 0.5, constant: 0),
                                     imageView5.heightAnchor.constraint(equalTo: imageView5.widthAnchor, multiplier: 3.0/4.0, constant: 0),
                                     imageView5.centerXAnchor.constraint(equalTo: scrollView.centerXAnchor)])
    }

    @objc func tappedBackButton (sender: UIBarButtonItem!) {
        self.dismiss(animated: true, completion: nil);
    }

}

这将显示 5 张不同纵横比的图像，表明使用 scaleAspectFill 时图像可能会被裁剪，但它永远不会被压扁或拉伸。

奇怪的是，在调试视图层次结构时，我能够以我使用的纵横比获得图像，但在模拟器上我得到的只是其他东西！

注意：请使用您喜欢的随机图像，因为我直接从我的资产中使用了一个。

请找到所附的截图，其中展示了这种奇怪的行为。

有什么我错过的吗？

Answer 1

你想为所有的UIImageViews设置这个：

imageView.clipsToBounds = true

否则图像将被渲染到一个 imageView 的框架之外。

如果您要使用故事板，您可以在 Attributes Inspector 中检查它：