Hoe veranderen de hoogte en breedte van gebruikersinterface-elementen bij scrollen op iOS?

Bij standaardimplementatie blijven de hoogte en breedte van UIView-elementen ongewijzigd tijdens het scrollen binnen UIScrollView of zijn afgeleiden (UITableView, UICollectionView).

De positie van de elementen (de waarde van de eigenschap frame.origin) verandert ten opzichte van de bounds van de scroll view. De eigenschap bounds van de scroll view verschuift bij het scrollen, maar de grootte (bounds.size) blijft constant (gelijk aan de grootte van frame.size).

De grootte van de inhoud die gescrold kan worden, wordt bepaald door de eigenschap contentSize van de scroll view. Elementen binnen contentSize zijn zichtbaar tijdens het scrollen.

Het wijzigen van de grootte van elementen tijdens het scrollen (parallax- of compressie/uitbreidingseffect) gebeurt niet automatisch en vereist aanvullende logica:

1. Implementatie in UIScrollViewDelegate: Het volgen van de verandering in contentOffset in de methode scrollViewDidScroll(_:) en handmatig aanpassen van frame of bounds van het betreffende element.

   // Voorbeeld van het wijzigen van de hoogte van een element tijdens het scrollen
   func scrollViewDidScroll(_ scrollView: UIScrollView) {
       let yOffset = scrollView.contentOffset.y
       let initialHeight: CGFloat = 200
       let maxHeight: CGFloat = 300
   
       // Voorbeeld van samentrekking bij naar beneden scrollen, uitbreiding bij naar boven scrollen
       let newHeight = max(0, min(maxHeight, initialHeight - yOffset))
       
       someView.frame.size.height = newHeight
       // Afhandeling van de positie als de anker niet bovenaan is
   }
   

2. Gebruik van UIVisualEffectView: Voor vervagingseffecten of vibratie, die kunnen veranderen tijdens het scrollen afhankelijk van de inhoud eronder.

3. Aangepaste lay-outs: In UICollectionView kan een aangepaste UICollectionViewLayout worden gemaakt om transformaties van cellen tijdens het scrollen te beheren.

4. Animaties: Gebruik van UIViewPropertyAnimator of andere animatiemechanismen die worden gestart bij het scroll-evenement.

Dus, het basisgedrag is een constante grootte. Elke wijziging in grootte is het resultaat van een specifieke implementatie.