Не удается получить пользовательскую ячейку в CollectionView для правильной работы

Question

Я создал пользовательскую ячейку для CollectionView, однако у меня возникли проблемы с отображением ячейки так, как я хочу.Вот код для пользовательской ячейки:

import Foundation
import UIKit

class CardCell: UICollectionViewCell {
    override init(frame: CGRect) {
        super.init(frame: frame)
        setupCell()
        setupViewsInCell()
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        setupCell()
        setupViewsInCell()
    }

    var postTitle: UILabel = {
        let label = UILabel()
        label.text = "POST TITLE"
        label.font = UIFont.boldSystemFont(ofSize: 14)
        label.textColor = UIColor.appColors.mainBlack
        label.translatesAutoresizingMaskIntoConstraints = false

        return label
    }()

    //postImage need to be the image the user uploaded.
    var postImage: UIImageView = {
        let image = UIImageView(image: UIImage(named: "placeholder-image"))
        image.contentMode = .scaleAspectFit
        image.clipsToBounds = true
        image.translatesAutoresizingMaskIntoConstraints = false

        return image
    }()

    var likeImage: UIImageView = {
        let image = UIImageView(image: UIImage(named: "like"))
        image.contentMode = .scaleAspectFit
        image.clipsToBounds = true
        image.translatesAutoresizingMaskIntoConstraints = false

        return image
    }()

    var numberOfLikes: UILabel = {
        let label = UILabel()
        label.text = "20"
        label.font = UIFont.systemFont(ofSize: 8)
        label.textColor = UIColor.appColors.mainBlack
        label.translatesAutoresizingMaskIntoConstraints = false

        return label
    }()

    var dislikeImage: UIImageView = {
        let image = UIImageView(image: UIImage(named: "dislike"))
        image.contentMode = .scaleAspectFit
        image.clipsToBounds = true
        image.translatesAutoresizingMaskIntoConstraints = false

        return image
    }()

    var numberOfDislikes: UILabel = {
        let label = UILabel()
        label.text = "34"
        label.font = UIFont.systemFont(ofSize: 8)
        label.textColor = UIColor.appColors.mainBlack
        label.translatesAutoresizingMaskIntoConstraints = false

        return label
    }()

    func setupCell(){
        backgroundColor = UIColor.appColors.mainWhite
        layer.cornerRadius = 10
        clipsToBounds = true
        layer.shadowColor = UIColor(white: 0, alpha: 0.25).cgColor
        layer.shadowOffset = CGSize.zero
        layer.shadowOpacity = 1
        layer.shadowRadius = 2
        layer.masksToBounds = false
    }

    func setupViewsInCell(){

        let stackView = UIStackView(arrangedSubviews: [likeImage, numberOfLikes, dislikeImage, numberOfDislikes])
        stackView.axis = .horizontal
        stackView.distribution = .fillEqually
        stackView.translatesAutoresizingMaskIntoConstraints = false

        self.addSubview(postTitle)
        self.addSubview(postImage)
        self.addSubview(stackView)

        NSLayoutConstraint.activate([
            postTitle.topAnchor.constraint(equalTo: self.topAnchor, constant: 0),
            postTitle.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 8),
            postImage.topAnchor.constraint(equalTo: postTitle.bottomAnchor, constant: 10),
            postImage.leftAnchor.constraint(equalTo: self.leftAnchor),
            postImage.rightAnchor.constraint(equalTo: self.rightAnchor),
            postImage.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 30),
            stackView.topAnchor.constraint(equalTo: postImage.bottomAnchor, constant: 50),
            stackView.bottomAnchor.constraint(equalTo: self.bottomAnchor, constant: 0),
            stackView.leftAnchor.constraint(equalTo: self.leftAnchor, constant: 8),
            stackView.heightAnchor.constraint(equalToConstant: 40),
            stackView.widthAnchor.constraint(equalToConstant: self.frame.width / 2),
        ])
    }
}

Несколько проблем, с которыми я столкнулся и не могу найти решение, таковы:

1. Заголовок даже не отображаетсяЯ несколько раз пытался изменить константу, но все равно ничего.
2. ограничивает проблему, я установил для stackView topAnchor значение postImage bottomAnchor, но он все равно не будет работать.Это скриншот с симулятора.
3. , как вы можете видеть на скриншоте ниже, сборник почему-то отклонен в сторону.Я предполагаю, что это проблема collectionView, а не проблема ячейки, но я не мог найти решение и для этого.

Answer 1

1. Измените эту константу на отрицательную postImage.topAnchor.constraint(equalTo: postTitle.bottomAnchor, constant: 10), когда вы используете bottomAnchor или rightAnchor константа должна быть отрицательной.Если вы хотите понять больше, см. Нижние и правые ограничения зрения отрицательны?

2. Та же проблема с константой ограничения stackView.topAnchor.constraint(equalTo: postImage.bottomAnchor, constant: 50), попробуйте изменить на-50

3. Если вы хотите создать коллекционное представление с динамической высотой ячейки, вам необходимо рассчитать размер ячейки.Вы можете сделать это, создав свой собственный макет представления, см. https://www.raywenderlich.com/392-uicollectionview-custom-layout-tutorial-pinterest, это хороший учебник по созданию пользовательского UICollectionViewLayout, или вы можете вычислить размер ячейки внутри метода func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize, используя systemLayoutSizeFitting,если все ограничения установлены правильно, этот метод будет возвращать размер ячейки, но вы должны помнить, что эта функция будет вызываться каждый раз, когда ячейка появляется, решение этой проблемы - сохранить высоту и проверить, использовался ли уже контентрассчитать высоту клетки.Если вам нужно изменить высоту ячейки в другое время, вам также необходимо обновить сохраненное значение или удалить его, чтобы снова вычислить размер.

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let frame = CGRect(x: 0, y: 0, width: view.frame.width, height: 50)
        let dummyCell = Cell(frame: frame)
        let targetSize = CGSize(width: view.frame.width, height: 1000)
        let dummyData = data[indexPath.row]
        dummyCell.data = dummyData
        dummyCell.layoutIfNeeded()
        let height = max(MINIMUM_CELL_SIZE, 
         dummyCell.systemLayoutSizeFitting(targetSize).height)
        return CGSize(width: view.frame.width, height: height)
    }