如何调整UIImageView与矢量图适配缩放,避免图像模糊
矢量PDF图在UIScrollView放大后模糊的问题处理
我在资产目录中有一个名为Link的矢量图(PDF格式,已设置保留矢量数据),用UIImageView展示的代码如下:
let image = UIImage(named: "Link") let imageView = UIImageView() imageView.contentMode = .scaleAspectFit imageView.image = image
当前视图层级结构:[view hierarchy]
使用.scaleAspectFit时,只要设置好imageView的frame,图像就能以对应分辨率清晰渲染,目前显示正常。但加入UIScrollView实现缩放滚动后,放大图像会出现分辨率不足导致的模糊:[放大后模糊的图像]
是否有简便方法调整UIImageView,使其以更高分辨率渲染图像?
现有思路讨论
- 使用
.scaleAspectFit时,图像渲染分辨率依赖于imageView的frame大小。设置更大的frame再通过transform缩放视图可以解决问题,但操作繁琐。 - 另一种方法是用UIGraphicsImageRenderer等工具从矢量图手动渲染对应分辨率的图像,这是目前首选方案,但想知道有没有更简便的基于UIImageView的实现方式。
示例代码
在新项目中替换主ViewController即可运行(需准备名为Link的矢量图并设置为“Template Image”):
class ViewController: UIViewController, UIScrollViewDelegate { let contentView: UIView = UIView(frame: CGRect(x: 0.0, y: 0.0, width: 1000.0, height: 1000.0)) let scrollView: UIScrollView = { let view = UIScrollView(frame: CGRect(x: 0.0, y: 0.0, width: 400.0, height: 400.0)) view.minimumZoomScale = 0.5 view.maximumZoomScale = 10.0 return view }() override func viewDidLoad() { super.viewDidLoad() self.scrollView.delegate = self self.contentView.backgroundColor = UIColor.green.withAlphaComponent(0.2) // setup view hierarchy self.scrollView.translatesAutoresizingMaskIntoConstraints = false self.contentView.translatesAutoresizingMaskIntoConstraints = false self.view.addSubview(self.scrollView) self.scrollView.addSubview(self.contentView) // constraints self.scrollView.leftAnchor.constraint(equalTo: self.view.leftAnchor).isActive = true self.scrollView.rightAnchor.constraint(equalTo: self.view.rightAnchor).isActive = true self.scrollView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true self.scrollView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true self.contentView.leftAnchor.constraint(equalTo: self.scrollView.leftAnchor).isActive = true self.contentView.rightAnchor.constraint(equalTo: self.scrollView.rightAnchor).isActive = true self.contentView.topAnchor.constraint(equalTo: self.scrollView.topAnchor).isActive = true self.contentView.bottomAnchor.constraint(equalTo: self.scrollView.bottomAnchor).isActive = true self.contentView.widthAnchor.constraint(equalToConstant: 10.0 * self.view.frame.width).isActive = true self.contentView.heightAnchor.constraint(equalToConstant: 10.0 * self.view.frame.height).isActive = true // setup imageView let image = UIImage(named: "Link") let imageView = UIImageView() imageView.contentMode = .scaleAspectFit imageView.image = image imageView.tintColor = UIColor.black imageView.translatesAutoresizingMaskIntoConstraints = false self.contentView.addSubview(imageView) // add constraints imageView.centerXAnchor.constraint(equalTo: self.contentView.centerXAnchor).isActive = true imageView.centerYAnchor.constraint(equalTo: self.contentView.centerYAnchor).isActive = true imageView.widthAnchor.constraint(equalToConstant: 100.0).isActive = true imageView.heightAnchor.constraint(equalToConstant: 100.0).isActive = true } override func viewDidAppear(_ animated: Bool) { super.viewDidAppear(animated) let zoomScale = 8.0 self.scrollView.contentOffset = CGPoint(x: 0.5 * (self.contentView.frame.width - self.scrollView.frame.width), y: 0.5 * (self.contentView.frame.height - self.scrollView.frame.height)) self.scrollView.zoomScale = zoomScale } func viewForZooming(in scrollView: UIScrollView) -> UIView? { return self.contentView } }
内容的提问来源于stack exchange,提问作者Wizard
相关产品推荐
相关产品推荐

