CODEWITHSUNDEEP
swiftuicollectionviewuicollectionviewcell
Markon
Markon

Reputation: 841

How Apple Photos collectionview pinch zoom works?

If you go to Apple Photos and do pinch zoom you can zoom in/out to change the number of columns in the grid. I assume it uses UICollectionView, however, I have no idea how it obtains this animation.

It's not difficult to change the number of columns in UICollectionView programmatically, I don't quite get the animation.

Any ideas?

Upvotes: 3

Views: 1774

Answers (1)

Caleb
Caleb

Reputation: 125007

It looks like the gesture triggers a new layout. There's a whole class dedicated to switching between layouts gracefully: UICollectionViewTransitionLayout. The docs say in part:

You can use UICollectionViewTransitionLayout as-is or subclass it to provide specialized behavior for your app. A common use for transition layouts is to create interactive transitions, such as those that are driven by gesture recognizers or touch events.

Unlike a regular time-based animation, the transition between layouts is driven by a transitionProgress property that you update, so the transition can easily track a gesture. You can see exactly that kind of thing happening in Photos: if you alternate between pinching and zooming, the transition tracks that by going back and forth.

It's possible, perhaps likely, that Photos uses a subclass of UICollectionViewTransitionLayout in order to provide a more polished user experience, but if you're looking to emulate what Photos does, I think this class is the right way to start.

Upvotes: 4

Related Questions