Latest 0.3.0
Homepage https://github.com/yesjun/CollectionViewWaterfallLayout
License MIT
Platforms ios 8.0, requires ARC

CollectionViewWaterfallLayout

Pinterest inspired layout for UICollectionViews with Sticky Header

Note: Updated for Swift 2.3 and cocoapods

CollectionViewWaterfallLayout is a subclass of UICollectionViewLayout written completely in Swift. This class is based off CHTCollectionViewWaterfallLayout which was written by chiahsien in Objective C. This class tries to use as many new Swifty things to keep the code updated with current design patterns.

The original layout was inspired by Pinterest.

Features

  • Easy to use – If you are used to working with UICollectionViewFlowLayout, this should feel natural
  • Highly Customizable
  • Outstanding Performance
  • Supports headers and footers
  • With Sticky Header

Screen Shots

Real World Example
Demo Example Top
Demo Example Bottom

Prerequisites

  • ARC
  • iOS 7+
  • Xcode 7+
  • Swift 2.3

Installation

CollectionViewWaterfallLayout is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "CollectionViewWaterfallLayoutSH"

How to Use

Check out the demo project for an example using storyboards to set up the views, and that programmatically creates and customizes the waterfall layout.

Customizable Properties

Below are the public properties and their default values that you can change to customize the layout

var columnCount:Int = 2
var minimumColumnSpacing:Float = 10.0
var minimumInteritemSpacing:Float = 10.0
var headerHeight:Float = 0.0
var footerHeight:Float = 0.0
var headerInset:UIEdgeInsets = UIEdgeInsetsZero
var footerInset:UIEdgeInsets = UIEdgeInsetsZero
var sectionInset:UIEdgeInsets = UIEdgeInsetsZero

Required Protocol

Your collection view’s delegate must conforms to CollectionViewWaterfallLayoutDelegate protocol and implement the required method, all you need to do is return the original size of the item:

func collectionView(collectionView: UICollectionView, layout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize

Limitation

  • Only vertical scrolling is supported.
  • No decoration view.

License

CollectionViewWaterfallLayout is available under the MIT license. See the LICENSE file for more info.

Latest podspec

{
    "name": "CollectionViewWaterfallLayoutSH",
    "version": "0.3.0",
    "summary": "Pinterest inspired layout for UICollectionViews written in Swift with Sticky Header",
    "homepage": "https://github.com/yesjun/CollectionViewWaterfallLayout",
    "screenshots": [
        "https://raw.githubusercontent.com/yesjun/CollectionViewWaterfallLayout/master/Screenshots/RealWorldExample.png",
        "https://raw.githubusercontent.com/yesjun/CollectionViewWaterfallLayout/master/Screenshots/DemoExample.png",
        "https://raw.githubusercontent.com/yesjun/CollectionViewWaterfallLayout/master/Screenshots/DemoExampleSticky.png"
    ],
    "license": "MIT",
    "authors": "Jun",
    "social_media_url": "https://yesjun.wordpress.com/",
    "platforms": {
        "ios": "8.0"
    },
    "source": {
        "git": "https://github.com/yesjun/CollectionViewWaterfallLayout.git",
        "tag": "v0.3.0"
    },
    "source_files": "CollectionViewWaterfallLayout.swift",
    "requires_arc": true
}

Pin It on Pinterest

Share This