Center UIImageView inside UIView

Question

So I have a UIImageView named currentEventImage that is inside an UIView blurryBackGround. I currently want to center the UIImageView in the UIView. Below is my current code

//Subviews will be added here
view.addSubview(blurryBackGround)
view.addSubview(currentEventImage)
view.addSubview(currentEventDate)

//Constraints will be added here
_ = blurryBackGround.anchor(top: view.topAnchor, left: view.leftAnchor, bottom: nil, right: view.rightAnchor, paddingTop: 17, paddingLeft: 0, paddingBottom: 0, paddingRight: 0, width: self.view.frame.width, height: 330)
currentEventImage.heightAnchor.constraint(equalToConstant: 330).isActive = true
currentEventImage.topAnchor.constraint(equalTo: blurryBackGround.topAnchor, constant: 5).isActive = true
currentEventImage.center = blurryBackGround.center
blurryBackGround.addSubview(currentEventImage)

Any idea how I would do that?

currentEventImage.center = blurryBackGround.convert(blurryBackGround.center, from: blurryBackGround.superview)

Tried this and it didn't work

have you checked this - https://stackoverflow.com/a/11253622/4637057 — Vincent Joy, Jan 25 '18 at 05:26
you mean the one from 2012 with the old syntax and depracated methods @VincentJoy — Ron Baker, Jan 25 '18 at 05:28
please Comment lines containing `heightAnchor` & `topAnchor` and retry — Lal Krishna, Jan 25 '18 at 05:48

mugx · Accepted Answer · 2018-01-25T06:17:59.867

You may want to try the following solution based on centerXAnchor and centerYAnchor (feel free to remove constraints on width/height):

import UIKit

class ViewController: UIViewController {
    @IBOutlet var niceIcon:UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        niceIcon.translatesAutoresizingMaskIntoConstraints = false
        niceIcon.heightAnchor.constraint(equalToConstant: 100).isActive = true
        niceIcon.widthAnchor.constraint(equalToConstant: 100).isActive = true
        niceIcon.centerXAnchor.constraint(lessThanOrEqualTo: niceIcon.superview!.centerXAnchor).isActive = true
        niceIcon.centerYAnchor.constraint(lessThanOrEqualTo: niceIcon.superview!.centerYAnchor).isActive = true
    }
}

example of storyboard, raw icon misplaced and without any constraints.

on the simulator:

another solution (a bit more verbose) might be to add constraints, with the same constant, on leftAnchor, rightAnchor, bottomAnchor, topAnchor. Such constant stands for the distance between the superview and the subview itself.

score 0 · Answer 2 · edited Jan 25 '18 at 07:05

You can use the following example code:-

Here I have given the width and height of View as (200,400) and for UIImageView I have given the size as (50,50)

let whitView = UIView(frame:CGRect(self.view.frame.size.width/2-200/2,self.view.frame.size.height/2-400/2,200,400))
whitView.backgroundcolor = UIColor.white
view.addSubview(whitView)
let imgView = UIImageView(frame:CGRect(whitView.frame.size.width/2-50/2,whitView.frame.size.height/2-50/2,50,50))
imgView.image = UIImage(named: "abc.png")
whitView.addSubview(imgView)

Center UIImageView inside UIView

2 Answers2