UIImageView具有自动布局和最大尺寸保持纵横比

Question

我UIImageView在源代码中生成了一个(以编程方式).UIImageView对于宽度和高度,它需要具有最大尺寸.在此视图中,我从URL加载图像并在下载结束后设置.我以前不知道,图像的大小是多少,但我需要保持纵横比并使其UIImageView具有维持该方面的大小.

如果图像较小,在一个或两个维度上,我希望UIImageView具有保持纵横比而不拉伸图像所需的尺寸.

我举两个例子考虑的最大尺寸UIImageView用250 X 350.

例1:

图像大小是800 X 800.UIImageView需要的大小250 X 250.

例2:

图像大小是200 X 250.UIImageView需要的大小200 X 250.

如何使用自动布局执行此操作.

Answer 1

这里你需要三个约束.一个保持纵横比,一个确保宽度不大于最大值,一个确保高度不大于最大值.截至2016年8月,Interface Builder不支持引用其他约束的约束,因此 - 至少 - 必须在代码中完成宽高比约束.

宽高比是唯一可以考虑的因素.设V_w和V_h分别为图像视图的宽度和高度.设I_w和I_h分别是图像的宽度和高度.然后,为了保持图像的纵横比,必须保持以下等式:

或者,等效地:

好的,看起来不错.我们来写一些代码.在这段代码中,我假设你已经MAX_HEIGHT和MAX_WIDTH之前定义过.请注意,此代码必须以iOS 9.0或更高版本为目标.如果您的目标是早期版本的iOS,请参阅下面的块.

// Constrain the desired aspect ratio
[imageView.widthAnchor constraintEqualToAnchor:imageView.heightAnchor
                                    multiplier:aspectRatioMult].active = YES;

// Constrain height
[imageView.heightAnchor constraintLessThanOrEqualToConstant:MAX_HEIGHT].active = YES;

// Constrain width
[imageView.widthAnchor constraintLessThanOrEqualToConstant:MAX_WIDTH].active = YES;

对于9.0之前的iOS版本的代码,NSLayoutAnchor不可用.相反,你必须做出应有的决定NSLayoutConstraint.

CGFloat aspectRatioMult = (imageView.image.size.width / imageView.image.size.height);

// Constrain the desired aspect ratio
[imageView addConstraint:
  [NSLayoutConstraint constraintWithItem:imageView
                               attribute:NSLayoutAttributeWidth
                               relatedBy:NSLayoutRelationEqual
                                  toItem:imageView
                               attribute:NSLayoutAttributeHeight
                              multiplier:aspectRatioMult
                                constant:0]];

// Constrain height
[imageView addConstraints:
  [NSLayoutConstraint constraintsWithVisualFormat:@"V:[imageView(<=max)]"
                                          options:0
                                          metrics:@{@"max" : @(MAX_HEIGHT)}
                                            views:@{@"imageView" : imageView}]];

// Constrain width
[imageView addConstraints:
  [NSLayoutConstraint constraintsWithVisualFormat:@"H:[imageView(<=max)]"
                                          options:0
                                          metrics:@{@"max" : @(MAX_WIDTH)}
                                            views:@{@"imageView" : imageView}]];