0

I have a custom UITableViewCell where I want to display an image with a height I've set.

As it is a custom cell, I want the image to be modified by the UITable that uses this custom cell (from cellForRowAt override).

In this case, I want to fix the height to 25.0, but I want to keep the aspect ratio of the image. Setting contentMode property to .scaleAspectFit centers my image (no idea why), and this is not I want (I want it to be on the left).

What I've done so far is setting the translatesAutoresizingMaskIntoConstraints to false and set up constraints, like so (logo is a UIImageView):

// logo settings
logo.translatesAutoresizingMaskIntoConstraints = false
aView.addSubview(logo)

NSLayoutConstraint.activate([
  // logo constraints
  logo.topAnchor.constraint(equalTo: aView.topAnchor, constant: 30.0),
  logo.leadingAnchor.constraint(equalTo: aView.leadingAnchor, constant: 40.0),
  logo.heightAnchor.constraint(equalToConstant: 25.0), // fixed height
])

Then, when using the customCell:

// ... some code before
cell.logo.image = UIImage(named: "newImage")

Any idea how I can keep the aspect ratio of the image and have a fixed height to it?

EDIT:

Sorry for being so evasive, here's an example of what I have and what and I want:

I have images on a server. Those images are downloaded in my app and displayed into a custom cell, but I don't know the width nor height of them.

Let's say the app retrieves an image that is 100w and 50h: I want to display it on the cell with a fixed height of 25 points.

Naturally, I want it to have the correct width (in this case it would be 50w and 25h). I don't want it to be cropped, I just want to display it with a height of 25 points. The width is only limited to its view bounds.

Anthony
  • 804
  • 3
  • 12
  • 32
  • I think you are confusing at least two things: a `UIImageView`'s content mode (in this case `scaleAspectFit`) and auto layout constraints (in this case the constraints you've set in a table view cell). Try this to prove me wrong... create a new project, set up an image view to be as large as the screen, and change images within it. Now, add something - many things - to make it look like a single table cell. Change things again. If that doesn't expose the issue, sorry to say this, but *you* haven't given enough detail in your question. –  Nov 19 '17 at 02:47
  • One more alternative - but again, the question is confusing. If you wish to **keep** a consistent aspect, set the image view width to be something relative to it's height. If square, then height == width. Use multipliers and constants. And (maybe mostly) learn about constraint priorities. But from what you've stated so far - it's hard to say what the actual issue is. –  Nov 19 '17 at 02:50
  • Sorry for being so evasive. In my application I have some images coming from a server, which I don't know the height nor the width. Those images will be displayed on a custom table cell, on which I want them to have a fixed height of xx (say: 25), but as I don't know the width nor the height, I want to keep their aspect ratio. How can I do this? – Anthony Nov 19 '17 at 22:31
  • If that's all you want, have you tried setting the content mode of the image view to "aspect fit"? That will keep the *image* aspect with visible image view background color. The other alternative is set it to "aspect fill", which will fill the image view without cropping the image. –  Nov 19 '17 at 22:57
  • I guess the best way to understand what you want is this: let's say you `UIImageView` a cell is 75h x 75w and you want to display an image that is 225h x 75w. (1) Do you want the entire image shown, or do you want it cropped? (2) If you want the entire image, do you want it shown as (a) aspect fit or as 75h x 25w or as (b) aspect filled or 75h x 75w. In the case of (a) you have some "white space" that can be a background color. In the case of (b) the image, while not cropped, is shrunk by height to fit 75 points - making the width 25 point *expanded* to 75 points. –  Nov 19 '17 at 23:00
  • Play with this and see if something works for you. –  Nov 19 '17 at 23:00
  • Please see my edit, thanks! @dfd – Anthony Nov 20 '17 at 17:33
  • Do you mind showing with images as to how it is now, and how you want it to be? Any constraints warnings/errors in the console? Also, take a look at this https://useyourloaf.com/blog/stretching-redrawing-and-positioning-with-contentmode/ and see if that helps. I'm not sure why it is not working for you. – Nitin Alabur Nov 20 '17 at 18:10
  • Finally understand. (Brain fart moment.) Displaying a 100w by 50h image (or something with a 2:1 w:h ratio) in a 100w by 25h view results in one of two things - cropping, or stretching/contracting. If cropped, the 2:1 is maintained and you've lost half of the image vertically. **Aspect fit** results in contracting and now you have a centered uncropped image that is 50 in width, leaving 25 points on each side of it. And I've always thought that **aspect fill* means you see your 100x50 image as 100x25, or a 4:1 ratio. Where' am I mistaken? –  Nov 20 '17 at 19:09

0 Answers0