固定宽度，可变高度的图像视图ios布局

Question

I want an imageview which has fixed width but variable height. I want to refresh view if the image that I get from the website is heighter than the imageview in storyboard,

This is the view when I use "Scale to Fill".

postimg.org/image/6l1ol2pvz

And this is when I use "Aspect Fill"

postimg.org/image/9duw53q8f/

I want the image to be like in "Aspect Fill" but I can't place the bottom correctly.

Thank you all!

Solution:

I gave my image width and height constraints. Then I changed it programmatically. This is the view I wanted and I made it work!

http://i.stack.imgur.com/PCgHw.png

let imageData = NSData(contentsOfURL: imgUrl)
let myImage = UIImage(data: imageData!)
let aspectRatio = (myImage?.size.height)! / (myImage?.size.width)!

self.postCombineImageViewHeight.constant = UIScreen.mainScreen().bounds.size.width * aspectRatio
self.postCombineImageViewWidth.constant = UIScreen.mainScreen().bounds.size.width

Thank you all for your help!

Answer 1

You should select "clip subviews" in the "Attributes inspector" of this image view in IB (or programmatically set the clipToBounds property of the image view).

For example, this is a landscape image shown in a square image view with a content model of "aspect fill", but with "clip subviews" unchecked (ie with clipToBounds set to false ):

(I've added a red CAShapeLayer to show where the frame of the UIImageView is.)

This is the same image view, but with "clip subviews" checked (ie clipToBounds property is true ):

---

Alternatively, you could choose "aspect fit", rather than "aspect fill", in which case the whole image will be visible and not distorted, but you may end up with blank space on the edges of the photo:

Answer 2

您可以在情节提要中设置高度约束，然后在viewcontroller中拖放约束IBOutlet并在从网站获取imageview时更改其常量

Answer 3

Are you using storyboards? And auto layout?

Try this: place a "vertical distance" constraint between the bottom of the photo and the top of the view that is on the bottom.

Then click the added constraint and on the Attributes Inspector change the relation to "Greater Than or Equal".

This way, the imageView height will adapt to the image content; but if the image's height grows too large, it will stop growing when it reaches the bottom view.

Answer 4

My solution -

1) Provide a height and width constraint for your image.

2) Import AVFoundation kit.

3) Generate a new rect for your image by the following code(fitting it via aspect ratio) -

  let boundingRect =  CGRect(x: 0, y: 0, width: width, height: CGFloat(MAXFLOAT))//width is your fixed width for your image eg. - if your image covers width of your superview. It can be - self.view.frame.width

          let rect  = AVMakeRectWithAspectRatioInsideRect(photo.image.size, boundingRect)

So now you got your rect -

Now you can change your height constraint by having something like this -

imageHeightConstraint.constant = rect.size.height

Answer 5

You can do it programmatically using NSLayoutConstraint

self.addConstraint(NSLayoutConstraint(
        item: myButton,
        attribute: .Width,
        relatedBy: .Equal,
        toItem: nil,
        attribute: .NotAnAttribute,
        multiplier: 1.0,
        constant: 200))

And for the height you add the variable height