CAROUSEL
在一个水平滚动的视图中列出一系列项目。一个缩放因子控制项目相对于中心的大小。
我们专注于移动应用程序和网站的定制 UI 设计和编码。
关注最新更新
获取免费原型→
要求
- iOS 12.0+
- Xcode 10.2+
- Swift 5.0+
安装
只需将 CircularCarousel 目录添加到您的项目中。
或使用带有 Podfile 的 CocoaPods
pod 'CircularCarousel'
或将 CircularCarousel 目录直接拖到您的项目中
解决方案
用法
-
创建一个自定义视图，用作轮播项。在本教程中，我们将使用一个空的 UIView。
-
创建一个视图控制器或容器视图来处理内嵌轮播的数据源和委托响应。
final class ContainerView : UITableViewCell, CircularCarouselDataSource, CircularCarouselDelegate {
}
2.1) 在轮播控制中添加对轮播控件的引用，并选择委托和数据源。
private weak var _carousel : CircularCarousel!
@IBOutlet var carousel : CircularCarousel! {
set {
_carousel = newValue
_carousel.delegate = self
_carousel.dataSource = self
}
get {
return _carousel
}
}
- 实现数据源和委托函数。以下列出了其中一些关键函数。
3.1) 数据源
func numberOfItems(inCarousel carousel: CircularCarousel) -> Int {
return /* Number of carousel items */
}
func carousel(_: CircularCarousel, viewForItemAt indexPath: IndexPath, reuseView view: UIView?) -> UIView {
var view = view as? UIVIew
if view == nil {
view = UIView(frame: CGRect(x: 0, y: 0, width: 50, height: 50))
}
return view
}
func startingItemIndex(inCarousel carousel: CircularCarousel) -> Int {
return /* Insert starting item index */
}
3.2) 委托
根据以下指定的控制变量选择轮播的运行方式
func carousel<CGFloat>(_ 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
}
}
处理特定轮播项的选择
func carousel(_ carousel: CircularCarousel, didSelectItemAtIndex index: Int) {
/* Handle selection of the selected carousel item */
}
处理滚动开始
func carousel(_ carousel: CircularCarousel, willBeginScrollingToIndex index: Int) {
}
处理项目之间根据其与中心的偏移量的间距
func carousel(_ carousel: CircularCarousel, spacingForOffset offset: CGFloat) -> CGFloat {
return /* Based on the offset from center, adjust the spacing of the item */
}
就是这样，轮播即将可供使用！
📄 许可证
轮播在 MIT 许可下发布。有关详细信息，请参阅 LICENSE。
这个库是我们最好的 UI 开源项目之一的一部分。有关更多信息，请参阅 我们的 UI 开源项目精选。
如果您在项目中使用了开源库，请确保引用并反向链接到 www.ramotion.com
📱 获取iOS的Showroom App来尝试一下
在我们的iOS应用中尝试这个UI组件以及其他类似组件。如有兴趣，请联系我们。
