【问题标题】:contentMode (scaleAspectFill) on UIImageView - SwiftUIImageView 上的 contentMode (scaleAspectFill) - Swift
【发布时间】:2018-04-07 16:21:54
【问题描述】:

我正在尝试创建一个小示例来解释UIImageViewcontentMode (scaleAspectFill)。

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

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

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 时图像可能会被裁剪,但不会被压扁或拉伸。

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

注意:请使用您喜欢的随机图片,因为我直接从我的资产中使用了一张。

请找到展示这种奇怪行为的截图。

我有什么遗漏的吗?

【问题讨论】:

    标签: ios swift swift3 uiscrollview uiimageview


    【解决方案1】:

    你想为所有UIImageViews 设置这个:

    imageView.clipsToBounds = true
    

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

    如果您要使用情节提要,可以在属性检查器中进行检查:

    【讨论】:

    • 非常感谢@Milan Nosáľ。猜猜,当一个人不了解基础知识时,就会发生这种情况。
    猜你喜欢
    • 2015-07-25
    • 2022-08-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多