UIImage Aspect Fill and clipsToBounds

Question

I want to set an image to a UIImage, but as soon as I set it it the UIImageView gets bigger and goes over other elements.

There is a solution provided here: Crop UIImage to fit a frame image

But I can not get it to work, I set the properties like in the solution provided.

Maybe somebody can have a look and help me:

Without setting the image:

After setting the image:

class Cell: UICollectionViewCell, CollectionViewCellConfigurable {

    var image = UIImageView()
    var dateDay = UILabel()
    var dateMonth = UILabel()
    var title = UILabel()

    lazy private var dateContainer: UIView = {
       let v = UIView()
        v.sv(dateDay, dateMonth)

        dateDay.heightAnchor.constraint(equalTo: self.dateMonth.heightAnchor, multiplier: 1).isActive = true
        dateDay.leadingAnchor.constraint(equalTo: v.leadingAnchor, constant: 5).isActive = true
        dateDay.trailingAnchor.constraint(equalTo: v.trailingAnchor, constant: -5).isActive = true
        dateDay.topAnchor.constraint(equalTo: v.topAnchor, constant: 15).isActive = true
        dateDay.bottomAnchor.constraint(equalTo: dateMonth.topAnchor, constant: -5).isActive = true

        dateMonth.heightAnchor.constraint(equalTo: self.dateDay.heightAnchor, multiplier: 1).isActive = true
        dateMonth.leadingAnchor.constraint(equalTo: v.leadingAnchor, constant: 5).isActive = true
        dateMonth.trailingAnchor.constraint(equalTo: v.trailingAnchor, constant: -5).isActive = true
        dateMonth.topAnchor.constraint(equalTo: dateDay.bottomAnchor, constant: 5).isActive = true
//        dateMonth.bottomAnchor.constraint(greaterThanOrEqualTo: v.bottomAnchor, constant: -5).isActive = true
        return v
    }()

    lazy private var container: UIView = {
        return UIView()
    }()

    func configureCellAtIndexPath(item: Journaling) {
        self.image.image = UIImage.baliBeach
        self.image.backgroundColor = .green
        self.dateDay.text = "16"
        self.dateMonth.text = "May"
        self.title.text = "Text visible"

    }

    override init(frame: CGRect) {
        super.init(frame:frame)
        setUpLayout()
        additionalSetUp()
    }

    required init(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    func additionalSetUp() {
        backgroundColor = .clear
        let colorText: UIColor = .grau

        dateDay.textColor = colorText
        dateMonth.textColor = colorText
        title.textColor = colorText
        dateDay.textAlignment = .center
        dateMonth.textAlignment = .center
        title.textAlignment = .center
        image.contentMode = .scaleAspectFill
        image.clipsToBounds = true
        image.autoresizesSubviews = true

    }

    func setUpLayout() {
        sv(dateContainer, container)

        container.sv(image,title)

        dateContainer.widthAnchor.constraint(equalToConstant: 45).isActive = true
//        dateContainer.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 0.15).isActive = true
        dateContainer.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: 0).isActive = true
        dateContainer.trailingAnchor.constraint(equalTo: container.leadingAnchor, constant: 0).isActive = true
        dateContainer.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
        dateContainer.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true

//        container.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 0.5).isActive = true
        container.leadingAnchor.constraint(equalTo: dateContainer.trailingAnchor, constant: 0).isActive = true
        container.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: 0).isActive = true
        container.topAnchor.constraint(equalTo: self.topAnchor, constant: 0).isActive = true
        container.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0).isActive = true

        image.leadingAnchor.constraint(equalTo: container.leadingAnchor, constant: 5).isActive = true
        image.trailingAnchor.constraint(equalTo: container.trailingAnchor, constant: -5).isActive = true
        image.topAnchor.constraint(equalTo: self.topAnchor, constant: 15).isActive = true
        image.bottomAnchor.constraint(equalTo: title.topAnchor, constant: -5).isActive = true

        title.leadingAnchor.constraint(equalTo: container.leadingAnchor, constant: 0).isActive = true
        title.trailingAnchor.constraint(equalTo: container.trailingAnchor, constant: 0).isActive = true
        title.topAnchor.constraint(equalTo: image.bottomAnchor, constant: 5).isActive = true
        title.bottomAnchor.constraint(equalTo: container.bottomAnchor, constant: 0).isActive = true
    }
}

Answer 1

You need to higher vertical compression priority of the title label as the imageView is equal it = 750 , so it occupies the space

title.setContentCompressionResistancePriority(UILayoutPriority(rawValue: 751), for: .vertical)