From a223d26d5a8ca8d749ef0b9f32f9a0443620b98d Mon Sep 17 00:00:00 2001 From: Vasavi Kanamarlapudi Date: Wed, 30 Mar 2022 19:15:04 +0530 Subject: [PATCH] changes to Carousel Bars Component --- .../CarouselIndicator/BarsIndicatorView.swift | 8 +++++++- .../CarouselIndicator/CarouselIndicator.swift | 15 ++++++++++++--- .../CarouselIndicatorModel.swift | 3 ++- MVMCoreUI/Categories/UIColor+Extension.swift | 9 +++++++++ 4 files changed, 30 insertions(+), 5 deletions(-) diff --git a/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/BarsIndicatorView.swift b/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/BarsIndicatorView.swift index 381b8112..cecc1841 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/BarsIndicatorView.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/BarsIndicatorView.swift @@ -20,6 +20,8 @@ open class BarsIndicatorView: CarouselIndicator { static let width: CGFloat = 24 static let selectedHeight: CGFloat = 4 static let unselectedHeight: CGFloat = 1 + static let selectedCornerRadius: CGFloat = 2 + static let unselectedCornerRadius: CGFloat = 0.5 var constraint: NSLayoutConstraint? @@ -52,7 +54,7 @@ open class BarsIndicatorView: CarouselIndicator { stackView.axis = .horizontal stackView.alignment = .bottom stackView.distribution = .equalSpacing - stackView.spacing = 6 + stackView.spacing = 4 return stackView }() @@ -189,6 +191,7 @@ open class BarsIndicatorView: CarouselIndicator { let bar = IndicatorBar() setAccessibilityLabel(view: bar, index: index) bar.backgroundColor = isEnabled ? (index == currentIndex ? currentIndicatorColor : indicatorColor) : disabledIndicatorColor + bar.layer.cornerRadius = index == currentIndex ? BarsIndicatorView.IndicatorBar.selectedCornerRadius : BarsIndicatorView.IndicatorBar.unselectedCornerRadius let barHeight = index == currentIndex ? BarsIndicatorView.IndicatorBar.selectedHeight : BarsIndicatorView.IndicatorBar.unselectedHeight let heightConstraint = bar.heightAnchor.constraint(equalToConstant: barHeight) heightConstraint.isActive = true @@ -251,6 +254,7 @@ open class BarsIndicatorView: CarouselIndicator { barReferences.forEach { $0.backgroundColor = isEnabled ? indicatorColor : disabledIndicatorColor $0.constraint?.constant = IndicatorBar.unselectedHeight + $0.layer.cornerRadius = IndicatorBar.unselectedCornerRadius } balanceBarCount(numberOfPages - barReferences.count) @@ -260,8 +264,10 @@ open class BarsIndicatorView: CarouselIndicator { let expression = { [self] in barReferences[previousIndex].backgroundColor = isEnabled ? indicatorColor : disabledIndicatorColor barReferences[previousIndex].constraint?.constant = IndicatorBar.unselectedHeight + barReferences[previousIndex].layer.cornerRadius = IndicatorBar.unselectedCornerRadius barReferences[newIndex].backgroundColor = isEnabled ? currentIndicatorColor : disabledIndicatorColor barReferences[newIndex].constraint?.constant = IndicatorBar.selectedHeight + barReferences[newIndex].layer.cornerRadius = IndicatorBar.selectedCornerRadius layoutIfNeeded() } diff --git a/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicator.swift b/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicator.swift index 6a82ef80..01a14f7f 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicator.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicator.swift @@ -71,8 +71,17 @@ open class CarouselIndicator: Control, CarouselPageControlProtocol { } public var disabledIndicatorColor: UIColor { - get { carouselIndicatorModel?.disabledIndicatorColor.uiColor ?? .mvmCoolGray3 } - set { carouselIndicatorModel?.disabledIndicatorColor = Color(uiColor: newValue) } + get { + guard let model = carouselIndicatorModel else { return .mvmGray44 } + return model.inverted ? model.disabledIndicatorColor_inverted.uiColor : model.disabledIndicatorColor.uiColor + } + set { + if let model = carouselIndicatorModel, model.inverted { + model.disabledIndicatorColor_inverted = Color(uiColor: newValue) + } else { + carouselIndicatorModel?.disabledIndicatorColor = Color(uiColor: newValue) + } + } } public var indicatorColor: UIColor { @@ -202,7 +211,7 @@ open class CarouselIndicator: Control, CarouselPageControlProtocol { previousIndex = 0 indicatorColor = model.inverted ? model.indicatorColor_inverted.uiColor : model.indicatorColor.uiColor - disabledIndicatorColor = model.disabledIndicatorColor.uiColor + disabledIndicatorColor = model.inverted ? model.disabledIndicatorColor_inverted.uiColor : model.disabledIndicatorColor.uiColor currentIndex = model.currentIndex isEnabled = model.enabled diff --git a/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicatorModel.swift b/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicatorModel.swift index 9b211857..a3c7c14b 100644 --- a/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicatorModel.swift +++ b/MVMCoreUI/Atomic/Atoms/Views/CarouselIndicator/CarouselIndicatorModel.swift @@ -30,7 +30,8 @@ open class CarouselIndicatorModel: CarouselPagingModelProtocol, MoleculeModelPro /// Set true to make the accessibility value as "Slide #currentPage of #totalPage", otherwise will be "Page #currentPage of #totalPage", default is false public var accessibilityHasSlidesInsteadOfPage: Bool = false public var enabled: Bool = true - public var disabledIndicatorColor: Color = Color(uiColor: .mvmCoolGray3) + public var disabledIndicatorColor: Color = Color(uiColor: .mvmGray44) + public var disabledIndicatorColor_inverted: Color = Color(uiColor: .mvmGray65) public var indicatorColor: Color = Color(uiColor: .mvmBlack) public var indicatorColor_inverted: Color = Color(uiColor: .mvmWhite) public var position: CGFloat? diff --git a/MVMCoreUI/Categories/UIColor+Extension.swift b/MVMCoreUI/Categories/UIColor+Extension.swift index 78363630..3c4c11ba 100644 --- a/MVMCoreUI/Categories/UIColor+Extension.swift +++ b/MVMCoreUI/Categories/UIColor+Extension.swift @@ -52,6 +52,8 @@ extension UIColor { "coolGray3": (.mvmCoolGray3, "#D8DADA"), "coolGray6": (.mvmCoolGray6, "#747676"), "coolGray10": (.mvmCoolGray10, "#333333"), + "gray44": (.mvmGray44, "#6F7171"), + "gray65": (.mvmGray65, "#A7A7A7"), "upGold1": (.vzupGold1, "#F9D542"), "upGold2": (.vzupGold2, "#F4CA53"), "upGold3": (.vzupGold3, "#CC9B2D")] @@ -197,6 +199,13 @@ extension UIColor { /// HEX: #333333 public static let mvmCoolGray10 = UIColor.assetColor(named: "coolGray10") + /// HEX: #6F7171 + public static let mvmGray44 = UIColor.assetColor(named: "gray44") + + /// HEX: #A7A7A7 + public static let mvmGray65 = UIColor.assetColor(named: "gray65") + + //-------------------------------------------------- // MARK: - VZ UP Brand //--------------------------------------------------