XXI
XXI

Reputation: 27

How to place an ImageView in the center of a UIView?

How to place an ImageView in the center of a UIView? Code:

let dailyUIView = UIView(frame: CGRect(x: 0, y: 420, width: view.frame.size.width, height: 40))
dailyUIView.layer.masksToBounds = true
dailyUIView.backgroundColor = UIColor(named: "dailyTest")
scrollView.addSubview(dailyUIView)

let weatherIconImageView = UIImageView(frame: CGRect(x: 70, y: 0, width: 60, height: 60))
weatherIconImageView.image = UIImage(named: "01d")
dailyUIView.addSubview(weatherIconImageView)

Upvotes: 0

Views: 67

Answers (3)

Dinesh
Dinesh

Reputation: 174

Userful and Effective Extension for Adding Constraints in single line:

extension UIView {

func addConstarint(top: NSLayoutYAxisAnchor? = nil, leading: NSLayoutXAxisAnchor? = nil, bottom: NSLayoutYAxisAnchor? = nil, trailing: NSLayoutXAxisAnchor? = nil, padding: UIEdgeInsets = .zero, size: CGSize = .zero, centerX : NSLayoutXAxisAnchor? = nil , paddingX : CGFloat = 0, centerY : NSLayoutYAxisAnchor? = nil , paddingY : CGFloat = 0) {
    translatesAutoresizingMaskIntoConstraints = false
    
    if let top = top {
        topAnchor.constraint(equalTo: top, constant: padding.top).isActive = true
    }
    
    if let leading = leading {
        leadingAnchor.constraint(equalTo: leading, constant: padding.left).isActive = true
    }
    
    if let bottom = bottom {
        bottomAnchor.constraint(equalTo: bottom, constant: -padding.bottom).isActive = true
    }
    
    if let trailing = trailing {
        trailingAnchor.constraint(equalTo: trailing, constant: -padding.right).isActive = true
    }
    
    if size.width != 0 {
        widthAnchor.constraint(equalToConstant: size.width).isActive = true
    }
    
    if size.height != 0 {
        heightAnchor.constraint(equalToConstant: size.height).isActive = true
    }
    
    if let centerX = centerX {
        centerXAnchor.constraint(equalTo: centerX , constant: paddingX).isActive = true
    }
    
    if let centerY = centerY {
        centerYAnchor.constraint(equalTo: centerY , constant: paddingY).isActive = true
    }
}

}

Usage:

let dailyUIView = UIView(frame: CGRect(x: 0, y: 420, width: view.frame.size.width, height: 40))
let weatherIconImageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 60, height: 60))

scrollView.addSubview(dailyUIView)
dailyUIView.addSubview(weatherIconImageView)

weatherIconImageView.addConstarint(size: CGSize(width: 60, height: 60), centerX: dailyUIView.centerXAnchor, centerY: dailyUIView.centerYAnchor)

Upvotes: 0

Sahil Omer
Sahil Omer

Reputation: 179

try this it will maybe help

 let dailyUIView = UIView(frame: CGRect(x: 0, y: 420, width: view.frame.size.width, height: 40))
    dailyUIView.layer.masksToBounds = true
    dailyUIView.backgroundColor = UIColor(named: "dailyTest")
    scrollView.addSubview(dailyUIView)

    let weatherIconImageView = UIImageView(frame: CGRect(x: 70, y: 0, width: 60, height: 60))
    weatherIconImageView.image = UIImage(named: "01d")
    dailyUIView.addSubview(weatherIconImageView)
    weatherIconImageView.translatesAutoresizingMaskIntoConstraints = false
    
    weatherIconImageView.heightAnchor.constraint(equalToConstant: 60).isActive = true
    weatherIconImageView.widthAnchor.constraint(equalToConstant: 60).isActive = true
    
    weatherIconImageView.centerXAnchor.constraint(equalTo: dailyUIView.centerXAnchor).isActive = true
    weatherIconImageView.centerYAnchor.constraint(equalTo: dailyUIView.centerYAnchor).isActive = true

Upvotes: 2

Markus
Markus

Reputation: 598

   let dailyUIView = UIView(frame: CGRect(x: 0, y: 420, width: view.frame.size.width, height: 40))
   dailyUIView.layer.masksToBounds = true
   dailyUIView.backgroundColor = UIColor(named: "dailyTest")
   scrollView.addSubview(dailyUIView)

   let weatherIconImageView = UIImageView(frame: CGRect(x: 70, y: 0, width: 60, height: 60))
   weatherIconImageView.image = UIImage(named: "01d")
   dailyUIView.addSubview(weatherIconImageView)
        
   weatherIconImageView.translatesAutoresizingMaskIntoConstraints = false         
   NSLayoutConstraint.activate([
            weatherIconImageView.widthAnchor.constraint(equalToConstant: 60),
            weatherIconImageView.heightAnchor.constraint(equalToConstant: 60),
            weatherIconImageView.centerXAnchor.constraint(equalTo: dailyUIView.centerXAnchor),
            weatherIconImageView.centerYAnchor.constraint(equalTo: dailyUIView.centerYAnchor),
        ])

Upvotes: 2

Related Questions