Анимированный заголовок содержимого при прокрутке в Swift

Question

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

Пожалуйста, проверьте изображение ниже и дайте мне знать, как анимировать при прокрутке. Этот анимированный заголовок в Fotmob app.

Answer 1

Прежде всего добавьте представление заголовка как UIvVew и добавьте UIScrollView или UITableView под заголовкомView, таким же, как на скриншоте, и выполните следующий шаг.

1. установить фиксированное ограничение высоты для вида заголовка (например, 125) и прикрепить его сверху, слева и справа.

2. сделайте UIScrollView ниже, чтобы использовать все доступное пространство, поэтому установите нулевые ограничения сверху, снизу, слева и справа.

3. подключите ограничение высоты представления заголовка к ViewController, чтобы получить что-то вроде:

    @IBOutlet var headerViewHeightConstraint: NSLayoutConstraint!
   

4. установить делегат UIScrollView на ViewController

5. объявляет два свойства для ограничения максимальной и минимальной высоты представления заголовка, например, fox:

   let headerViewMaxHeight: CGFloat = 125
   let headerViewMinHeight: CGFloat = 44 + UIApplication.shared.statusBarFrame.height
   

6. Весь обходной путь основан на обновлении ограничения высоты представления заголовка во время прокрутки UIScrollView, поэтому давайте реализуем UIScrollViewDelegate и самый важный делегат для нашего случая, scrollViewDidScroll:

   func scrollViewDidScroll(_ scrollView: UIScrollView) {
   
       let headerViewMinHeight: CGFloat = 44 + UIApplication.shared.statusBarFrame.height
   
       let yPos = mainScrollView.contentOffset.y
       let newHeaderViewHeight: CGFloat = headerViewHeightConstraint.constant - yPos
   
       if newHeaderViewHeight > headerViewMaxHeight {
           // Here, Manage Your Score Format View
           headerViewHeightConstraint.constant = max(headerViewMaxHeight, newHeaderViewHeight)
   
       } else if newHeaderViewHeight < headerViewMinHeight {
   
       headerViewHeightConstraint.constant = headerViewMinHeight
   
       } else {
   
           headerViewHeightConstraint.constant = newHeaderViewHeight
           scrollView.contentOffset.y = 0 // block scroll view
   
       }
   }