Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ramotion/circular-carousel
List a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center.
https://github.com/ramotion/circular-carousel
animation ios library material-design swift
Last synced: about 4 hours ago
JSON representation
List a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center.
- Host: GitHub
- URL: https://github.com/ramotion/circular-carousel
- Owner: Ramotion
- License: mit
- Created: 2019-01-08T07:45:25.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2020-04-06T06:46:54.000Z (over 4 years ago)
- Last Synced: 2024-10-27T10:40:41.633Z (11 days ago)
- Topics: animation, ios, library, material-design, swift
- Language: Swift
- Homepage: https://www.ramotion.com/swift-app-development-ui-library-for-organizing-a-collection-of-items/
- Size: 24 MB
- Stars: 580
- Watchers: 16
- Forks: 55
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
CAROUSEL
List a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center.
___
We specialize in the designing and coding of custom UI for Mobile Apps and Websites.
Stay tuned for the latest updates:
💡🏞 Inspired by Kevin Gautier shot
[![CocoaPods](https://img.shields.io/cocoapods/p/FoldingCell.svg)](https://cocoapods.org/pods/FoldingCell)
[![CocoaPods](https://img.shields.io/cocoapods/v/FoldingCell.svg)](http://cocoapods.org/pods/FoldingCell)
[![Twitter](https://img.shields.io/badge/[email protected]?style=flat)](http://twitter.com/Ramotion)[![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/Ramotion)
## Requirements
- iOS 12.0+
- Xcode 10.2+
- Swift 5.0+## Installation
Just add the `CircularCarousel` directory to your project.
or use [CocoaPods](https://cocoapods.org) with Podfile:
```ruby
pod 'CircularCarousel'
```or just drag and drop the `CircularCarousel` directory to your project
## Usage
**1** Create a custom view that will be used as a carousel item. In this tutorial we will just use a blank `UIView`.
**2** Create a view controller or container view that handles datasource and delegate responses for the contained Carousel.
```swift
final class ContainerView : UITableViewCell, CircularCarouselDataSource, CircularCarouselDelegate {}
```**2.1** Add a reference to the carousel control and the selection of a delegate and datasource to your Carousel control.
```swift
private weak var _carousel : CircularCarousel!@IBOutlet var carousel : CircularCarousel! {
set {
_carousel = newValue
_carousel.delegate = self
_carousel.dataSource = self
}
get {
return _carousel
}
}
```**3** Implement the DataSource and Delegate functions. Some of the key functions are listed below.
**3.1** Datasource
```swift
func numberOfItems(inCarousel carousel: CircularCarousel) -> Int {
return /* Number of carousel items */
}
``````swift
func carousel(_: CircularCarousel, viewForItemAt indexPath: IndexPath, reuseView view: UIView?) -> UIView {
var view = view as? UIVIewif view == nil {
view = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 50))
}return view
}
``````swift
func startingItemIndex(inCarousel carousel: CircularCarousel) -> Int {
return /* Insert starting item index */
}
```**3.2** Delegate
Select how you want the carousel to operate based on the control variables specified below :
```swift
func carousel(_ carousel: CircularCarousel, valueForOption option: CircularCarouselOption, withDefaultValue defaultValue: CGFloat) -> CGFloat {
switch option {
case .itemWidth:
return /* Select item width for carousel */
/* Insert one of the following handlers :
case spacing
case fadeMin
case fadeMax
case fadeRange
case fadeMinAlpha
case offsetMultiplier
case itemWidth
case scaleMultiplier
case minScale
case maxScale
*/
default:
return defaultValue
}
}
```Handle the selection of a particular carousel item :
```swift
func carousel(_ carousel: CircularCarousel, didSelectItemAtIndex index: Int) {
/* Handle selection of the selected carousel item */
}
```Handle will begin scrolling :
```swift
func carousel(_ carousel: CircularCarousel, willBeginScrollingToIndex index: Int) {}
```To handle spacing between items depending on their offst from the center :
```swift
func carousel(_ carousel: CircularCarousel, spacingForOffset offset: CGFloat) -> CGFloat {
return /* Based on the offset from center, adjust the spacing of the item */
}
```That's it, the Carousel is good to go!
## 📄 License
Carousel 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.