Giter VIP home page Giter VIP logo

collection-view-layouts's Introduction

Build Status codecov

About

Collection View Layouts is a set of custom flow layouts for iOS which imitate general data grid approaches for mobile apps.

Flow types

Tags Pinterest 500px Instagram
Flipboard Facebook Flickr

Overview

  • 7 popular flow-layouts for iOS collection view
  • Tags and Flipboard layouts support left and right content align
  • 500px has custom cells layout configuration
  • Three modes for instagram layout (default grid mode, one preview cell, regular preview cell)
  • Each layout can be configured with content and cells paddings separately
  • Tests coverage more than 90%

Installation

CocoaPods

Collection View Layouts is available through CocoaPods. To install it, simply add the following lines (depends on your needs) to your Podfile:

pod 'collection-view-layouts/Core'
pod 'collection-view-layouts/TagsLayout'
pod 'collection-view-layouts/PinterestLayout'
pod 'collection-view-layouts/Px500Layout'
pod 'collection-view-layouts/InstagramLayout'
pod 'collection-view-layouts/FlipboardLayout'
pod 'collection-view-layouts/FacebookLayout'
pod 'collection-view-layouts/FlickrLayout'

Requirements

iOS: 9.0+
Swift: 4.1
CocoaPods: for iOS

Example

To run the example project, clone the repo, and run pod install from the Example directory first.

Usage

Configuration of custom flow layouts is pretty easy:

var contentFlowLayout: ContentDynamicLayout = TagsStyleFlowLayout()

contentFlowLayout?.delegate = self
contentFlowLayout?.contentPadding = ItemsPadding(horizontal: 10, vertical: 10)
contentFlowLayout?.cellsPadding = ItemsPadding(horizontal: 8, vertical: 8)
contentFlowLayout?.contentAlign = .left

collectionView.collectionViewLayout = contentFlowLayout!
collectionView.reloadData()

Also, you have to implement ContentDynamicLayoutDelegate protocol:

public protocol ContentDynamicLayoutDelegate: class {
    func cellSize(indexPath: IndexPath) -> CGSize
}

func cellSize(indexPath: IndexPath) -> CGSize {
    return cellsSizes[indexPath.row]
}

Author

Sergey Afanasiev

Getting Help

[email protected]

License

Collection View Layouts is licensed under the Apache 2.0 license


RubyGarage Logo

RubyGarage is a leading software development and consulting company in Eastern Europe. Our main expertise includes Ruby and Ruby on Rails, but we successfuly employ other technologies to deliver the best results to our clients. Check out our portoflio for even more exciting works!

collection-view-layouts's People

Contributors

jowkame avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.