added toggle cotainer to meet specs

refactored all configurable default properties to one area

Signed-off-by: Matt Bruce <matt.bruce@verizon.com>
This commit is contained in:
Matt Bruce 2022-08-05 14:37:49 -05:00
parent 5b800c0450
commit 61d65e9b60
3 changed files with 97 additions and 86 deletions

View File

@ -74,11 +74,49 @@ open class CheckboxBase<ModelType: CheckboxModel>: Control<ModelType>, Changable
}()
//--------------------------------------------------
// MARK: - Static Properties
// MARK: - Configuration Properties
//--------------------------------------------------
// Sizes are from InVision design specs.
public let checkboxSize = CGSize(width: 20, height: 20)
private var checkboxBackgroundColorConfiguration: CheckboxErrorColorConfiguration = {
let config = CheckboxErrorColorConfiguration()
config.forTrue.enabled.lightColor = VDSColor.elementsPrimaryOnlight
config.forTrue.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forTrue.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forTrue.disabled.darkColor = VDSColor.interactiveDisabledOndark
//error doesn't care enabled/disable
config.error.forTrue.lightColor = VDSColor.elementsPrimaryOnlight
config.error.forTrue.darkColor = VDSColor.elementsPrimaryOndark
config.error.forFalse.lightColor = VDSColor.feedbackErrorBackgroundOnlight
config.error.forFalse.darkColor = VDSColor.feedbackErrorBackgroundOndark
return config
}()
private var checkboxBorderColorConfiguration: CheckboxErrorColorConfiguration = {
let config = CheckboxErrorColorConfiguration()
config.forTrue.enabled.lightColor = VDSColor.elementsPrimaryOnlight
config.forTrue.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forFalse.enabled.lightColor = VDSFormControlsColor.borderOnlight
config.forFalse.enabled.darkColor = VDSFormControlsColor.borderOndark
config.forTrue.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forTrue.disabled.darkColor = VDSColor.interactiveDisabledOndark
config.forFalse.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forFalse.disabled.darkColor = VDSColor.interactiveDisabledOndark
//error doesn't care enabled/disable
config.error.forTrue.lightColor = VDSColor.elementsPrimaryOnlight
config.error.forTrue.darkColor = VDSColor.elementsPrimaryOndark
config.error.forFalse.lightColor = VDSColor.feedbackErrorOnlight
config.error.forFalse.darkColor = VDSColor.feedbackErrorOndark
return config
}()
private var checkboxCheckColorConfiguration: BinarySurfaceColorConfiguration<ModelType> = {
let config = BinarySurfaceColorConfiguration<ModelType>()
config.forTrue.lightColor = VDSColor.elementsPrimaryOndark
config.forTrue.darkColor = VDSColor.elementsPrimaryOnlight
return config
}()
//--------------------------------------------------
// MARK: - Public Properties
//--------------------------------------------------
@ -264,46 +302,6 @@ open class CheckboxBase<ModelType: CheckboxModel>: Control<ModelType>, Changable
//--------------------------------------------------
/// Manages the appearance of the checkbox.
private var shapeLayer: CAShapeLayer?
private var checkboxBackgroundColorConfiguration: CheckboxErrorColorConfiguration = {
let config = CheckboxErrorColorConfiguration()
config.forTrue.enabled.lightColor = VDSColor.elementsPrimaryOnlight
config.forTrue.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forTrue.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forTrue.disabled.darkColor = VDSColor.interactiveDisabledOndark
//error doesn't care enabled/disable
config.error.forTrue.lightColor = VDSColor.elementsPrimaryOnlight
config.error.forTrue.darkColor = VDSColor.elementsPrimaryOndark
config.error.forFalse.lightColor = VDSColor.feedbackErrorBackgroundOnlight
config.error.forFalse.darkColor = VDSColor.feedbackErrorBackgroundOndark
return config
}()
private var checkboxBorderColorConfiguration: CheckboxErrorColorConfiguration = {
let config = CheckboxErrorColorConfiguration()
config.forTrue.enabled.lightColor = VDSColor.elementsPrimaryOnlight
config.forTrue.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forFalse.enabled.lightColor = VDSFormControlsColor.borderOnlight
config.forFalse.enabled.darkColor = VDSFormControlsColor.borderOndark
config.forTrue.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forTrue.disabled.darkColor = VDSColor.interactiveDisabledOndark
config.forFalse.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forFalse.disabled.darkColor = VDSColor.interactiveDisabledOndark
//error doesn't care enabled/disable
config.error.forTrue.lightColor = VDSColor.elementsPrimaryOnlight
config.error.forTrue.darkColor = VDSColor.elementsPrimaryOndark
config.error.forFalse.lightColor = VDSColor.feedbackErrorOnlight
config.error.forFalse.darkColor = VDSColor.feedbackErrorOndark
return config
}()
private var checkboxCheckColorConfiguration: BinarySurfaceColorConfiguration<ModelType> = {
let config = BinarySurfaceColorConfiguration<ModelType>()
config.forTrue.lightColor = VDSColor.elementsPrimaryOndark
config.forTrue.darkColor = VDSColor.elementsPrimaryOnlight
return config
}()
private func updateCheckbox(_ viewModel: ModelType) {
//get the colors
let backgroundColor = checkboxBackgroundColorConfiguration.getColor(viewModel)

View File

@ -47,6 +47,18 @@ open class LabelBase<ModelType: LabelModel>: UILabel, ModelHandlerable, Initable
}
}
//--------------------------------------------------
// MARK: - Configuration Properties
//--------------------------------------------------
private var textColorConfiguration: DisabledSurfaceColorConfiguration<ModelType> = {
let config = DisabledSurfaceColorConfiguration<ModelType>()
config.disabled.lightColor = VDSColor.elementsSecondaryOnlight
config.disabled.darkColor = VDSColor.elementsSecondaryOndark
config.enabled.lightColor = VDSColor.elementsPrimaryOnlight
config.enabled.darkColor = VDSColor.elementsPrimaryOndark
return config
} ()
//--------------------------------------------------
// MARK: - Initializers
//--------------------------------------------------
@ -152,18 +164,6 @@ open class LabelBase<ModelType: LabelModel>: UILabel, ModelHandlerable, Initable
text = viewModel.text
}
}
//--------------------------------------------------
// MARK: - Default TextColor Configuration
//--------------------------------------------------
private var textColorConfiguration: DisabledSurfaceColorConfiguration<ModelType> = {
let config = DisabledSurfaceColorConfiguration<ModelType>()
config.disabled.lightColor = VDSColor.elementsSecondaryOnlight
config.disabled.darkColor = VDSColor.elementsSecondaryOndark
config.enabled.lightColor = VDSColor.elementsPrimaryOnlight
config.enabled.darkColor = VDSColor.elementsPrimaryOndark
return config
} ()
//--------------------------------------------------
// MARK: - Actionable

