Custom Collection View Layout
Collection views aren’t shackled to a single layout in the same way table views are; in-fact Apple has given you, the developer, complete control over how the cells and supplementary views contained within the collection view are laid out. In this series you’ll learn everything you need to know about developing custom layouts for collection views. Starting with the basics such as creating and caching layout attributes, and moving right through to advanced topics like creating interactive layouts and manipulating scroll behaviour. You’ll build 5 complete layouts across the 13 videos, 4 of which are influenced by the following popular iOS apps: Pinterest, DIY – Skills For Kids, Ultravisual, and Timbre. If you’re not familiar with UICollectionView then our introductory Collection Views Series should definitely be considered a prerequisite to this one. By Mic Pringle.
Find out what's covered in our Custom Collection View Layout video tutorial series.
Learn how to implement the basic Pinterest layout.
Learn how to leverage custom layout attributes to simplify the implementation of a Pinterest-like custom collection view layout.
Learn how to size your cells so that the image width matches the column width while the height is then adjusted to maintain the aspect ratio of the photo.
Learn how to implement a stretchy header similar to that of the DIY Skills for Kids app.
Learn how to add the appearance of depth to your header as the user scrolls - a really nice look that's easy to implement!
Learn how to implement a maximum stretch limit for images in your stretchy header to have a more polished look when the user scrolls.
Learn how to create a new type of layout, sticky headers, by following three rules.
Learn the how to create a layout like Ultravisual so that as the user scrolls, the next standard size cell morphs to become the large featured cell.
Learn how to reveal more of the photo as the cell transitions from standard to featured cell and change the opacity so the featured cell appears vibrant.
Learn how to implement a cool effect so that as the user scrolls the next cell snaps into place as it becomes the featured cell.
Learn how to rotate the cells and inset the frames slightly so they stay within the bounds of the collection view for a layout like that seen in Timbre.
Learn how to use a container view and view clipping to extend the bounds of the image view so that the image fills the entire cell leaving no white space.
Learn how to add the final touches to your Timbre layout by creating a really cool parallax effect