Swift以编程方式创建uiimageview屏幕保持高度比的全宽

Question

我使用以下代码以编程方式创建uiimageview。

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

我遇到的问题是我希望 uiimageview 是屏幕的整个宽度，并且高度调整为当前图像高度。 我正在将不同的图像大小加载到这个 uiimageview 中。

如何做到这一点？

Answer 1

您可以通过几种方式执行此操作。我想填充图像的两侧，并让它坐在中心。

view.addSubview(imageView)
imageView.translatesAutoresizingMaskIntoConstraints = false
imageView.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
imageView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
imageView.widthAnchor.constraint(equalToConstant: view.frame.width - 80).isActive = true
imageView.heightAnchor.constraint(equalToConstant: view.frame.width - 80).isActive = true

Answer 2

您必须将 contentMode 设置为 .scaleAspectFit 。

let imageView = UIImageView(frame: self.view.frame) 
imageView.image = UIImage(named:"image.jpg") 
imageView.contentMode = .scaleAspectFit 
self.view.addSubview(imageView)

Answer 3

没有内置的方法可以让UIImageView根据image调整自身大小。您必须通过更改框架的高度或在更新图像时设置新的纵横比约束来调整 imageView 的高度。

UIImageView上有一个contentMode设置(.scaleAspectFit)，可以保持图像视图中图像的纵横比，但它不会调整图像视图本身的大小，而只是适合其中的图像，根据需要在图像上方和下方或侧面添加填充以保持纵横比。

更新框架：

以下是UIImageView的扩展，当设置image时，它会改变frame的高度：

extension UIImageView {
func setImageAndUpdateFrameHeight(image: UIImage) {
self.image = image
if image.size.width > 0 {
self.frame.size.height = self.frame.size.width / image.size.width * image.size.height
}
}
}

---

使用自动布局时更新纵横比

如果您使用的是自动布局，则需要在更新图像时设置新的纵横比约束。 使用此UIImageView子类来维护UIImageView的aspectRatio约束。 您需要添加约束来放置图像并设置其宽度。

class ResizingImageView: UIImageView {
var aspectRatio: NSLayoutConstraint?
func setImageAndUpdateAspectRatio(image: UIImage) {
self.image = image
aspectRatio?.isActive = false
if image.size.width > 0 {
aspectRatio = self.heightAnchor.constraint(equalTo: self.widthAnchor, multiplier: image.size.height / image.size.width)
}
aspectRatio?.isActive = true
}
}

笔记：

1. 如果在情节提要中进行此设置，请拖出一个UIImageView，并在身份检查器中将其类更改为ResizingImageView。
设置约束
2. 以放置图像视图并确定其宽度(例如：设置其超级视图的前导和尾随约束)。
3. 为其指定一个高度约束，然后在大小检查器中将该约束的优先级更改为Low (250)，以便 apectRatio 约束可以控制 imageView 的高度。
4. 向图像添加@IBOutlet查看：@IBOutlet var imageView: ResizingImageView!
5. 何时需要添加图像：imageView.setImageAndUpdateAspectRatio(image: newImage)