Динамический контент в uiscrollview с автопрокладкой не работает должным образом

Question

Я пытаюсь добавить динамический контент к просмотру прокрутки, как показано ниже

 for i in 0 ..< 4 {
            let gameView = Card.instantiate()
            gameView.frame.origin.y  =  gameView.frame.size.height * CGFloat(i)
            contentView.addSubview(gameView)
            gameView.centerXAnchor.constraint(equalTo: contentView.centerXAnchor).isActive = true
            let widthConstraint = NSLayoutConstraint(item: gameView, attribute: .width, relatedBy: .equal,toItem: contentView, attribute: .width, multiplier: 0.8,constant : 0.0)

         contentView.addConstraint(widthConstraint)

         let heightConstraint = NSLayoutConstraint(item: gameView, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .height, multiplier: 1.0, constant: 100)

         gameView.addConstraint(heightConstraint)


         contentView.frame.size.height = contentView.frame.size.height + gameView.frame.size.height

         scrollView.contentSize.height = scrollView.contentSize.height + gameView.frame.size.height
        }

Cardview определяется XIB с autolayout

И просматривать структуру в IBкак показано ниже SuperView> ScrollView> ContentView> DynamicViews

ContentView Также содержит некоторое статическое содержимое, такое как кнопки и метки. Динамическое представление находится ниже статического содержимого

А экран вывода выглядит как показано ниже, но он не выровнен должным образом

Это правильный подход для добавления динамических представлений в представление прокрутки?

Answer 1

Это идеальный случай для UIStackView

Представление стека будет обрабатывать вертикальное позиционирование и ширину экземпляров gameView s (при условии, что загрузка xib настроена правильно).

Ограничивая верхнюю, начальную, конечную, нижнюю и ширину представления стека для scrollView, он также определит «прокручиваемую область» (.contentSize).

Все выполнено с автоматическим макетом:

    let sv = UIStackView()
    sv.axis = .vertical
    sv.alignment = .fill
    sv.distribution = .fill
    sv.spacing = 0  // change to add vertical spacing if desired
    sv.translatesAutoresizingMaskIntoConstraints = false
    scrollView.addSubview(sv)
    NSLayoutConstraint.activate([
        sv.topAnchor.constraint(equalTo: scrollView.topAnchor),
        sv.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor),
        sv.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor),
        sv.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor),
        sv.widthAnchor.constraint(equalTo: scrollView.widthAnchor, multiplier: 1.0),
        ])
    for _ in 0 ..< 4 {
        let gameView = Card.instantiate()
        gameView.translatesAutoresizingMaskIntoConstraints = false
        gameView.heightAnchor.constraint(equalToConstant: 100.0).isActive = true
        sv.addArrangedSubview(gameView)
    }