UICollectionViewCell - анимировать изменение высоты ячейки при изменении ее содержимого - PullRequest
Новая
       71

UICollectionViewCell - анимировать изменение высоты ячейки при изменении ее содержимого

2 голосов
/ 17 июня 2020

У меня действительно простой UICollectionView, использующий iOS 13 UICollectionViewCompositionalLayout. Ячейки имеют вертикальную отметку UIStackView, и когда вы нажимаете кнопку «Переключить детали», я просто меняю значение isHidden для detailsView. Когда ячейки затем сообщают контроллеру представления, что ему необходимо выполнить collectionView.collectionViewLayout.invalidateLayout(), все в основном работает: представление сведений включается и выключается. Но он не оживляет это, поэтому выглядит немного раздражающе.

enter image description here enter image description here

class ViewController: UIViewController {
  @IBOutlet private var collectionView: UICollectionView!

  override func viewDidLoad() {
    super.viewDidLoad()
    collectionView.collectionViewLayout = createLayout()
  }

  private func createLayout() -> UICollectionViewLayout {
    let itemSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .estimated(200))
    let item = NSCollectionLayoutItem(layoutSize: itemSize)

    let groupSize = NSCollectionLayoutSize(widthDimension: .fractionalWidth(1), heightDimension: .estimated(200))
    let group = NSCollectionLayoutGroup.horizontal(layoutSize: groupSize, subitems: [item])

    let section = NSCollectionLayoutSection(group: group)
    section.contentInsets = .init(top: 16, leading: 16, bottom: 16, trailing: 16)
    section.interGroupSpacing = 16

    let layout = UICollectionViewCompositionalLayout(section: section)
    return layout
  }
}

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

  func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath) as! Cell
    cell.resize = { [weak self] in
      UIView.animate(withDuration: 2) {
        self?.collectionView.collectionViewLayout.invalidateLayout()
      }
    }
    return cell
  }
}

class Cell: UICollectionViewCell {
  @IBOutlet private var detailsView: UIView!

  var resize: (() -> Void)?

  override func awakeFromNib() {
    super.awakeFromNib()
    contentView.layer.cornerRadius = 10
  }

  @IBAction private func toggleDetails() {
    detailsView.isHidden.toggle()
    resize?()
  }
}

Repro project : https://github.com/kevinrenskers/CellHeight.

Как я могу анимировать переключение этого вида деталей, чтобы анимировалось изменение высоты? И можно ли это использовать в сочетании с UIStackView и отображать / скрывать его дочерние представления? Обратите внимание, что в реальном приложении у представления сведений нет фиксированной высоты, поэтому я не могу просто переключать высоту ячейки между двумя фиксированными значениями.

1 Ответ

0 голосов
/ 19 июня 2020

С анимированным представлением коллекции, я объединил ваше репо и вношу некоторые изменения.

https://github.com/lebaotrung93/CellHeight

Работает. Но с UIStackView, кажется, трудно управлять его размером в CollectionView из-за его собственного поведения.

...