133

I'm trying to create a UIImage View programmatically, I have a new view and I tried doing this

let imageName = "yourImage.png"
yourview.backgroundColor = UIColor.colorWithPatternImage(UIImage(named:imageName))

this did not work because I don't know what this should be yourview in the second line.

Question: How do I make a UIImageView appear on the screen by coding it instead of doing it in the storyboard

1
  • 10
    Unrelated to your question at hand, but, BTW, be forewarned if this image is not one that you'll need to use a lot, you might not want to use UIImage(named:...). As the docs say: "If you have an image file that will only be displayed once and wish to ensure that it does not get added to the system’s cache, you should instead create your image using UIImage(contentsOfFile:...). This will keep your single-use image out of the system image cache, potentially improving the memory use characteristics of your app." Just a FYI.
    – Rob
    Commented Oct 26, 2014 at 3:27

9 Answers 9

299

First you create a UIImage from your image file, then create a UIImageView from that:

let imageName = "yourImage.png"
let image = UIImage(named: imageName)
let imageView = UIImageView(image: image!)

Finally you'll need to give imageView a frame and add it your view for it to be visible:

imageView.frame = CGRect(x: 0, y: 0, width: 100, height: 200)
view.addSubview(imageView)
0
42

First create UIImageView then add image in UIImageView .

    var imageView : UIImageView
    imageView  = UIImageView(frame:CGRectMake(10, 50, 100, 300));
    imageView.image = UIImage(named:"image.jpg")
    self.view.addSubview(imageView)
40

This answer is update to Swift 3.

This is how you can add an image view programmatically where you can control the constraints.

Class ViewController: UIViewController {

    let someImageView: UIImageView = {
       let theImageView = UIImageView()
       theImageView.image = UIImage(named: "yourImage.png")
       theImageView.translatesAutoresizingMaskIntoConstraints = false //You need to call this property so the image is added to your view
       return theImageView
    }()

    override func viewDidLoad() {
       super.viewDidLoad()

       view.addSubview(someImageView) //This add it the view controller without constraints
       someImageViewConstraints() //This function is outside the viewDidLoad function that controls the constraints
    }

    // do not forget the `.isActive = true` after every constraint
    func someImageViewConstraints() {
        someImageView.widthAnchor.constraint(equalToConstant: 180).isActive = true
        someImageView.heightAnchor.constraint(equalToConstant: 180).isActive = true
        someImageView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
        someImageView.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: 28).isActive = true
    }

}
18

You can use above in one line.

  let imageView = UIImageView(image: UIImage(named: "yourImage.png")!)
1
  • 3
    You can, but it's not exactly "clean" Swift
    – Alec O
    Commented Jun 1, 2017 at 13:33
16

In Swift 3.0 :

var imageView : UIImageView
    imageView  = UIImageView(frame:CGRect(x:10, y:50, width:100, height:300));
    imageView.image = UIImage(named:"Test.jpeg")
    self.view.addSubview(imageView)
2
  • 1
    size and scale? Commented Oct 25, 2017 at 13:17
  • 1
    Undervoted for too many lines of code. Would be better to write it like this: let imageView = UIImageView(named: "Test.jpeg"); self.view.addSubview(imageView). 2 lines and you use a constant instead of a variable. Then use Autoconstraint to place it.
    – kakubei
    Commented Sep 13, 2018 at 13:40
12

In Swift 4.2 and Xcode 10.1

//Create image view simply like this.
let imgView = UIImageView()
imgView.frame = CGRect(x: 200, y: 200, width: 200, height: 200)
imgView.image = UIImage(named: "yourimagename")//Assign image to ImageView
imgView.imgViewCorners()
view.addSubview(imgView)//Add image to our view

//Add image view properties like this(This is one of the way to add properties).  
extension UIImageView {
    //If you want only round corners
    func imgViewCorners() {
        layer.cornerRadius = 10
        layer.borderWidth = 1.0
        layer.masksToBounds = true
    }
}
1
  • This answer works for Swift 4.2. For somebody like a novice, extension might add confusion to the understanding of the code even though it's still nice to have. Commented Nov 20, 2019 at 4:17
10

Thanks, MEnnabah, just to add to your code where you are missing the = sign in the declaration statement:

let someImageView: UIImageView = {
   let theImageView = UIImageView()
   theImageView.image = UIImage(named: "yourImage.png")
   theImageView.translatesAutoresizingMaskIntoConstraints = false //You need to call this property so the image is added to your view
   return theImageView
}()

Everything else is, all perfect for Swift 3.

0
2

Make sure to put:

imageView.translatesAutoresizingMaskIntoConstraints = false

Your image view will not show if you don't put that, don't ask me why.

-2

Swift 4:

First create an outlet for your UIImageView

@IBOutlet var infoImage: UIImageView!

Then use the image property in UIImageView

infoImage.image = UIImage(named: "icons8-info-white")
1
  • In swift 4.2 "unexpectedly found nil when unwrapping optional" error was thrown from the second line. Commented Nov 20, 2019 at 4:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.