使用更大的contentSize在UIScrollView中居中UIImageView

时间:2018-04-18 15:04:37

标签: ios swift uiscrollview uiimageview offset

我有一个全屏scrollView,我在其中添加imageView作为子视图。我希望imageView居中并缩放,在开头填充scrollView的大小(即屏幕大小),然后允许用户在两​​个方向上滚动图像(垂直和水平)在左,右,顶部和底部具有相等的偏移。

我的意思是:我已将滚动视图的contentSize设置为CGSize(width: screenWidth + 200, height: screenHeight + 200),如果我运行该应用,我看到我可以滚动这200个点仅偏移到图像的右侧和底部。我希望图像以内容大小为中心,并且能够将其水平滚动到左侧和右侧,每侧偏移100磅(垂直滚动时顶部和底部类似)

我怎么能实现这个目标?

注意:我在代码中设置了所有用户界面,我没有使用故事板或xib个文件

3 个答案:

答案 0 :(得分:0)

您只能向下和向右移动,因为您当前的内容偏移量为0,因此左上角 - 因此您可以向下移动200和向右移动200。

你想要的是滚动1/2垂直填充和1/2水平填充,所以在你的情况下你会scrollView.contentOffset = CGPoint(x: 100, y: 100)

此外,对于所有工作,UIImageView必须与scrollView的contentSize大小相同,因此大于屏幕尺寸。

鉴于评论我认为你想要的是填充屏幕的图像,然后用户可以滚动到图像的边界之外,那么你只需要使UIImageView的大小与屏幕的大小相同x和y坐标与contentOffset的{​​{1}}相同(100,100)。

以下是示例应用的视频: https://dzwonsemrish7.cloudfront.net/items/2v361r2p0O2j1D3x3W10/Screen%20Recording%202018-04-19%20at%2002.32%20PM.mov

答案 1 :(得分:0)

您可能会发现使用约束和自动布局比screenWidthscreenHeight更容易/更直观:

//
//  CenteredScrollViewController.swift
//  SW4Temp
//
//  Created by Don Mag on 4/18/18.
//

import UIKit

class CenteredScrollViewController: UIViewController {

    let theScrollView: UIScrollView = {
        let v = UIScrollView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = UIColor.green
        return v
    }()

    let theImageView: UIImageView = {
        let v = UIImageView()
        v.translatesAutoresizingMaskIntoConstraints = false
        v.backgroundColor = UIColor.blue
        return v
    }()

    override func viewDidLoad() {
        super.viewDidLoad()

        // add the scrollView to the main view
        view.addSubview(theScrollView)

        // add the imageView to the scrollView
        theScrollView.addSubview(theImageView)

        // pin the scrollView to all four sides
        theScrollView.topAnchor.constraint(equalTo: view.topAnchor, constant: 0.0).isActive = true
        theScrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: 0.0).isActive = true
        theScrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 0.0).isActive = true
        theScrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor, constant: 0.0).isActive = true

        // constrain the imageView's width and height to the scrollView's width and height
        theImageView.widthAnchor.constraint(equalTo: theScrollView.widthAnchor, multiplier: 1.0).isActive = true
        theImageView.heightAnchor.constraint(equalTo: theScrollView.heightAnchor, multiplier: 1.0).isActive = true

        // set the imageView's top / bottom / leading / trailing anchors
        // this *also* determines the scrollView's contentSize (scrollable area)
        // with 100-pt padding on each side
        theImageView.topAnchor.constraint(equalTo: theScrollView.topAnchor, constant: 100.0).isActive = true
        theImageView.bottomAnchor.constraint(equalTo: theScrollView.bottomAnchor, constant: -100.0).isActive = true
        theImageView.leadingAnchor.constraint(equalTo: theScrollView.leadingAnchor, constant: 100.0).isActive = true
        theImageView.trailingAnchor.constraint(equalTo: theScrollView.trailingAnchor, constant: -100.0).isActive = true

    }

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        // set the scrollView's contentOffset (to center the imageView)
        theScrollView.contentOffset = CGPoint(x: 100, y: 100)
    }

}

答案 2 :(得分:0)

尝试一下 Swift 4. *或5。*

let maxScale = self.imageScrollView.maximumZoomScale
let minScale = self.imageScrollView.minimumZoomScale

if let imageSize = imageView.image?.size{
    let topOffset: CGFloat = (boundsSize.height - minScale * imageSize.height ) / 2
    let leftOffset: CGFloat = (boundsSize.width - minScale * imageSize.width ) / 2
    self.imageScrollView.contentInset = UIEdgeInsets(top: topOffset, left: leftOffset, bottom: 0, right: 0)
}