Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ramotion/gliding-collection
:octocat: Gliding Collection is a smooth, flowing, customizable decision for a UICollectionView Swift Controller. iOS library made by @Ramotion
https://github.com/ramotion/gliding-collection
ios library swift
Last synced: 4 days ago
JSON representation
:octocat: Gliding Collection is a smooth, flowing, customizable decision for a UICollectionView Swift Controller. iOS library made by @Ramotion
- Host: GitHub
- URL: https://github.com/ramotion/gliding-collection
- Owner: Ramotion
- License: mit
- Created: 2017-03-03T13:47:23.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2020-04-06T07:01:15.000Z (almost 5 years ago)
- Last Synced: 2025-02-16T01:46:12.500Z (4 days ago)
- Topics: ios, library, swift
- Language: Swift
- Homepage: https://www.ramotion.com/agency/app-development/
- Size: 27 MB
- Stars: 1,525
- Watchers: 52
- Forks: 129
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
GLIDING COLLECTION
A smooth, flowing, customizable decision for a UICollectionView Swift Controller
___
We specialize in the designing and coding of custom UI for Mobile Apps and Websites.
![]()
Stay tuned for the latest updates:
![]()
[](http://twitter.com/Ramotion)
[](https://cocoapods.org/pods/GlidingCollection)
[](http://cocoapods.org/pods/GlidingCollection)
[](https://cdn.rawgit.com/Ramotion/gliding-collection/master/docs/index.html)
[](https://github.com/Ramotion/gliding-collection)
[](https://codebeat.co/projects/github-com-ramotion-gliding-collection)

[](https://paypal.me/Ramotion)## Requirements
- iOS 8.0+
- Xcode 8
- Swift 3 (<= 1.0.3)
- Swift 4 (>= 1.1.0)
- Swift 4.2 (~> 2.0)
## Installation
You can install `GlidingCollection` in several ways:- Add source files to your project.
- Use [CocoaPods](https://cocoapods.org):
``` ruby
pod 'GlidingCollection'
```
- Use [Carthage](https://github.com/Carthage/Carthage):
```
github "Ramotion/gliding-collection"
```
## How to use
• Create a view controller class:
```swift
import GlidingCollectionclass ViewController: UIViewController {
let items = ["gloves", "boots", "bindings", "hoodie"]
}
```• Drag a `UIView` onto the canvas. Change it's class to `GlidingCollection` and use autolayout constraints.

• Connect this view to your view controller class as an `@IBOutlet`.
```swift
@IBOutlet var glidingCollection: GlidingCollection!
```• Make your view controller conform to `GlidingCollectionDatasource`. It's very similar to the `UITableView` or `UICollectionView` *datasource* protocols that you know:
```swift
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 conform to `UICollectionViewDatasource`:
```swift
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 the appearance of `GlidingCollection` by overriding `GlidingConfig`'s `shared` instance with your own.
```swift
var config = GlidingConfig.shared
config.buttonsFont = UIFont.boldSystemFont(ofSize: 22)
config.activeButtonColor = .black
config.inactiveButtonsColor = .lightGray
GlidingConfig.shared = config
```>🗒 All parameters with their descriptions are listed in [`GlidingConfig`](/GlidingCollection/GlidingConfig.swift).
## Notes
There is a [`GlidingCollectionDelegate`](/GlidingCollection/Protocols/GlidingCollectionDelegate.swift) protocol which can notify you when *item* in `GlidingCollection` `didSelect`, `willExpand` and `didExpand`.
If you want to achieve a parallax effect on a horizontal cards stack, you need to place your `parallax view` in a cell's `contentView` and set its `tag` to `99`.

There is a `kGlidingCollectionParallaxViewTag` constant if you want to layout a cell in code.
```swift
imageView.tag = kGlidingCollectionParallaxViewTag
```## 📄 License
Gliding Collection is released under the MIT license.
See [LICENSE](./LICENSE) for details.This library is a part of a selection of our best UI open-source projects.
If you use the open-source library in your project, please make sure to credit and backlink to https://www.ramotion.com/
## 📱 Get the Showroom App for iOS to give it a try
Try this UI component and more like this in our iOS app. Contact us if interested.