OGeek|极客世界-中国程序员成长平台

标题: ios - UIScrollView 内的动态 UIStackView [打印本页]

作者: 菜鸟教程小白    时间: 2022-12-12 09:30
标题: ios - UIScrollView 内的动态 UIStackView

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

enter image description here

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

此元素后跟 map 和其他 View 。

这就是我计划的组织方式: enter image description here

问题

  1. 这是正确的做法吗?当我以编程方式删除和添加元素时,如何修改堆栈 View 的高度约束?
  2. 如何通过interface builder给UIStackView添加 subview ?当我这样做时, subview 采用包含堆栈 View 的大小。



Best Answer-推荐答案


swift 4.2

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

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

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
    }()
}

关于ios - UIScrollView 内的动态 UIStackView,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33333943/






欢迎光临 OGeek|极客世界-中国程序员成长平台 (http://ogeek.cn/) Powered by Discuz! X3.4