具有内容视图和 UIImageView 的自动布局 UIScrollView 大小不正确

Autolayout UIScrollView with a content view and UIImageView not sizing properly

我在使用 UIView 时遇到一些问题,其中所有内容都作为子视图 (ALLES_SAMEN_VIEW) 添加。我添加了一些边框,这样您就可以看到哪里出错了。

我将所有视图作为子视图添加到我的内容视图中,因为它们需要重叠并且可以一起缩放。内容视图在 width/height 中没有像 UIImageView 和我的 UIView 的自定义子类一样被拉伸以进行绘图。奇怪的是,一切都在内容视图中。

因此,我的 touchHandler 只能在更小的未拉伸视图中被识别,也就是 "ALLES_SAMEN_VIEW" 而不是更远的视图。这应该像所有其他的一样被拉伸才能正常工作。如果我从内容视图开始,我仍然可以画得比内容视图的边界更远。

提前致谢!

var afbeelding = UIImage()
var drawView = DrawingCanvas()
var imageView = UIImageView()

@IBOutlet var ALLES_SAMEN_VIEW: UIView!

@IBOutlet var scrollView: UIScrollView!
@IBOutlet var EraserButtonOutlet: UIBarButtonItem!

override func viewDidLoad() {
    super.viewDidLoad()
    scrollView.delegate = self
    
    imageView = UIImageView(image: afbeelding) //Setting image of user as background
    
    scrollView.contentSize = afbeelding.size //Setting size of image as contentsize for scrollview
    
    scrollView.panGestureRecognizer.minimumNumberOfTouches = 2 // 2 finger panning and zooming. 1 is for drawing
    scrollView.panGestureRecognizer.maximumNumberOfTouches = 2
    
    drawView.frame = imageView.frame // Everything should have the same frame size etc
    ALLES_SAMEN_VIEW.frame = imageView.frame

    drawView.isOpaque = false // false otherwise it's not transparant as top view
    
    ALLES_SAMEN_VIEW.addSubview(imageView) // Adding all in the same view for zooming at the same time
    ALLES_SAMEN_VIEW.addSubview(drawView)
    
    scrollView.addSubview(ALLES_SAMEN_VIEW) // Adding the contentview to the scrollview

    drawView.dag = dag // Setting object in custom view for handeling the lines
    
    /*Testing
     ImageView for background image
     DrawView where user can draw on the background image (Custom class for storing everything)
     ALLES_SAMEN_VIEW for putting the 2 as subview so the zoom would be the same
     */
    
    ALLES_SAMEN_VIEW.layer.borderColor = UIColor.black.cgColor
    ALLES_SAMEN_VIEW.layer.borderWidth = 10
    
    scrollView.layer.borderColor = UIColor.blue.cgColor
    scrollView.layer.borderWidth = 2
    
    drawView.layer.borderColor = UIColor.red.cgColor
    drawView.layer.borderWidth = 15
    
    imageView.layer.borderColor = UIColor.yellow.cgColor
    imageView.layer.borderWidth = 20
    
    setZoomScale()
}

func viewForZooming(in scrollView: UIScrollView) -> UIView? {
    return ALLES_SAMEN_VIEW
}

func setZoomScale() {
    var minZoom = min(self.view.bounds.size.width / ALLES_SAMEN_VIEW.bounds.size.width, self.view.bounds.size.height / ALLES_SAMEN_VIEW.bounds.size.height);

    if (minZoom > 1.0) {
        minZoom = 1.0;
    }

    scrollView.minimumZoomScale = minZoom;
    scrollView.zoomScale = minZoom;
    scrollView.maximumZoomScale = 8.0
}

限制条件:

我对您的代码进行了以下更改,看来 ALLES_SAMEN_VIEW 现在具有正确的框架:

  1. 以这种方式声明您的 imageView 变量:(而不是 var imageView = UIImageView()
@IBOutlet var imageView: UIImageView!

然后在Storyboard中添加一个UIImageView作为ALLES_SAMEN_VIEW的子视图。确保您还添加了约束以使此视图与 ALLES_SAMEN_VIEW.

的大小相同
  1. 删除这些行:(让故事板处理)
ALLES_SAMEN_VIEW.addSubview(imageView)
...
scrollView.addSubview(ALLES_SAMEN_VIEW)
  1. 替换此行:
imageView = UIImageView(image: afbeelding)

有了这个:

imageView.image = afbeelding

备注:

  • 如果您想以编程方式添加子视图(如您最初所做的那样),您还需要以编程方式添加约束以使框架匹配。但是既然你已经在使用storyboard了,那你不妨让它来处理这些关系
  • 这些更改不会使 drawView 的大小正确:您可能还想使用故事板实例化 drawView 并添加约束,就像我对 [=15= 所做的一样]
  • 据我所知,捏合缩放手势可能没有按照您的意愿行事,但我认为这超出了您的问题范围