Home

Awesome

<p align="center"> <img src="https://cdn.rawgit.com/yacir/CollectionViewSlantedLayout/3b5e08c1/Resources/SlantedLayout.svg" alt="CollectionViewSlantedLayout" title="CollectionViewSlantedLayout" width="700"/> </p> <p align="center"> <img src="https://img.shields.io/badge/Swift-5.1-orange.svg" alt="Swift 5.1"/> <a href="https://cocoapods.org/pods/CollectionViewSlantedLayout"> <img src="https://img.shields.io/cocoapods/v/CollectionViewSlantedLayout.svg?style=flat)"/> </a> <img src="https://img.shields.io/badge/SPM-✔-blue.svg" alt="SMP ready"/> <img src="https://img.shields.io/badge/Carthage-✔-blue.svg" alt="Carthage compatible"/> <img src="https://img.shields.io/cocoapods/p/YBSlantedCollectionViewLayout.svg?style=flat"/> <img src="https://img.shields.io/cocoapods/l/YBSlantedCollectionViewLayout.svg?style=flat"/> <br/> <a href="https://travis-ci.org/yacir/CollectionViewSlantedLayout"> <img src="https://travis-ci.org/yacir/CollectionViewSlantedLayout.svg?branch=master"/> </a> <a href="https://travis-ci.org/yacir/CollectionViewSlantedLayout"> <img src="https://codecov.io/gh/yacir/CollectionViewSlantedLayout/branch/master/graph/badge.svg"/> </a> <a href="https://www.codacy.com/app/yacir/CollectionViewSlantedLayout?utm_source=github.com&amp;utm_medium=referral&amp;utm_content=yacir/CollectionViewSlantedLayout&amp;utm_campaign=Badge_Grade"> <img alt="codacy badge" src="https://api.codacy.com/project/badge/Grade/e5ae5581b13245199eb7c39cf178adea" /> </a> </p>

CollectionViewSlantedLayout is a subclass of the UICollectionViewLayout allowing the display of slanted cells in a UICollectionView.

<p align="center"> <img src="https://user-images.githubusercontent.com/2587473/34458447-9f434c8a-edd3-11e7-98b7-f32b4284268d.gif" alt="CollectionViewSlantedLayout" title="CollectionViewSlantedLayout"> </p>

Features

Installation

CocoaPods

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

use_frameworks!
pod 'CollectionViewSlantedLayout', '~> 3.1'

Carthage

You can also install it via Carthage. To do so, add the following to your Cartfile:

github 'yacir/CollectionViewSlantedLayout'

Usage

  1. Import CollectionViewSlantedLayout module to your controller

    import CollectionViewSlantedLayout
    
  2. Create an instance and add it to your UICollectionView.

    let slantedSayout = CollectionViewSlantedLayout()
    UICollectionView(frame: .zero, collectionViewLayout: slantedSayout)
    
  3. Use the CollectionViewSlantedCell class for your cells or subclass it.

Find a demo in the Examples folder.

Properties

Protocols

The CollectionViewDelegateSlantedLayout protocol defines methods that let you coordinate with a CollectionViewSlantedLayout object to implement a slanted layout. The CollectionViewDelegateSlantedLayout protocol has the following methods:

optional func collectionView(_ collectionView: UICollectionView,
                             layout collectionViewLayout: CollectionViewSlantedLayout,
                             sizeForItemAt indexPath: IndexPath) -> CGFloat

This method asks the delegate for the size of the specified item’s cell.

If you do not implement this method, the slanted layout uses the values in its itemSize property to set the size of items instead. Your implementation of this method can return a fixed set of sizes or dynamically adjust the sizes based on the cell’s content.

Author

Yassir Barchi

Acknowledgement

This framework is inspired by this prototype released by Matt Bridges.

License

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