diff --git a/VDS.xcodeproj/project.pbxproj b/VDS.xcodeproj/project.pbxproj index 93331c0e..59600512 100644 --- a/VDS.xcodeproj/project.pbxproj +++ b/VDS.xcodeproj/project.pbxproj @@ -7,7 +7,6 @@ objects = { /* Begin PBXBuildFile section */ - 18013CED2C355BF900907F18 /* CarouselSlotItemModel.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18013CEC2C355BF900907F18 /* CarouselSlotItemModel.swift */; }; 1808BEBC2BA41C3200129230 /* CarouselScrollbar.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1808BEBB2BA41C3200129230 /* CarouselScrollbar.swift */; }; 1832AC572BA0791D008AE476 /* BreadcrumbCellItem.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1832AC562BA0791D008AE476 /* BreadcrumbCellItem.swift */; }; 1842B1DF2BECE28B0021AFCA /* CalendarDateViewCell.swift in Sources */ = {isa = PBXBuildFile; fileRef = 1842B1DE2BECE28B0021AFCA /* CalendarDateViewCell.swift */; }; @@ -208,7 +207,6 @@ /* End PBXContainerItemProxy section */ /* Begin PBXFileReference section */ - 18013CEC2C355BF900907F18 /* CarouselSlotItemModel.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CarouselSlotItemModel.swift; sourceTree = ""; }; 1808BEBB2BA41C3200129230 /* CarouselScrollbar.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CarouselScrollbar.swift; sourceTree = ""; }; 1808BEBF2BA456B700129230 /* CarouselScrollbarChangeLog.txt */ = {isa = PBXFileReference; lastKnownFileType = text; path = CarouselScrollbarChangeLog.txt; sourceTree = ""; }; 1832AC562BA0791D008AE476 /* BreadcrumbCellItem.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = BreadcrumbCellItem.swift; sourceTree = ""; }; @@ -502,7 +500,6 @@ 18AE874F2C06FDA60075F181 /* Carousel.swift */, 18B9763E2C11BA4A009271DF /* CarouselPaginationModel.swift */, 18B42AC52C09D197008D6262 /* CarouselSlotAlignmentModel.swift */, - 18013CEC2C355BF900907F18 /* CarouselSlotItemModel.swift */, 18AE87532C06FE610075F181 /* CarouselChangeLog.txt */, ); path = Carousel; @@ -1406,7 +1403,6 @@ EA596ABF2A16B4F500300C4B /* Tabs.swift in Sources */, EAD062A72A3B67770015965D /* UIView+CALayer.swift in Sources */, EAD068942A560C13002E3A2D /* LoaderLaunchable.swift in Sources */, - 18013CED2C355BF900907F18 /* CarouselSlotItemModel.swift in Sources */, 18FEA1AD2BDD137500A56439 /* CalendarIndicatorModel.swift in Sources */, EA985BEC2968A91200F2FF2E /* TitleLockupTitleModel.swift in Sources */, 5FC35BE328D51405004EBEAC /* Button.swift in Sources */, diff --git a/VDS/Components/Carousel/Carousel.swift b/VDS/Components/Carousel/Carousel.swift index 9a9b3251..0a6e71f9 100644 --- a/VDS/Components/Carousel/Carousel.swift +++ b/VDS/Components/Carousel/Carousel.swift @@ -123,7 +123,7 @@ open class Carousel: View { open var selectedIndex: Int? { didSet { setNeedsUpdate() } } /// If provided, will set the alignment for slot content when the slots has different heights. - open var slotAlignment: CarouselSlotAlignmentModel? = nil { didSet { setNeedsUpdate() } } + open var slotAlignment: CarouselSlotAlignmentModel? = .init(vertical: .top, horizontal: .left) { didSet { setNeedsUpdate() } } //-------------------------------------------------- // MARK: - Private Properties @@ -360,19 +360,17 @@ open class Carousel: View { } } - private func estimateHeightFor(item: CarouselSlotItemModel, with width: CGFloat) -> CGFloat { - let itemWidth = width + private func estimateHeightFor(component: UIView, with itemWidth: CGFloat) -> CGFloat { let maxSize = CGSize(width: itemWidth, height: CGFloat.greatestFiniteMagnitude) - let estItemSize = item.component?.systemLayoutSizeFitting(maxSize, withHorizontalFittingPriority: .required, verticalFittingPriority: .fittingSizeLevel) ?? CGSize(width: itemWidth, height: item.defaultHeight) + let estItemSize = component.systemLayoutSizeFitting(maxSize, withHorizontalFittingPriority: .required, verticalFittingPriority: .fittingSizeLevel) return estItemSize.height } private func fetchCarouselHeight() -> CGFloat { var height = slotDefaultHeight if views.count > 0 { - for x in 0...views.count - 1 { - let item : CarouselSlotItemModel = .init(component: views[x]) - let estHeight = estimateHeightFor(item: item, with: minimumSlotWidth) + for index in 0...views.count - 1 { + let estHeight = estimateHeightFor(component: views[index], with: minimumSlotWidth) height = estHeight > height ? estHeight : height } } @@ -396,12 +394,11 @@ open class Carousel: View { // Add carousel items if views.count > 0 { var xPos = 0.0 - for x in 0...views.count - 1 { + for index in 0...views.count - 1 { // Add Carousel Slot let carouselSlot = View().with { $0.clipsToBounds = true - $0.backgroundColor = UIColor(red: CGFloat(216) / 255.0, green: CGFloat(218) / 255.0, blue: CGFloat(218) / 255.0, alpha: 1) } scrollView.addSubview(carouselSlot) scrollView.delegate = self @@ -412,35 +409,11 @@ open class Carousel: View { .pinLeading(xPos) .width(minimumSlotWidth) .height(slotHeight) - carouselSlot.layer.cornerRadius = 12.0 xPos = xPos + minimumSlotWidth + gutter.value - // Add received component - let item : CarouselSlotItemModel = .init(component: views[x]) - if let component = item.component { - carouselSlot.addSubview(component) - if slotAlignment != nil { - // If slotAlignment exist, use component's own sizes - component.widthAnchor.constraint(lessThanOrEqualTo: carouselSlot.widthAnchor).activate() - setSlotAlignment(contentView: component, parentView: carouselSlot) - } else { - // If no slotAlignment, should use full slot - component.pinToSuperView() - } - carouselSlot.backgroundColor = .clear - carouselSlot.layer.cornerRadius = 0 - if var surfacedView = component as? Surfaceable { - surfacedView.surface = surface - } - - // TO BE REMOVED AFTER VQA - borderWidth and borderColor below did set only for Testing purpose to VQA - carouselSlot.layer.borderWidth = 1.0 - carouselSlot.layer.borderColor = SurfaceColorConfiguration().with { - $0.lightColor = VDSColor.elementsPrimaryOnlight - $0.darkColor = VDSColor.elementsPrimaryOndark - }.getColor(self).cgColor - - } + let component = views[index] + carouselSlot.addSubview(component) + setSlotAlignment(contentView: component) } scrollView.contentSize = CGSize(width: xPos - gutter.value, height: slotHeight) } @@ -459,31 +432,38 @@ open class Carousel: View { } // Set slot alignment if provided. Used only when slot content have different heights or widths. - private func setSlotAlignment(contentView: UIView, parentView: View) { - parentView.backgroundColor = .clear + private func setSlotAlignment(contentView: UIView) { switch slotAlignment?.vertical { case .top: - contentView.topAnchor.constraint(equalTo: parentView.topAnchor).activate() - break + contentView + .pinTop() + .pinBottomLessThanOrEqualTo() case .middle: - contentView.centerYAnchor.constraint(equalTo: parentView.centerYAnchor).activate() - break + contentView + .pinTopGreaterThanOrEqualTo() + .pinBottomLessThanOrEqualTo() + .pinCenterY() case .bottom: - contentView.bottomAnchor.constraint(equalTo: parentView.bottomAnchor).activate() - break + contentView + .pinTopGreaterThanOrEqualTo() + .pinBottom() default: break } switch slotAlignment?.horizontal { case .left: - contentView.leadingAnchor.constraint(equalTo: parentView.leadingAnchor).activate() - break + contentView + .pinLeading() + .pinTrailingLessThanOrEqualTo() case .center: - contentView.centerXAnchor.constraint(equalTo: parentView.centerXAnchor).activate() - break + contentView + .pinLeadingGreaterThanOrEqualTo() + .pinTrailingLessThanOrEqualTo() + .pinCenterX() case .right: - parentView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).activate() - break + contentView + .pinLeadingGreaterThanOrEqualTo() + .pinTrailing() default: break } } diff --git a/VDS/Components/Carousel/CarouselSlotItemModel.swift b/VDS/Components/Carousel/CarouselSlotItemModel.swift deleted file mode 100644 index 3cb7240a..00000000 --- a/VDS/Components/Carousel/CarouselSlotItemModel.swift +++ /dev/null @@ -1,23 +0,0 @@ -// -// CarouselSlotItemModel.swift -// VDS -// -// Created by Kanamarlapudi, Vasavi on 30/06/24. -// - -import Foundation -import UIKit -import VDSCoreTokens - -/// A custom data type that holds the style and component for a slot of the 'Carousel' component. -public struct CarouselSlotItemModel { - - public let defaultHeight: CGFloat = 50.0 - - /// Component to be show on Carousel slot - public var component: UIView? - - public init(component: UIView? = nil) { - self.component = component - } -}