4

由于自 iOS7 以来的大量更新,我想问这个问题,因为我对自动布局和新堆栈视图的经验有限,我想知道在 Objective-C 中实现以下内容的最佳设计实践是什么(还不快):

在此处输入图像描述

在我看来,有一个容器滚动视图,带有一个子容器 UIView。在这个 UIView 中,有许多元素。其中一个元素是一堆 UIView,它们的数量偶尔会有所不同。

此元素后跟地图和其他视图。

这就是我计划组织它的方式: 在此处输入图像描述

问题

  1. 这是正确的做法吗?当我以编程方式删除和添加元素时,如何修改堆栈视图的高度约束?
  2. 如何通过界面生成器向 UIStackView 添加子视图?当我这样做时,子视图采用包含堆栈视图的大小。
4

2 回答 2

6

斯威夫特 4.2

如果您想使用代码而不是故事板,我会使用不需要估计内容大小的自动布局创建一个示例。

您只需要添加到堆栈视图或从中删除并自动修改滚动高度。

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        view.addSubview(scrollView)
        scrollView.addSubview(scrollViewContainer)
        scrollViewContainer.addArrangedSubview(redView)
        scrollViewContainer.addArrangedSubview(blueView)
        scrollViewContainer.addArrangedSubview(greenView)

        scrollView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
        scrollView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
        scrollView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
        scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true

        scrollViewContainer.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor).isActive = true
        scrollViewContainer.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor).isActive = true
        scrollViewContainer.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
        scrollViewContainer.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
        // this is important for scrolling
        scrollViewContainer.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true
    }

    let scrollView: UIScrollView = {
        let scrollView = UIScrollView()

        scrollView.translatesAutoresizingMaskIntoConstraints = false
        return scrollView
    }()

    let scrollViewContainer: UIStackView = {
        let view = UIStackView()

        view.axis = .vertical
        view.spacing = 10

        view.translatesAutoresizingMaskIntoConstraints = false
        return view
    }()

    let redView: UIView = {
        let view = UIView()
        view.heightAnchor.constraint(equalToConstant: 500).isActive = true
        view.backgroundColor = .red
        return view
    }()

    let blueView: UIView = {
        let view = UIView()
        view.heightAnchor.constraint(equalToConstant: 200).isActive = true
        view.backgroundColor = .blue
        return view
    }()

    let greenView: UIView = {
        let view = UIView()
        view.heightAnchor.constraint(equalToConstant: 1200).isActive = true
        view.backgroundColor = .green
        return view
    }()
}
于 2019-02-25T06:11:08.020 回答
2

因此,您可能希望将整个布局包含在 stackview 中。只是需要考虑的事情。

  1. 真的没有任何正确的方法来做事。我不会在您的 UIStackView 上设置高度约束(请添加等于视图宽度的宽度约束)。仅在添加到堆栈视图的元素上设置它。你会得到一个错误,但它只是 IB 抱怨,直到你将一个元素添加到你的 UIStackView。

要调整堆栈视图中的元素大小,您必须对它们设置水平约束。然后,您可以在代码中修改该单个水平约束以更改对象的高度。

  1. 要添加子视图,您只需执行以下操作:

    stackView.addArrangedSubview(childVC.view)

或者在界面生成器中,您只需将元素拖到堆栈视图中。确保它具有水平约束,否则它将根据您调整大小。

于 2015-10-30T17:07:04.347 回答