Positioning an image

This may seem really basic, but I'm not using the screen designer, I'm doing this old school (programmatically). I think I'm using Swift 5 (not actually sure). This image may help.

So I created my own UIImageView class called GenericImage

class GenericImage: UIImageView, @unchecked Sendable { ... }

I create the GenericImage class and add it to the View Controller. Then I load the image and set some positioning within my GenericImage class

let imageView = GenericImage(frame: CGRect.zero) 
self.view.addSubview(imageView) 
imageView.processResponse(componentDictionary )

In the GenericImage class I load the image and set some constraints.

self.imageFromURL(urlString: imageUrl)
self.translatesAutoresizingMaskIntoConstraints = false 
self.contentMode = .scaleAspectFit
self.widthAnchor.constraint(equalToConstant: 100.0).isActive = true
self.heightAnchor.constraint(equalToConstant: 100.0).isActive = true
self.centerXAnchor.constraint(equalTo: self.centerXAnchor).isActive = true
self.topAnchor.constraint(equalTo: self.centerYAnchor).isActive = true

The image is displayed at the top left of the screen.

I'm guessing that the code I have written should center the image on the screen. However, while I would like to know how to center the image, I also want to be able to position it at a specific place on the screen, using points (or pixels).

Any suggestions?

Answered by KeithB in 850460022

These lines are your problem:

self.centerXAnchor.constraint(equalTo: self.centerXAnchor).isActive = true
self.topAnchor.constraint(equalTo: self.centerYAnchor).isActive = true

You‘re setting self.centerXAnchor to equal itself, which will do nothing, and self.topAnchor to equal self.centerYAnchor, which is impossible.

Instead, you want to set self.centerXAnchor to equal the superview’s centerXAnchor and the same for the Y anchor. (In your case the superview will be the view controller’s view.)

For a specific position rather than centred, you’ll want to use constraints lining the image view up with the leading/top/trailing/bottom edges of the superview with a constant depending on your needs.

Accepted Answer

These lines are your problem:

self.centerXAnchor.constraint(equalTo: self.centerXAnchor).isActive = true
self.topAnchor.constraint(equalTo: self.centerYAnchor).isActive = true

You‘re setting self.centerXAnchor to equal itself, which will do nothing, and self.topAnchor to equal self.centerYAnchor, which is impossible.

Instead, you want to set self.centerXAnchor to equal the superview’s centerXAnchor and the same for the Y anchor. (In your case the superview will be the view controller’s view.)

For a specific position rather than centred, you’ll want to use constraints lining the image view up with the leading/top/trailing/bottom edges of the superview with a constant depending on your needs.

You should generally add the constraints in your view controller code, where you have access to both views., right after calling addSubview(:). Or if you really want the code in your image view for some reason you could create a method on your image view that takes the view as a parameter (e.g. addToView( view: uIView)) and call that from the view controller.

Hi @KeithB So I have now referenced the view controller and it is working much better. Thank you for your help.

Positioning an image
 
 
Q