changes to Carousel Bars Component
This commit is contained in:
parent
a83f7a87b0
commit
a223d26d5a
@ -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()
|
||||
}
|
||||
|
||||
|
||||
@ -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
|
||||
|
||||
|
||||
@ -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?
|
||||
|
||||
@ -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
|
||||
//--------------------------------------------------
|
||||
|
||||
Loading…
Reference in New Issue
Block a user