{"id":18538984,"url":"https://github.com/ramotion/circular-carousel","last_synced_at":"2025-04-05T03:10:39.151Z","repository":{"id":56905952,"uuid":"164593180","full_name":"Ramotion/circular-carousel","owner":"Ramotion","description":"List a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center.","archived":false,"fork":false,"pushed_at":"2020-04-06T06:46:54.000Z","size":25184,"stargazers_count":583,"open_issues_count":10,"forks_count":55,"subscribers_count":15,"default_branch":"master","last_synced_at":"2025-03-29T02:06:49.347Z","etag":null,"topics":["animation","ios","library","material-design","swift"],"latest_commit_sha":null,"homepage":"https://www.ramotion.com/swift-app-development-ui-library-for-organizing-a-collection-of-items/","language":"Swift","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Ramotion.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-01-08T07:45:25.000Z","updated_at":"2025-03-06T16:33:29.000Z","dependencies_parsed_at":"2022-08-21T03:50:06.966Z","dependency_job_id":null,"html_url":"https://github.com/Ramotion/circular-carousel","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Fcircular-carousel","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Fcircular-carousel/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Fcircular-carousel/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ramotion%2Fcircular-carousel/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Ramotion","download_url":"https://codeload.github.com/Ramotion/circular-carousel/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247280272,"owners_count":20912967,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["animation","ios","library","material-design","swift"],"created_at":"2024-11-06T19:45:45.306Z","updated_at":"2025-04-05T03:10:39.132Z","avatar_url":"https://github.com/Ramotion.png","language":"Swift","funding_links":["https://paypal.me/Ramotion"],"categories":[],"sub_categories":[],"readme":"\u003ca href=\"https://www.ramotion.com/agency/app-development/?utm_source=gthb\u0026utm_medium=repo\u0026utm_campaign=circular-carousel\"\u003e\u003cimg src=\"https://github.com/Ramotion/circular-carousel/blob/master/header.png\"\u003e\u003c/a\u003e\n\n\u003ca href=\"https://github.com/Ramotion/circular-carousel\"\u003e\n\u003cimg align=\"left\" src=\"https://github.com/Ramotion/circular-carousel/blob/master/Screenshots/ios_circular_carousel.gif\" width=\"480\" height=\"360\" /\u003e\u003c/a\u003e\n\n\u003cp\u003e\u003ch1 align=\"left\"\u003eCAROUSEL\u003c/h1\u003e\u003c/p\u003e\n\n\u003ch4\u003eList a collection of items in a horizontally scrolling view. A scaling factor controls the size of the items relative to the center.\u003c/h4\u003e\n\n___\n\n\n\u003cp\u003e\u003ch6\u003eWe specialize in the designing and coding of custom UI for Mobile Apps and Websites.\u003c/h6\u003e\n\u003ca href=\"https://www.ramotion.com/agency/app-development/?utm_source=gthb\u0026utm_medium=repo\u0026utm_campaign=circular-carousel\"\u003e\n\u003cimg src=\"https://github.com/ramotion/gliding-collection/raw/master/contact_our_team@2x.png\" width=\"187\" height=\"34\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\u003cp\u003e\u003ch6\u003eStay tuned for the latest updates:\u003c/h6\u003e\n\u003ca href=\"https://goo.gl/rPFpid\" \u003e\n\u003cimg src=\"https://i.imgur.com/ziSqeSo.png/\" width=\"156\" height=\"28\"\u003e\u003c/a\u003e\u003c/p\u003e\n\n\u003ch6\u003e💡🏞 Inspired by \u003ca href=\"https://dribbble.com/KEVINGAUTIER\"\u003eKevin Gautier\u003c/a\u003e \u003ca href=\"https://dribbble.com/shots/5097519-California-National-Park-Guide\"\u003eshot\u003c/a\u003e\u003c/h6\u003e\n\n\u003c/br\u003e\n\n[![CocoaPods](https://img.shields.io/cocoapods/p/FoldingCell.svg)](https://cocoapods.org/pods/FoldingCell)\n[![CocoaPods](https://img.shields.io/cocoapods/v/FoldingCell.svg)](http://cocoapods.org/pods/FoldingCell)\n[![Twitter](https://img.shields.io/badge/Twitter-@Ramotion-blue.svg?style=flat)](http://twitter.com/Ramotion)\n\u003c!--[![Travis](https://img.shields.io/travis/Ramotion/folding-cell.svg)](https://travis-ci.org/Ramotion/folding-cell)\n[![codebeat badge](https://codebeat.co/badges/6f67da5d-c416-4bac-9fb7-c2dc938feedc)](https://codebeat.co/projects/github-com-ramotion-folding-cell)\n[![Carthage compatible](https://img.shields.io/badge/Carthage-compatible-4BC51D.svg?style=flat)](https://github.com/Carthage/Carthage)\n[![Swift 4.0](https://img.shields.io/badge/Swift-4.0-green.svg?style=flat)](https://developer.apple.com/swift/)\n[![Analytics](https://ga-beacon.appspot.com/UA-84973210-1/ramotion/folding-cell)](https://github.com/igrigorik/ga-beacon)!--\u003e\n[![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/Ramotion)\n\n## Requirements\n\n- iOS 12.0+\n- Xcode 10.2+\n- Swift 5.0+\n\n## Installation\n\nJust add the `CircularCarousel` directory to your project.\n\nor use [CocoaPods](https://cocoapods.org) with Podfile:\n```ruby\npod 'CircularCarousel'\n```\n\nor just drag and drop the `CircularCarousel` directory to your project\n\n## Usage\n\n**1** Create a custom view that will be used as a carousel item. In this tutorial we will just use a blank `UIView`.\n\n**2** Create a view controller or container view that handles datasource and delegate responses for the contained Carousel. \n\n```swift\nfinal class ContainerView : UITableViewCell, CircularCarouselDataSource, CircularCarouselDelegate {\n\n}\n```\n\n**2.1** Add a reference to the carousel control and the selection of a delegate and datasource to your Carousel control.\n```swift \nprivate weak var _carousel : CircularCarousel!\n\n@IBOutlet var carousel : CircularCarousel! {\n    set {\n        _carousel = newValue\n        _carousel.delegate = self\n        _carousel.dataSource = self\n    }\n        \n    get {\n        return _carousel\n    }\n}\n```\n\n**3** Implement the DataSource and Delegate functions. Some of the key functions are listed below.\n\n**3.1** Datasource \n\n```swift\nfunc numberOfItems(inCarousel carousel: CircularCarousel) -\u003e Int {\n    return /* Number of carousel items */\n}\n```\n\n```swift\nfunc carousel(_: CircularCarousel, viewForItemAt indexPath: IndexPath, reuseView view: UIView?) -\u003e UIView {\n    var view = view as? UIVIew\n\n    if view == nil {\n    \tview = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 50))\n    }\n\n    return view\n}\n```\n\n```swift \nfunc startingItemIndex(inCarousel carousel: CircularCarousel) -\u003e Int {\n    return /* Insert starting item index */\n}\n```\n\n**3.2** Delegate\n\nSelect how you want the carousel to operate based on the control variables specified below :\n```swift\nfunc carousel\u003cCGFloat\u003e(_ carousel: CircularCarousel, valueForOption option: CircularCarouselOption, withDefaultValue defaultValue: CGFloat) -\u003e CGFloat {\n\tswitch option {\n    case .itemWidth:\n        return /* Select item width for carousel */\n    /*  Insert one of the following handlers :\n\tcase spacing\n\tcase fadeMin\n\tcase fadeMax\n\tcase fadeRange\n\tcase fadeMinAlpha\n\tcase offsetMultiplier\n\tcase itemWidth\n\tcase scaleMultiplier\n\tcase minScale\n\tcase maxScale\n    */\n    default:\n        return defaultValue\n    }\n}\n```\n\nHandle the selection of a particular carousel item :\n```swift\nfunc carousel(_ carousel: CircularCarousel, didSelectItemAtIndex index: Int) {\n    /* Handle selection of the selected carousel item */\n}\n```\n\nHandle will begin scrolling :\n```swift\nfunc carousel(_ carousel: CircularCarousel, willBeginScrollingToIndex index: Int) {\n\n}\n```\n\nTo handle spacing between items depending on their offst from the center : \n```swift\nfunc carousel(_ carousel: CircularCarousel, spacingForOffset offset: CGFloat) -\u003e CGFloat {        \n    return /* Based on the offset from center, adjust the spacing of the item */\n}\n```\n\nThat's it, the Carousel is good to go!\n\n## 📄 License\n\nCarousel is released under the MIT license.\nSee [LICENSE](./LICENSE) for details.\n\nThis library is a part of a \u003ca href=\"https://github.com/Ramotion/swift-ui-animation-components-and-libraries\"\u003e\u003cb\u003eselection of our best UI open-source projects.\u003c/b\u003e\u003c/a\u003e\n\nIf you use the open-source library in your project, please make sure to credit and backlink to https://www.ramotion.com/\n\n## 📱 Get the Showroom App for iOS to give it a try\nTry this UI component and more like this in our iOS app. Contact us if interested.\n\n\u003ca href=\"https://itunes.apple.com/app/apple-store/id1182360240?pt=550053\u0026ct=folding-cell\u0026mt=8\" \u003e\n\u003cimg src=\"https://github.com/ramotion/gliding-collection/raw/master/app_store@2x.png\" width=\"117\" height=\"34\"\u003e\u003c/a\u003e\n\n\u003ca href=\"https://www.ramotion.com/agency/app-development/?utm_source=gthb\u0026utm_medium=repo\u0026utm_campaign=circular-carousel\"\u003e\n\u003cimg src=\"https://github.com/ramotion/gliding-collection/raw/master/contact_our_team@2x.png\" width=\"187\" height=\"34\"\u003e\u003c/a\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Framotion%2Fcircular-carousel","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Framotion%2Fcircular-carousel","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Framotion%2Fcircular-carousel/lists"}