From b032e40400833219e9aa800ca0d3eb24ea13aaeb Mon Sep 17 00:00:00 2001 From: Kevin G Christiano Date: Fri, 27 Sep 2019 14:23:46 -0400 Subject: [PATCH] Checkbox in good place. --- MVMCoreUI/Atoms/Views/Checkbox.swift | 88 ++++++++++--------- .../Atoms/Views/CheckboxWithLabelView.swift | 6 +- 2 files changed, 49 insertions(+), 45 deletions(-) diff --git a/MVMCoreUI/Atoms/Views/Checkbox.swift b/MVMCoreUI/Atoms/Views/Checkbox.swift index d00c2463..29ecc3c6 100644 --- a/MVMCoreUI/Atoms/Views/Checkbox.swift +++ b/MVMCoreUI/Atoms/Views/Checkbox.swift @@ -17,13 +17,17 @@ import MVMCore public static let defaultHeightWidth: CGFloat = 18.0 /// The color of the background when checked. - public var checkedBackgroundColor: UIColor = .white + public var checkedBackgroundColor: UIColor? - /// The color of the background when unChecked. - public var unCheckedBackgroundColor: UIColor = .black + /// The color of the background when unChecked. Will change of the view's background color. + public var unCheckedBackgroundColor: UIColor = .white { + didSet (newColor) { + backgroundColor = newColor + } + } /// If true the border of this checkbox will be circular. - public var hasRoundCorners = false + public var hasRoundedCorners = false // Action Block called when the switch is selected. public var actionBlock: ActionBlock? @@ -37,7 +41,7 @@ import MVMCore public var lineWidth: CGFloat = 2 public var lineColor: UIColor = .black - + open var borderColor: UIColor { get { guard let color = layer.borderColor else { return .black } @@ -54,17 +58,23 @@ import MVMCore layer.borderWidth = newWidth } } - + override open var isSelected: Bool { didSet { + shapeLayer?.removeAllAnimations() if isSelected { -// layer.addSublayer(shapeLayer!) -// shapeLayer?.strokeEnd = 1 - shapeLayer?.removeAllAnimations() + if checkedBackgroundColor != nil { + UIView.animate(withDuration: 0.2, delay: 0.1, options: .curveEaseOut, animations: { + self.backgroundColor = self.checkedBackgroundColor + }) + } shapeLayer?.add(checkedAnimation, forKey: "strokeEnd") } else { -// shapeLayer?.strokeEnd = 0 - shapeLayer?.removeAllAnimations() + if checkedBackgroundColor != nil { + UIView.animate(withDuration: 0.2, delay: 0.1, options: .curveEaseOut, animations: { + self.backgroundColor = self.unCheckedBackgroundColor + }) + } shapeLayer?.add(uncheckedAnimation, forKey: "strokeEnd") } } @@ -118,6 +128,11 @@ import MVMCore self.unCheckedBackgroundColor = unCheckedColor } + public convenience init(isCircular: Bool) { + self.init(frame: .zero) + hasRoundedCorners = isCircular + } + //-------------------------------------------------- // MARK: - Lifecycle //-------------------------------------------------- @@ -125,13 +140,14 @@ import MVMCore override open func layoutSubviews() { super.layoutSubviews() drawCheck() + layer.cornerRadius = hasRoundedCorners ? cornerRadiusValue : 0 + backgroundColor = unCheckedBackgroundColor ?? .white } public func setupView() { isUserInteractionEnabled = true translatesAutoresizingMaskIntoConstraints = false - backgroundColor = .white layer.borderWidth = 1 layer.borderColor = UIColor.black.cgColor } @@ -145,15 +161,13 @@ import MVMCore isSelected.toggle() actionBlock?() - drawCheck() } - + open override func sendActions(for controlEvents: UIControl.Event) { super.sendActions(for: controlEvents) isSelected.toggle() actionBlock?() - drawCheck() } //-------------------------------------------------- @@ -163,7 +177,7 @@ import MVMCore private func drawCheck() { if shapeLayer == nil { - + let shapeLayer = CAShapeLayer() self.shapeLayer = shapeLayer shapeLayer.frame = bounds @@ -173,7 +187,7 @@ import MVMCore shapeLayer.path = checkMarkBezierPath.cgPath shapeLayer.lineJoin = .bevel shapeLayer.lineWidth = lineWidth - + CATransaction.withDisabledAnimations { shapeLayer.strokeEnd = 0.0 } @@ -181,6 +195,9 @@ import MVMCore } /* + !!! -- DO NOT REMOVE -- !!! + (Unless Design changes the appearance of the checkmark). + // Offsets based on the 124x124 example checkmark let startXOffset: Float = 42.0 / 124.0 ~~ 0.33871 let startYOffset: Float = 66.0 / 124.0 ~~ 0.53225 @@ -208,17 +225,17 @@ import MVMCore return path } - + public func updateSelection(_ selected: Bool, animated: Bool) { -// shapeLayer?.removeFromSuperlayer() -// shapeLayer = nil + // shapeLayer?.removeFromSuperlayer() + // shapeLayer = nil DispatchQueue.main.async { self.isSelected = selected self.drawCheck() - + var layer: CAShapeLayer? if let presentation = self.shapeLayer?.presentation(), animated { layer = presentation @@ -268,19 +285,6 @@ import MVMCore return x < -faultTolerance || y < -faultTolerance || x > widthLimit || y > heightLimt } - // if checkbox.isSelected { - // UIView.animate(withDuration: 0.2, delay: 0.1, options: .curveEaseOut, animations: { - // self.checkbox.backgroundColor = self.checkedColor - // }) - // checkbox.updateCheckSelected(true, animated: animated) - // } else { - // UIView.animate(withDuration: 0.2, delay: 0.1, options: .curveEaseOut, animations: { - // self.checkbox.backgroundColor = self.unCheckedColor - // }) - // - // checkbox.updateCheckSelected(false, animated: animated) - // } - // if delegate && delegate.responds(to: #selector(formValidationProtocol)) && delegate.perform(#selector(formValidationProtocol)).responds(to: #selector(Unmanaged.formValidatorModel)) { // let formValidator = delegate.perform(#selector(formValidationProtocol)).perform(#selector(Unmanaged.formValidatorModel)) as? FormValidator // formValidator?.enableByValidation() @@ -288,7 +292,7 @@ import MVMCore /* - + - (void)setSelected:(BOOL)selected animated:(BOOL)animated runBlock:(BOOL)runBlock { [self addAccessibilityLabel:selected]; @@ -313,8 +317,8 @@ import MVMCore [formValidator enableByValidation]; } } - */ - + */ + //-------------------------------------------------- // MARK: - Molecular //-------------------------------------------------- @@ -360,9 +364,13 @@ import MVMCore unCheckedBackgroundColor = UIColor.mfGet(forHex: unCheckedColorHex) } -// if let actionMap = dictionary.optionalDictionaryForKey("actionMap") { -// actionBlock = { MVMCoreActionHandler.shared()?.handleAction(with: actionMap, additionalData: additionalData, delegateObject: delegateObject) } -// } + if let isRound = dictionary["isRound"] as? Bool { + hasRoundedCorners = isRound + } + + // if let actionMap = dictionary.optionalDictionaryForKey("actionMap") { + // actionBlock = { MVMCoreActionHandler.shared()?.handleAction(with: actionMap, additionalData: additionalData, delegateObject: delegateObject) } + // } } } diff --git a/MVMCoreUI/Atoms/Views/CheckboxWithLabelView.swift b/MVMCoreUI/Atoms/Views/CheckboxWithLabelView.swift index 94cd86e2..db551800 100644 --- a/MVMCoreUI/Atoms/Views/CheckboxWithLabelView.swift +++ b/MVMCoreUI/Atoms/Views/CheckboxWithLabelView.swift @@ -56,6 +56,7 @@ layoutMarginsGuide.bottomAnchor.constraint(greaterThanOrEqualTo: checkbox.bottomAnchor).isActive = true checkbox.leadingAnchor.constraint(equalTo: layoutMarginsGuide.leadingAnchor).isActive = true checkbox.centerYAnchor.constraint(equalTo: centerYAnchor).isActive = true + checkbox.checkedBackgroundColor = .yellow label.topAnchor.constraint(greaterThanOrEqualTo: layoutMarginsGuide.topAnchor).isActive = true layoutMarginsGuide.bottomAnchor.constraint(greaterThanOrEqualTo: label.bottomAnchor).isActive = true @@ -98,11 +99,6 @@ checkbox.unCheckedBackgroundColor = unCheckedColor label.attributedText = attributedText } - - public convenience init(isRoundedCheckbox: Bool) { - self.init(frame: .zero) - checkbox.hasRoundCorners = isRoundedCheckbox - } } // MARK: - Molecular