diff --git a/MVMCoreUI/Atoms/Views/Checkbox.swift b/MVMCoreUI/Atoms/Views/Checkbox.swift index 6f308651..d139f130 100644 --- a/MVMCoreUI/Atoms/Views/Checkbox.swift +++ b/MVMCoreUI/Atoms/Views/Checkbox.swift @@ -8,22 +8,6 @@ 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 - let pivotXOffset: Float = 58.0 / 124.0 ~~ 0.46774 - let pivotYOffset: Float = 80.0 / 124.0 ~~ 0.64516 - let endXOffset: Float = 83.0 / 124.0 ~~ 0.66935 - let endYOffset: Float = 46.0 / 124.0 ~~ 0.37097 - let pivotPercentage: Float = 0.34 - let endPercentage = 1.0 - pivotPercentage - let animationInterval: Float = 0.01 - */ - /** This class expects its height and width to be equal. */ @@ -49,7 +33,7 @@ import MVMCore public var updateSelectionOnly: Bool = false /// The color of the background when checked. - public var checkedBackgroundColor: UIColor = .white { + public var checkedBackgroundColor: UIColor = .clear { didSet { if isSelected { backgroundColor = checkedBackgroundColor @@ -58,7 +42,7 @@ import MVMCore } /// The color of the background when unChecked. - public var unCheckedBackgroundColor: UIColor = .white { + public var unCheckedBackgroundColor: UIColor = .clear { didSet { if !isSelected { backgroundColor = unCheckedBackgroundColor @@ -91,11 +75,7 @@ import MVMCore /// Color of the check mark. public var checkColor: UIColor = .black { didSet { - if let shapeLayer = shapeLayer { - CATransaction.withDisabledAnimations { - shapeLayer.strokeColor = checkColor.cgColor - } - } + setShapeLayerStrokeColor(checkColor) } } @@ -135,6 +115,21 @@ import MVMCore } } + //-------------------------------------------------- + // MARK: - Constraints + //-------------------------------------------------- + + private var heightConstraint: NSLayoutConstraint? + private var widthConstraint: NSLayoutConstraint? + + /// Updates the height and width anchors of the Checkbox with the assigned value. + public var heigthWidthConstant: CGFloat = Checkbox.defaultHeightWidth { + didSet { + heightConstraint?.constant = heigthWidthConstant + widthConstraint?.constant = heigthWidthConstant + } + } + //-------------------------------------------------- // MARK: - Initializers //-------------------------------------------------- @@ -145,7 +140,6 @@ import MVMCore accessibilityTraits = .button accessibilityHint = MVMCoreUIUtility.hardcodedString(withKey: "checkbox_action_hint") updateAccessibilityLabel() - setupView() } @@ -182,7 +176,7 @@ import MVMCore override open func layoutSubviews() { super.layoutSubviews() - drawCheck() + drawShapeLayer() layer.cornerRadius = isRound ? cornerRadiusValue : 0 layer.borderWidth = borderWidth layer.borderColor = borderColor.cgColor @@ -190,9 +184,15 @@ import MVMCore open func setupView() { + guard constraints.isEmpty else { return } + isUserInteractionEnabled = true translatesAutoresizingMaskIntoConstraints = false - backgroundColor = .white + backgroundColor = .clear + + widthConstraint = widthAnchor.constraint(equalToConstant: Checkbox.defaultHeightWidth) + heightConstraint = heightAnchor.constraint(equalToConstant: Checkbox.defaultHeightWidth) + heightWidthIsActive(true) } //-------------------------------------------------- @@ -220,8 +220,8 @@ import MVMCore // MARK: - Methods //-------------------------------------------------- - /// Creates the check mark used for the checkbox. - private func drawCheck() { + /// Creates the check mark layer. + private func drawShapeLayer() { if shapeLayer == nil { @@ -241,13 +241,18 @@ import MVMCore } } - /// Returns a UIBezierPath detailing the path of a checkmark + /// - returns: The CGPath of a UIBezierPath detailing the path of a checkmark func checkMarkPath() -> CGPath { - let sideLength = max(bounds.size.height, bounds.size.width) - let startPoint = CGPoint(x: 0.33871 * sideLength, y: 0.53225 * sideLength) - let pivotOffSet = CGPoint(x: 0.46774 * sideLength, y: 0.64516 * sideLength) - let endOffset = CGPoint(x: 0.66935 * sideLength , y: 0.37097 * sideLength) + let length = max(bounds.size.height, bounds.size.width) + let xInsetLeft = length * 0.25 + let yInsetTop = length * 0.3 + let innerWidth = length - (xInsetLeft + length * 0.25) // + Right X Inset + let innerHeight = length - (yInsetTop + length * 0.35) // + Bottom Y Inset + + let startPoint = CGPoint(x: xInsetLeft, y: yInsetTop + (innerHeight / 2)) + let pivotOffSet = CGPoint(x: xInsetLeft + (innerWidth * 0.33), y: yInsetTop + innerHeight) + let endOffset = CGPoint(x: xInsetLeft + innerWidth, y: yInsetTop) let bezierPath = UIBezierPath() bezierPath.move(to: startPoint) @@ -267,14 +272,14 @@ import MVMCore self.updateSelectionOnly = true self.isSelected = selected self.updateSelectionOnly = false - self.drawCheck() + self.drawShapeLayer() self.shapeLayer?.removeAllAnimations() self.updateCheckboxUI(isSelected: selected, isAnimated: animated) } } /// updates the visuals of the check mark and background. - /// - parameter isSelection: the check state of the checkbox. + /// - parameter isSelected: the check state of the checkbox. /// - parameter isAnimated: determines of the changes should animate or immediately refelect. public func updateCheckboxUI(isSelected: Bool, isAnimated: Bool) { @@ -296,7 +301,7 @@ import MVMCore self.shapeLayer?.strokeEnd = isSelected ? 1 : 0 } - self.backgroundColor = isSelected ? self.checkedBackgroundColor : self.unCheckedBackgroundColor + backgroundColor = isSelected ? checkedBackgroundColor : unCheckedBackgroundColor } } @@ -308,6 +313,38 @@ import MVMCore } } + func isEnabled(_ enabled: Bool) { + + isUserInteractionEnabled = enabled + + if enabled { + layer.borderColor = borderColor.cgColor + backgroundColor = isSelected ? checkedBackgroundColor : unCheckedBackgroundColor + alpha = 1.0 + setShapeLayerStrokeColor(checkColor) + } else { + layer.borderColor = UIColor.mfSilver().cgColor + backgroundColor = .clear + alpha = DisableOppacity + setShapeLayerStrokeColor(UIColor.mfSilver()) + } + } + + private func setShapeLayerStrokeColor(_ color: UIColor) { + + if let shapeLayer = shapeLayer { + CATransaction.withDisabledAnimations { + shapeLayer.strokeColor = color.cgColor + } + } + } + + public func heightWidthIsActive(_ isActive: Bool) { + + heightConstraint?.isActive = isActive + widthConstraint?.isActive = isActive + } + //-------------------------------------------------- // MARK: - UITouch //-------------------------------------------------- @@ -343,10 +380,11 @@ import MVMCore open func reset() { + isEnabled(true) shapeLayer?.removeAllAnimations() shapeLayer?.removeFromSuperlayer() shapeLayer = nil - backgroundColor = nil + backgroundColor = .clear borderColor = .black borderWidth = 1.0 checkColor = .black @@ -413,6 +451,10 @@ import MVMCore self.isRound = isRound } + if let enabled = dictionary["isEnabled"] as? Bool { + isEnabled(enabled) + } + if let actionMap = dictionary.optionalDictionaryForKey("actionMap") { actionBlock = { MVMCoreActionHandler.shared()?.handleAction(with: actionMap, additionalData: additionalData, delegateObject: delegateObject) } }