UIScrollView 中图像之间的边距

Question

我想要的效果：图像之间的间距仅在滚动时可见（如照片应用）。

许多旧的 obj-c 答案建议将滚动视图的边界扩展到屏幕外以使其页面更远，并使屏幕外 space 成为图像之间的间隙。

pagingEnabled 的文档指出：

If the value of this property is YES, the scroll view stops on multiples of the scroll view’s bounds when the user scrolls.

因此，在尝试更改倍数值时，我扩展了 scrollView 的宽度，并启用了分页功能。然而，我没有通过差距实现页面的答案 - 他们总是把它留在视野中：

所以如果滚动宽度更长，为什么分页距离不合适？

    let gapMargin = CGFloat(20)
    scrollView.frame = CGRect(x: 0, y: 0, width: view.frame.width + gapMargin, height: view.frame.height)
    let exdScrollWidth = scrollView.frame.width

    //1
    let imageView1 = UIImageView()
    imageView1.backgroundColor = UIColor.green
    imageView1.frame = CGRect(x: 0, y: 0, width: exdScrollWidth - gapMargin, height: scrollView.bounds.size.height)

    //2
    let imageView2 = UIImageView()
    imageView2.backgroundColor = UIColor.yellow
    imageView2.frame = CGRect(x: exdScrollWidth, y: 0, width: exdScrollWidth - gapMargin, height: scrollView.bounds.size.height)

    //3
    let imageView3 = UIImageView()
    imageView3.backgroundColor = UIColor.red
    imageView3.frame = CGRect(x: exdScrollWidth * 2, y: 0, width: exdScrollWidth - gapMargin, height: scrollView.bounds.size.height)

    scrollView.contentSize.width = exdScrollWidth * 3

    scrollView.addSubview(imageView1)
    scrollView.addSubview(imageView2)
    scrollView.addSubview(imageView3)

Answer 1

如文档所述，一个 "page" 宽度是滚动视图的边界宽度。

假设图像宽度为 100 点。假设图像之间的 space 为 10 点。那么：

滚动视图的宽度必须为 110 点。
space必须在每张图片的每边分布5个点，像这样（假设我们有3张图片）：
```
5pts - 100pts (im) - 10pts - 100pts (im) - 10pts - 100pts(im) - 5pts
```

这将导致每个页面包含一个 100pt 图像，每边有 5 pts space，总共 110 pts，滚动视图的宽度：

    5pts - 100pts (im) - 10pts - 100pts (im) - 10pts - 100pts(im) - 5pts
    |                      |                      |                    |

Answer 2

原来我设置了等宽约束，但我忘记了。这意味着滚动视图分页的倍数固定在超级视图的宽度上。

UIScrollView 中图像之间的边距

Margin between images in UIScrollView

swift

uiscrollview

nslayoutconstraint

scroll-paging