header

Twitter PodPlatform PodVersion Documentation

Carthage Codebeat Swift


About

This project is maintained by Ramotion, Inc.
We specialize in the designing and coding of custom UI for Mobile Apps and Websites.

Looking for developers for your project?

animation

The iPhone mockup available here.

Requirements

  • iOS 8.0+
  • Xcode 8
  • Swift 3


Installation

You can install GlidingCollection in several ways:

  • Add source files to your project.


  • Use CocoaPods: ruby pod 'GlidingCollection'


  • Use Carthage: github "Ramotion/gliding-collection"


How to use

• Create some view controller class:

import GlidingCollection

class ViewController: UIViewController {
  let items = ["shirts", "pants", "vests"]
}

• Drag UIView onto the canvas, change it’s class to GlidingCollection and set autolayout constraints.

step-2

• Connect this view to your view controller class as @IBOutlet.

@IBOutlet var glidingCollection: GlidingCollection!

• Make your view controller conformant to GlidingCollectionDatasource. It’s very similar to UITableView or UICollectionView datasource protocols that you know:

extension ViewController: GlidingCollectionDatasource {

  func numberOfItems(in collection: GlidingCollection) -> Int {
    return items.count
  }

  func glidingCollection(_ collection: GlidingCollection, itemAtIndex index: Int) -> String {
    return "– " + items[index]
  }

}

• Make your view controller conformant to UICollectionViewDatasource:

extension ViewController: UICollectionViewDatasource {

  func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    let section = glidingView.expandedItemIndex // Value of expanded section.
    return images[section].count
  }

  func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath) as? CollectionCell else { return UICollectionViewCell() }
    // Configure and return your cell.
    return cell
  }

}

Customize

You can customize appearance of GlidingCollection by overriding GlidingConfig’s shared instance with your own one.

var config = GlidingConfig.shared
config.buttonsFont = UIFont.boldSystemFont(ofSize: 22)
config.activeButtonColor = .black
config.inactiveButtonsColor = .lightGray
GlidingConfig.shared = config

🗒 All parameters with their descriptions listed in GlidingConfig file.


Notes

There are GlidingCollectionDelegate protocol which can you notify when item in GlidingCollection didSelect, willExpand and didExpand.

If you want to achieve parallax effect on horizontal cards stack, you need to place your parallax view in cell’s contentView and set it’s tag to 99.

parallax-view

There is kGlidingCollectionParallaxViewTag constant if you layout a cell in code. swift imageView.tag = kGlidingCollectionParallaxViewTag


License

GlidingCollection is released under the MIT license. See LICENSE for details.


Follow us

Twitter URL Twitter Follow