分页滚动视图约束布局问题

Posted 2023-02-27

【中文标题】分页滚动视图约束布局问题

【英文标题】：Paging Scroll View constraints layout issue

【发布时间】：2019-10-12 08:26:33

【问题描述】：

在项目中，我创建了基于约束的分页滚动视图。大部分视图是在 xib 中设置的（SlideViewController. 和 UIView 的 SlideView 子类被添加到滚动视图）。 SlideViewController 包含 UIScrollView 和 UIView 作为内容视图，它们通过约束绑定到滚动视图。在 xib 中，这是简单的设置。 当我尝试将多个 SlideView 添加到内容视图时出现问题。当然，我想添加约束。首先，它会抛出警告Unable to simultaneously satisfy constraints. 并附有详细信息：

"<NSLayoutConstraint:0x600001806b70 H:|-(0)-[UIView:0x7ffac0d0cb40]   (active, names: '|':UIScrollView:0x7ffac1842600 )>",
    "<NSLayoutConstraint:0x600001806d00 UIView:0x7ffac0d0cb40.centerX == UIScrollView:0x7ffac1842600.centerX   (active)>",
    "<NSLayoutConstraint:0x600001805400 UIScrollView:0x7ffac1842600.trailing == UILayoutGuide:0x6000002308c0'UIViewSafeAreaLayoutGuide'.trailing   (active)>",
    "<NSLayoutConstraint:0x6000018058b0 UIScrollView:0x7ffac1842600.leading == UILayoutGuide:0x6000002308c0'UIViewSafeAreaLayoutGuide'.leading   (active)>",
    "<NSLayoutConstraint:0x6000018065d0 H:|-(0)-[PagingScrollView.SlideView:0x7ffac380be10](LTR)   (active, names: '|':UIView:0x7ffac0d0cb40 )>",
    "<NSLayoutConstraint:0x600001806670 PagingScrollView.SlideView:0x7ffac380be10.width == UIScrollView:0x7ffac1842600.width   (active)>",
    "<NSLayoutConstraint:0x600001806760 H:[PagingScrollView.SlideView:0x7ffac380be10]-(0)-[PagingScrollView.SlideView:0x7ffac3814d10](LTR)   (active)>",
    "<NSLayoutConstraint:0x600001806ad0 PagingScrollView.SlideView:0x7ffac3814d10.width == UIScrollView:0x7ffac1842600.width   (active)>",
    "<NSLayoutConstraint:0x600001806d50 H:[PagingScrollView.SlideView:0x7ffac3814d10]-(0)-[PagingScrollView.SlideView:0x7ffac3805d20](LTR)   (active)>",
    "<NSLayoutConstraint:0x600001806e90 PagingScrollView.SlideView:0x7ffac3805d20.width == UIScrollView:0x7ffac1842600.width   (active)>",
    "<NSLayoutConstraint:0x6000018070c0 H:[PagingScrollView.SlideView:0x7ffac3805d20]-(0)-[PagingScrollView.SlideView:0x7ffac3801b10](LTR)   (active)>",
    "<NSLayoutConstraint:0x600001807200 PagingScrollView.SlideView:0x7ffac3801b10.width == UIScrollView:0x7ffac1842600.width   (active)>",
    "<NSLayoutConstraint:0x6000018072f0 PagingScrollView.SlideView:0x7ffac3801b10.right == UIView:0x7ffac0d0cb40.right   (active)>",
    "<NSLayoutConstraint:0x600001818ff0 'UIView-Encapsulated-Layout-Width' UIView:0x7ffac0d0fba0.width == 414   (active)>",
    "<NSLayoutConstraint:0x600001804460 'UIViewSafeAreaLayoutGuide-left' H:|-(0)-[UILayoutGuide:0x6000002308c0'UIViewSafeAreaLayoutGuide'](LTR)   (active, names: '|':UIView:0x7ffac0d0fba0 )>",
    "<NSLayoutConstraint:0x600001805130 'UIViewSafeAreaLayoutGuide-right' H:[UILayoutGuide:0x6000002308c0'UIViewSafeAreaLayoutGuide']-(0)-|(LTR)   (active, names: '|':UIView:0x7ffac0d0fba0 )>"

而且它根本不滚动。仅显示最后一个 SlideView。看起来 contentView 没有根据约束调整大小。

以下代码负责将每个 SlideView 添加到 ScrollView（精确到内容视图）：

private func setup() 
        var prevLeftAnchor = contentView.leftAnchor;

        for i in 0 ..< slides.count 
            slides[i].translatesAutoresizingMaskIntoConstraints = false
            contentView.addSubview(slides[i])

            slides[i].leftAnchor.constraint(equalTo: prevLeftAnchor).isActive = true
            slides[i].topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
            slides[i].widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
            slides[i].heightAnchor.constraint(equalTo: scrollView.heightAnchor).isActive = true
            prevLeftAnchor = slides[i].rightAnchor;
        

        slides.last?.rightAnchor.constraint(equalTo: contentView.rightAnchor).isActive = true;

几个小时后，我卡住了，看不出问题出在哪里。我很感激任何回应。

可以看一下github中的简单项目https://github.com/sumofighter666/PageScroller

【参考方案1】：

在您的SlideViewController.xib 中，您对Content View 有一个CenterX 约束...

删除该约束，您应该可以滚动。

请注意，您还有 两个 Leading 约束。由于它们相同，因此不会影响任何内容，但为了清楚起见，不妨删除其中一个。

【讨论】：

谢谢！您的回答帮助我解决了问题