代码之家 › 专栏 › 技术社区 › Joseph

UIScrollView中的UIImageView缩放不正确

uiimageview uiscrollview swift ios

Joseph · 技术社区 · 7 年前

我想允许用户侧移图像。图像应该缩放到设备的高度,用户应该只能左右滚动。用户不应该能够缩放。我有一个 UIViewController ,我在其中添加了一个自定义子类 ImageScrollView . 本应以全高显示图像,但图像基本上是不缩放显示的。即使缩放比例计算正确,但没有效果。

我做错什么了?

谢谢

override func viewDidLoad() {
        super.viewDidLoad()

        let i = UIImage(named: "test.jpg")

        let iSV = ImageScrollView(image: i)
        self.view.addSubview(iSV)
        iSV.fillSuperview()
}

class ImageScrollView: UIScrollView {

    let image: UIImage
    let imageView = UIImageView()

    init(image img: UIImage) {    
        image = img
        imageView.image = image

        super.init(frame: .zero)

        self.addSubview(imageView)
        imageView.fillSuperview()

        self.contentSize = image.size

        self.showsHorizontalScrollIndicator = false
        self.showsVerticalScrollIndicator = false
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        self.zoomScale = getZoomScale()    
    }

    func getZoomScale() -> CGFloat{
        let boundSize = self.frame.size
        let yScale = boundSize.height / image.size.height
        return yScale   
    }    
}

为了防止它和自动布局有关,我把 fillSuperview 分机。

extension UIView {    
    public func fillSuperview() {
        translatesAutoresizingMaskIntoConstraints = false
        if let superview = superview {
            topAnchor.constraint(equalTo: superview.topAnchor, constant: 0).isActive = true
            leftAnchor.constraint(equalTo: superview.leftAnchor, constant: 0).isActive = true
            bottomAnchor.constraint(equalTo: superview.bottomAnchor, constant: 0).isActive = true
            rightAnchor.constraint(equalTo: superview.rightAnchor, constant: 0).isActive = true
        }
    }
}

2 回复 | 直到 7 年前

vacawama 7 年前

既然你不想让图像变焦,我建议你甚至不用担心变焦控件。一个 UIImageView 知道如何缩放其内容。

我建议你这样做:

添加将imageView高度设置为scrollView高度的约束。这将防止垂直滚动。
添加将imageView宽度设置为imageView高度(带乘数)的约束 image.size.width / image.size.height .
将imageView内容模式设置为 .scaleToFill .

要允许您更改图像,请保持 aspectRatio 保留在步骤2中设置的纵横比约束的属性。套 aspectRatio.isActive = false ,然后为新图像创建并激活新约束。

此外,如果您可能有图像不够宽,无法在缩放到垂直时水平填充滚动视图,请考虑以下更改:

将设置imageView宽度的约束替换为将宽度设置为等于imageView高度的约束 max(image.size.width / image.size.height, scrollView.bounds.width / scrollView.bounds.height) .
将imageView内容模式设置为 .scaleAspectFit .

然后,当您有一个窄图像时,imageView将填充scrollView,但是 .比例光谱 将显示以滚动视图为中心的整个图像。这仍然适用于宽图像,因为乘数将匹配图像纵横比和 .比例光谱 将填充整个imageView。

Lal Krishna 7 年前

您忘记实现scrollview委托。并为scrollview设置最小和最大缩放级别。

var iSV: ImageScrollView?

let i = UIImage(named: "noWiFi")!
iSV = ImageScrollView(image: i)
if let iSV = iSV {
    self.view.addSubview(iSV)
    iSV.fillSuperview()
    iSV.delegate = self
}

override func viewDidLayoutSubviews() {
        if let iSV = iSV {
            let scale = iSV.getZoomScale()
            iSV.minimumZoomScale = scale
            iSV.maximumZoomScale = scale
        }
}

extension ViewController: UIScrollViewDelegate {
    func viewForZooming(in scrollView: UIScrollView) -> UIView? {
        return iSV?.imageView
    }
}

注:我刚才做得很粗糙。它可能不能满足你的全部要求