View File

@ -53,12 +53,39 @@ open class ToggleBase<ModelType: ToggleModel>: Control<ModelType>, Changable {
}()
//--------------------------------------------------
// MARK: - Static Properties
// MARK: - Configuration Properties
//--------------------------------------------------
// Sizes are from InVision design specs.
public let toggleSize = CGSize(width: 52, height: 24)
public let toggleContainerSize = CGSize(width: 52, height: 44)
public let knobSize = CGSize(width: 20, height: 20)
private var toggleColorConfiguration: BinaryDisabledSurfaceColorConfiguration<ModelType> = {
let config = BinaryDisabledSurfaceColorConfiguration<ModelType>()
config.forTrue.enabled.lightColor = VDSColor.paletteGreen26
config.forTrue.enabled.darkColor = VDSColor.paletteGreen34
config.forTrue.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forTrue.disabled.darkColor = VDSColor.interactiveDisabledOndark
config.forFalse.enabled.lightColor = VDSColor.elementsSecondaryOnlight
config.forFalse.enabled.darkColor = VDSColor.paletteGray44
config.forFalse.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forFalse.disabled.darkColor = VDSColor.interactiveDisabledOndark
return config
} ()
private var knobColorConfiguration: BinaryDisabledSurfaceColorConfiguration<ModelType> = {
let config = BinaryDisabledSurfaceColorConfiguration<ModelType>()
config.forTrue.enabled.lightColor = VDSColor.elementsPrimaryOndark
config.forTrue.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forTrue.disabled.lightColor = VDSColor.paletteGray95
config.forTrue.disabled.darkColor = VDSColor.paletteGray44
config.forFalse.enabled.lightColor = VDSColor.elementsPrimaryOndark
config.forFalse.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forFalse.disabled.lightColor = VDSColor.paletteGray95
config.forFalse.disabled.darkColor = VDSColor.paletteGray44
return config
} ()
//--------------------------------------------------
// MARK: - Public Properties
//--------------------------------------------------
@ -173,32 +200,6 @@ open class ToggleBase<ModelType: ToggleModel>: Control<ModelType>, Changable {
//--------------------------------------------------
// MARK: - Toggle
//--------------------------------------------------
private var toggleColorConfiguration: BinaryDisabledSurfaceColorConfiguration<ModelType> = {
let config = BinaryDisabledSurfaceColorConfiguration<ModelType>()
config.forTrue.enabled.lightColor = VDSColor.paletteGreen26
config.forTrue.enabled.darkColor = VDSColor.paletteGreen34
config.forTrue.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forTrue.disabled.darkColor = VDSColor.interactiveDisabledOndark
config.forFalse.enabled.lightColor = VDSColor.elementsSecondaryOnlight
config.forFalse.enabled.darkColor = VDSColor.paletteGray44
config.forFalse.disabled.lightColor = VDSColor.interactiveDisabledOnlight
config.forFalse.disabled.darkColor = VDSColor.interactiveDisabledOndark
return config
} ()
private var knobColorConfiguration: BinaryDisabledSurfaceColorConfiguration<ModelType> = {
let config = BinaryDisabledSurfaceColorConfiguration<ModelType>()
config.forTrue.enabled.lightColor = VDSColor.elementsPrimaryOndark
config.forTrue.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forTrue.disabled.lightColor = VDSColor.paletteGray95
config.forTrue.disabled.darkColor = VDSColor.paletteGray44
config.forFalse.enabled.lightColor = VDSColor.elementsPrimaryOndark
config.forFalse.enabled.darkColor = VDSColor.elementsPrimaryOndark
config.forFalse.disabled.lightColor = VDSColor.paletteGray95
config.forFalse.disabled.darkColor = VDSColor.paletteGray44
return config
} ()
private func updateToggle(_ viewModel: ModelType) {
//private func
func constrainKnob(){
@ -266,34 +267,46 @@ open class ToggleBase<ModelType: ToggleModel>: Control<ModelType>, Changable {
accessibilityTraits = .button
addSubview(stackView)
//create the wrapping view
let toggleContainerView = UIView()
toggleContainerView.translatesAutoresizingMaskIntoConstraints = false
toggleContainerView.backgroundColor = .clear
toggleContainerView.widthAnchor.constraint(equalToConstant: toggleContainerSize.width).isActive = true
toggleContainerView.heightAnchor.constraint(equalToConstant: toggleContainerSize.height).isActive = true
toggleHeightConstraint = toggleView.heightAnchor.constraint(equalToConstant: toggleSize.height)
toggleHeightConstraint?.isActive = true
toggleWidthConstraint = toggleView.widthAnchor.constraint(equalToConstant: toggleSize.width)
toggleWidthConstraint?.isActive = true
toggleView.layer.cornerRadius = toggleSize.height / 2.0
knobView.layer.cornerRadius = knobSize.height / 2.0
toggleView.backgroundColor = toggleColorConfiguration.getColor(model)
toggleContainerView.addSubview(toggleView)
toggleView.addSubview(knobView)
knobHeightConstraint = knobView.heightAnchor.constraint(equalToConstant: knobSize.height)
knobHeightConstraint?.isActive = true
knobWidthConstraint = knobView.widthAnchor.constraint(equalToConstant: knobSize.width)
knobWidthConstraint?.isActive = true
knobView.centerYAnchor.constraint(equalTo: toggleView.centerYAnchor).isActive = true
knobView.topAnchor.constraint(greaterThanOrEqualTo: toggleView.topAnchor).isActive = true
toggleView.bottomAnchor.constraint(greaterThanOrEqualTo: knobView.bottomAnchor).isActive = true
updateLabel(model)
stackView.addArrangedSubview(toggleView)
stackView.addArrangedSubview(toggleContainerView)
stackView.topAnchor.constraint(equalTo: topAnchor).isActive = true
stackView.leadingAnchor.constraint(equalTo: leadingAnchor).isActive = true
stackView.trailingAnchor.constraint(equalTo: trailingAnchor).isActive = true
stackView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
toggleView.centerXAnchor.constraint(equalTo: toggleContainerView.centerXAnchor).isActive = true
toggleView.centerYAnchor.constraint(equalTo: toggleContainerView.centerYAnchor).isActive = true
}
public override func reset() {