Issue with adding constraints to UIImage programmatically | Swift

Mals Lanster

How can I set up constraints for an image to sit on the top center directly above the titleLabel of the following tableview extention.

The code below currently displays a titleLabel and a messageLabel right under it:

extension UITableView {
    func setEmptyView(title: String, message: String) {
        let emptyView = UIView(frame: CGRect(x: self.center.x, y: self.center.y, width: self.bounds.size.width, height: self.bounds.size.height))
        let titleLabel = UILabel()
        let messageLabel = UILabel()
        titleLabel.translatesAutoresizingMaskIntoConstraints = false
        messageLabel.translatesAutoresizingMaskIntoConstraints = false
        titleLabel.textColor = UIColor.black
        titleLabel.font = UIFont(name: "HelveticaNeue-Bold", size: 25)
        messageLabel.textColor = UIColor.lightGray
        messageLabel.font = UIFont(name: "HelveticaNeue-Regular", size: 23)
        emptyView.addSubview(titleLabel)
        emptyView.addSubview(messageLabel)
        titleLabel.centerYAnchor.constraint(equalTo: emptyView.centerYAnchor).isActive = true
        titleLabel.centerXAnchor.constraint(equalTo: emptyView.centerXAnchor).isActive = true
        messageLabel.topAnchor.constraint(equalTo: titleLabel.bottomAnchor, constant: 20).isActive = true
        messageLabel.leftAnchor.constraint(equalTo: emptyView.leftAnchor, constant: 20).isActive = true
        messageLabel.rightAnchor.constraint(equalTo: emptyView.rightAnchor, constant: -20).isActive = true
        titleLabel.text = title
        messageLabel.text = message
        messageLabel.numberOfLines = 0
        messageLabel.textAlignment = .center
        // The only tricky part is here:
        self.backgroundView = emptyView
        self.separatorStyle = .none
    }
    func restore() {
        self.backgroundView = nil
        self.separatorStyle = .singleLine
    }
}

I have tried adding the code below but it does not make it centered is off to the top left side:

let emptyImage = UIImage()
emptyImage = false
emptyView.addSubview(emptyImage)
emptyImage.centerXAnchor.constraint(equalTo: emptyView.centerXAnchor).isActive = true
emptyImage.bottomAnchor(equalTo: titleLabel.topAnchor, constant: 20).isActive = true

The image is a square of around 50x50

DonMag

You need to add a UIImageView as a subview, and then constrain it to the title label.

Give this a try - it will add an image view, centered above the title view, with a width of 50 and a height equal to its width (so, 50x50):

extension UITableView {
    func setEmptyView(title: String, message: String) {
        let emptyView = UIView(frame: CGRect(x: self.center.x, y: self.center.y, width: self.bounds.size.width, height: self.bounds.size.height))
        emptyView.backgroundColor = .cyan
        let titleLabel = UILabel()
        let messageLabel = UILabel()
        titleLabel.translatesAutoresizingMaskIntoConstraints = false
        messageLabel.translatesAutoresizingMaskIntoConstraints = false
        titleLabel.textColor = UIColor.black
        titleLabel.font = UIFont(name: "HelveticaNeue-Bold", size: 25)
        messageLabel.textColor = UIColor.lightGray
        messageLabel.font = UIFont(name: "HelveticaNeue-Regular", size: 23)
        emptyView.addSubview(titleLabel)
        emptyView.addSubview(messageLabel)
        titleLabel.centerYAnchor.constraint(equalTo: emptyView.centerYAnchor).isActive = true
        titleLabel.centerXAnchor.constraint(equalTo: emptyView.centerXAnchor).isActive = true
        messageLabel.topAnchor.constraint(equalTo: titleLabel.bottomAnchor, constant: 20).isActive = true
        messageLabel.leftAnchor.constraint(equalTo: emptyView.leftAnchor, constant: 20).isActive = true
        messageLabel.rightAnchor.constraint(equalTo: emptyView.rightAnchor, constant: -20).isActive = true
        titleLabel.text = title
        messageLabel.text = message
        messageLabel.numberOfLines = 0
        messageLabel.textAlignment = .center

        // start of add image view code
        let imgView = UIImageView()
        imgView.translatesAutoresizingMaskIntoConstraints = false
        if let img = UIImage(named: "s1") {
            imgView.image = img
        }
        emptyView.addSubview(imgView)
        NSLayoutConstraint.activate([
            imgView.bottomAnchor.constraint(equalTo: titleLabel.topAnchor, constant: 0.0),
            imgView.centerXAnchor.constraint(equalTo: titleLabel.centerXAnchor, constant: 0.0),
            imgView.widthAnchor.constraint(equalToConstant: 50.0),
            imgView.heightAnchor.constraint(equalTo: imgView.widthAnchor, multiplier: 1.0),
            ])
        // end of add image view code

        // The only tricky part is here:
        self.backgroundView = emptyView
        self.separatorStyle = .none
    }
    func restore() {
        self.backgroundView = nil
        self.separatorStyle = .singleLine
    }
}

If you want the image view to have a little spacing above the title view, set the constant on this line (to a negative number):

// this will add 20-pts vertical spacing between the 
// bottom of the image view and the top of the title label
imgView.bottomAnchor.constraint(equalTo: titleLabel.topAnchor, constant: -20.0),

Edit If you want to adjust the vertical positioning, change this line:

titleLabel.centerYAnchor.constraint(equalTo: emptyView.centerYAnchor).isActive = true

to this:

titleLabel.centerYAnchor.constraint(equalTo: emptyView.centerYAnchor, constant: 20).isActive = true

and set the constant value until you're happy with it.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

'UIImage?' is not convertible to 'UIImage' issue in swift 4

Adding a subview and position it with constraints programmatically

How to set the alpha of an UIImage in SWIFT programmatically?

Adding autolayout constraints to navigation controller programmatically

Adding constraints programmatically in Objective-C

add constraints programmatically swift

Adding a UISearchController and position it with constraints programmatically

Adding constraints programmatically in UIView with UITextView

NSGenericException when adding some constraints programmatically

Issue in rotating UIImage - IOS/Swift

Adding an identifier to UIImage object Swift

Adding constraints programmatically makes crash

Adding constraints programmatically

Inequality constraints programmatically swift

Swift 3 draw uiimage programmatically

Programmatically adding constraints to UIView

Adding constraints programmatically is not respecting priority

Adding negative constraints programmatically

Swift - Programmatically refresh constraints

Swift - StackView and Adding Constraints With Programmatically Added Views To Stack - Adjust Cell Hight After Load?

Adding UIButtons to uiimage of a UICollectionView cells programmatically

Adding constraints to UITextField programmatically

Add UIImage programmatically into ImageView non programmatically SWIFT

iOS adding constraints programmatically in Swift

swift update constraints programmatically

Swift - Programmatically Change Constraints

Swift 4 - Issue with constraints on iPhone

Swift position and constraints programmatically

swift set constraints for LoginButton programmatically