我要把 UIStackView 放在 UIScrollView 中。更简单地说,我要做一张思维导图。我放入UIScrollView中的UIStackView是思维导图的一个对象。因此,嵌入的 UIStackView 将出现在 UIScrollView 的所有区域中。
但是,虽然我已经为UIScrollView指定了UIStackView的位置,但是UIStackView并没有出现在UIScrollView中。
我的界面构建器(附加界面构建器图像以了解我的 View 层次结构。):
import UIKit
class ViewController: UIViewController {
@IBOutlet weak var scrollView: UIScrollView!
@IBOutlet weak var createObject: UIBarButtonItem!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
let redView = UIView()
redView.backgroundColor = .red
let blueView = UIView()
blueView.backgroundColor = .blue
let stackView = UIStackView(arrangedSubviews: [redView, blueView])
stackView.axis = .vertical
stackView.distribution = .fillEqually
stackView.center = scrollView.center
scrollView.addSubview(stackView)
}
}
最佳答案
UIView
和 UIStackView
都没有固有大小。
因此,您最终会向 ScrollView 添加一个大小为 0, 0
的堆栈 View ,其中包含两个 View ,每个 View 的大小均为 0, 0
。
您需要在某处应用一些尺寸。
这将为您提供一个堆栈 View ,其宽度与 ScrollView 相同,高度是 ScrollView 的两倍(因此您有一个“全高”蓝色 View 和一个“全高”红色 View ):
class ViewController: UIViewController {
@IBOutlet weak var scrollView: UIScrollView!
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
let redView = UIView()
redView.backgroundColor = .red
let blueView = UIView()
blueView.backgroundColor = .blue
let stackView = UIStackView(arrangedSubviews: [redView, blueView])
stackView.axis = .vertical
stackView.distribution = .fillEqually
scrollView.addSubview(stackView)
stackView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
stackView.topAnchor.constraint(equalTo: scrollView.topAnchor, constant: 0.0),
stackView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor, constant: 0.0),
stackView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor, constant: 0.0),
stackView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor, constant: 0.0),
stackView.widthAnchor.constraint(equalTo: scrollView.widthAnchor, constant: 0.0),
stackView.heightAnchor.constraint(equalTo: scrollView.heightAnchor, multiplier: 2.0),
])
}
}
编辑:
这是另一个例子。它添加了 6 个具有指定宽度和高度的 subview 。堆栈 View 属性更改为:
.alignment = .center
.distribution = .fill
.spacing = 8
结果:
向下滚动:
和代码:
class ViewController: UIViewController {
@IBOutlet weak var scrollView: UIScrollView!
override func viewDidLoad() {
super.viewDidLoad()
let colors: [UIColor] = [
.red,
.blue,
.green,
.orange,
.yellow,
.cyan,
]
let sizes: [CGSize] = [
CGSize(width: 100, height: 150),
CGSize(width: 250, height: 100),
CGSize(width: 200, height: 120),
CGSize(width: 160, height: 200),
CGSize(width: 220, height: 180),
CGSize(width: 60, height: 80),
]
let stackView = UIStackView()
stackView.axis = .vertical
stackView.distribution = .fill
stackView.alignment = .center
stackView.spacing = 8
for (color, size) in zip(colors, sizes) {
let v = UIView()
v.translatesAutoresizingMaskIntoConstraints = false
v.widthAnchor.constraint(equalToConstant: size.width).isActive = true
v.heightAnchor.constraint(equalToConstant: size.height).isActive = true
v.backgroundColor = color
stackView.addArrangedSubview(v)
}
scrollView.addSubview(stackView)
stackView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
stackView.topAnchor.constraint(equalTo: scrollView.topAnchor, constant: 0.0),
stackView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor, constant: 0.0),
stackView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor, constant: 0.0),
stackView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor, constant: 0.0),
stackView.widthAnchor.constraint(equalTo: scrollView.widthAnchor, constant: 0.0),
// do NOT set a heightAnchor ... let the subviews define the height
// stackView.heightAnchor.constraint(equalTo: scrollView.heightAnchor, multiplier: 2.0),
])
}
}
关于ios - 为什么在 UIScrollView 中看不到 UIStackView?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55541905/