UIScrollView не отображается в представлении

Question

Я реализую UIScrollView в CollectionViewCell.У меня есть пользовательский вид, который должен отображаться в виде прокрутки, поэтому я выполняю следующую программу в CollectionViewCell.Я создал все программным способом, и ниже приведен мой код:

struct ShotsCollections {
    let title: String?
}

class ShotsMainView: UICollectionViewCell {

    override init(frame: CGRect) {
        super.init(frame: frame)

        setupViews()

        containerScrollView.contentSize.width = frame.width * CGFloat(shotsData.count)

        shotsData = [ShotsCollections.init(title: "squad"), ShotsCollections.init(title: "genral")]
        var i = 0
        for data in shotsData {

            let customview = ShotsMediaView(frame: CGRect(x: containerScrollView.frame.width * CGFloat(i), y: 0, width: containerScrollView.frame.width, height: containerScrollView.frame.height))

            containerScrollView.addSubview(customview)
            i += 1
        }

    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    var shotsData = [ShotsCollections]()

    var containerScrollView: UIScrollView = {
        let instance = UIScrollView()
        instance.isScrollEnabled = true
        instance.bounces = true
        instance.backgroundColor = blueColor
        return instance
    }()


    private func setupViews() { //These are constraints by using TinyConstraints
        addSubview(containerScrollView)
        containerScrollView.topToSuperview()
        containerScrollView.bottomToSuperview()
        containerScrollView.rightToSuperview()
        containerScrollView.leftToSuperview()
    }
}

Теперь проблема заключается в том, что при отображении прокрутки его содержимое не отображается.При печати contentSize и frame просмотра прокрутки отображается 0. Но если я проверю иерархию представления отладки, представление прокрутки содержит 2 представления с конкретными кадрами.

Я не уверен, что происходит неправильно.Любая помощь приветствуется.

Answer 1

Я создал пример приложения для вашего случая использования.Я вставляю код и полученный снимок экрана ниже.Надеюсь, что это та функциональность, которую вы ищете.Я предлагаю вам вставить это в новый проект и изменять код, пока вы не будете удовлетворены.Я добавил комментарии, чтобы прояснить ситуацию.

ViewController

import UIKit

class ViewController: UIViewController {

    // Initialize dummy data array with numbers 0 to 9
    var data: [Int] = Array(0..<10)

    override func loadView() {
        super.loadView()
        // Add collection view programmatically
        let collectionView = UICollectionView(frame: .zero, collectionViewLayout: UICollectionViewFlowLayout())
        collectionView.translatesAutoresizingMaskIntoConstraints = false
        collectionView.register(ShotsMainView.self, forCellWithReuseIdentifier: ShotsMainView.identifier)
        self.view.addSubview(collectionView)
        NSLayoutConstraint.activate([
            self.view.topAnchor.constraint(equalTo: collectionView.topAnchor),
            self.view.bottomAnchor.constraint(equalTo: collectionView.bottomAnchor),
            self.view.leadingAnchor.constraint(equalTo: collectionView.leadingAnchor),
            self.view.trailingAnchor.constraint(equalTo: collectionView.trailingAnchor),
        ])
        collectionView.delegate = self
        collectionView.dataSource = self
        collectionView.translatesAutoresizingMaskIntoConstraints = false
        collectionView.backgroundColor = UIColor.white
        self.view.addSubview(collectionView)
    }

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        self.view.backgroundColor = UIColor.white
    }
 }   

extension ViewController: UICollectionViewDelegate, UICollectionViewDataSource {
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 10
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: ShotsMainView.identifier, for: indexPath) as! ShotsMainView
        return cell
    }
}

extension ViewController: UICollectionViewDelegateFlowLayout {

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        // The cell dimensions are set from here
        return CGSize(width: collectionView.frame.size.width, height: 100.0)
    }
}

ShotsMainView Это ячейка представления коллекции

import UIKit

class ShotsMainView: UICollectionViewCell {

    static var identifier = "Cell"
    weak var textLabel: UILabel!

    override init(frame: CGRect) {
        // Initialize with zero frame
        super.init(frame: frame)
        // Add the scrollview and the corresponding constraints
        let containerScrollView = UIScrollView(frame: .zero)
        containerScrollView.isScrollEnabled = true
        containerScrollView.bounces = true
        containerScrollView.backgroundColor = UIColor.blue
        containerScrollView.translatesAutoresizingMaskIntoConstraints = false
        self.addSubview(containerScrollView)
        NSLayoutConstraint.activate([
            self.topAnchor.constraint(equalTo: containerScrollView.topAnchor),
            self.bottomAnchor.constraint(equalTo: containerScrollView.bottomAnchor),
            self.leadingAnchor.constraint(equalTo: containerScrollView.leadingAnchor),
            self.trailingAnchor.constraint(equalTo: containerScrollView.trailingAnchor)
        ])

        // Add the stack view that will hold the individual items that
        // in each row that need to be scrolled horrizontally
        let stackView = UIStackView(frame: .zero)
        stackView.distribution = .fill
        stackView.translatesAutoresizingMaskIntoConstraints = false
        stackView.axis = .horizontal
        containerScrollView.addSubview(stackView)
        stackView.backgroundColor = UIColor.magenta

        NSLayoutConstraint.activate([
            containerScrollView.leadingAnchor.constraint(equalTo: stackView.leadingAnchor),
            containerScrollView.trailingAnchor.constraint(equalTo: stackView.trailingAnchor),
            containerScrollView.topAnchor.constraint(equalTo: stackView.topAnchor),
            containerScrollView.bottomAnchor.constraint(equalTo: stackView.bottomAnchor)
        ])

        // Add individual items (Labels in this case).
        for i in 0..<10 {
            let label = UILabel(frame: .zero)
            label.translatesAutoresizingMaskIntoConstraints = false
            stackView.addArrangedSubview(label)
            label.text = "\(i)"
            label.font = UIFont(name: "System", size: 20.0)
            label.textColor = UIColor.white
            label.backgroundColor = UIColor.purple
            label.layer.masksToBounds = false
            label.layer.borderColor = UIColor.white.cgColor
            label.layer.borderWidth = 1.0
            label.textAlignment = .center


            NSLayoutConstraint.activate([
                label.heightAnchor.constraint(equalTo: self.heightAnchor, multiplier: 1.0, constant: 0.0),
                label.widthAnchor.constraint(equalTo: self.widthAnchor, multiplier: 0.2, constant: 0.0)
            ])
        }
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

Снимок экрана

Answer 2

Когда вы добавляете customView в ваш containerScrollView, вы не устанавливаете ограничения между customView и containerScrollView.

Добавьте эти ограничения, и вы сможете увидеть свои customView с учетом того, что ваш customView имеет некоторую высоту.Кроме того, когда вы добавляете больше видов, вам нужно будет удалить нижнее ограничение последнего добавленного вида и создать нижнее ограничение для containerScrollView с последним добавленным видом.