Question

当设备宽度太大时，某些应用程序在UIScrollView实例的左侧和右侧添加了额外的填充。

重要的是，UIScrollView的内容不限于固定宽度，因为用户可以滚动到内容之外。看起来好像已经设置了contentInset，它会根据超级视图的宽度动态变化。我该如何实现？

注意

上方的屏幕并未实现为滚动视图，我只是想将其形象化。

Answer 1

如果完全是一个选项，则可以调整left和right（trailing，leading）自动布局约束。

下面的代码创建水平滚动的scrollView，其中包含两个容器。第一个容器包含一个带有一些边距的子视图（红色矩形）。

//: A UIKit based Playground for presenting user interface

import UIKit
import PlaygroundSupport

class MyViewController : UIViewController {

    private let scrollView = UIScrollView()
    private let contentView = UIView()

    override func loadView() {
        let view = UIView()
        self.view = view
        self.view.backgroundColor = UIColor.white

        scrollView.isPagingEnabled = true
        scrollView.isScrollEnabled = true
        scrollView.isUserInteractionEnabled = true
        scrollView.bounces = true
        self.view.addSubview(scrollView)

        scrollView.translatesAutoresizingMaskIntoConstraints = false

        NSLayoutConstraint.activate([
            scrollView.topAnchor.constraint(equalTo: self.view.topAnchor),
            scrollView.leftAnchor.constraint(equalTo: self.view.leftAnchor),
            scrollView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor),
            scrollView.rightAnchor.constraint(equalTo: self.view.rightAnchor)
            ])

        contentView.translatesAutoresizingMaskIntoConstraints = false
        contentView.backgroundColor = UIColor(white: 0.9, alpha: 0.9)
        scrollView.addSubview(contentView)

        let widthAnchor = contentView.widthAnchor.constraint(equalTo: scrollView.widthAnchor)
        let heightAnchor = contentView.heightAnchor.constraint(equalTo: scrollView.heightAnchor)
        widthAnchor.priority = .defaultLow
        heightAnchor.priority = .defaultLow

        NSLayoutConstraint.activate([
            contentView.topAnchor.constraint(equalTo: scrollView.topAnchor),
            contentView.leftAnchor.constraint(equalTo: scrollView.leftAnchor),
            contentView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
            contentView.rightAnchor.constraint(equalTo: scrollView.rightAnchor),
            widthAnchor,
            heightAnchor
            ])

        contentView.layer.borderWidth = 1
        contentView.layer.borderColor = UIColor.red.cgColor

        let containerView1 = UIView()
        containerView1.translatesAutoresizingMaskIntoConstraints = false
        contentView.addSubview(containerView1)
        containerView1.backgroundColor = UIColor(white: 0.4, alpha: 1)

        NSLayoutConstraint.activate([
            containerView1.topAnchor.constraint(equalTo: contentView.topAnchor),
            containerView1.leftAnchor.constraint(equalTo: contentView.leftAnchor),
            containerView1.bottomAnchor.constraint(equalTo: contentView.bottomAnchor),
            containerView1.widthAnchor.constraint(equalTo: scrollView.widthAnchor)
            ])

        let container1Content = container1ContentView()
        containerView1.addSubview(container1Content)
        NSLayoutConstraint.activate([
            container1Content.topAnchor.constraint(equalTo: containerView1.topAnchor, constant: 44),
            container1Content.leftAnchor.constraint(equalTo: containerView1.leftAnchor, constant: 44),
            container1Content.rightAnchor.constraint(equalTo: containerView1.rightAnchor, constant: -44),
            container1Content.bottomAnchor.constraint(equalTo: containerView1.bottomAnchor, constant: -44)
            ])


        let containerView2 = UIView()
        containerView2.translatesAutoresizingMaskIntoConstraints = false
        contentView.addSubview(containerView2)
        containerView2.backgroundColor =  UIColor(white: 0.9, alpha: 1)

        NSLayoutConstraint.activate([
            containerView2.topAnchor.constraint(equalTo: contentView.topAnchor),
            containerView2.leftAnchor.constraint(equalTo: containerView1.rightAnchor),
            containerView2.bottomAnchor.constraint(equalTo: contentView.bottomAnchor),
            containerView2.rightAnchor.constraint(equalTo: contentView.rightAnchor),
            containerView2.widthAnchor.constraint(equalTo: scrollView.widthAnchor)
            ])
    }

    private func container1ContentView() -> UIView {
        let content = UIView()
        content.translatesAutoresizingMaskIntoConstraints = false
        content.backgroundColor = UIColor.red
        return content
    }
}
// Present the view controller in the Live View window
PlaygroundPage.current.liveView = MyViewController()

如何通过编程在iPad上的UIScrollView中添加额外的填充？

1 个答案: