diff --git a/VDS/Components/BadgeIndicator/BadgeIndicator.swift b/VDS/Components/BadgeIndicator/BadgeIndicator.swift index 69ca0264..a1d7fed1 100644 --- a/VDS/Components/BadgeIndicator/BadgeIndicator.swift +++ b/VDS/Components/BadgeIndicator/BadgeIndicator.swift @@ -89,6 +89,21 @@ open class BadgeIndicator: View { letterSpacing: letterSpacing) } + public var edgeInset: UIEdgeInsets { + var horizontalPadding: CGFloat = VDSLayout.Spacing.space1X.value + let verticalPadding: CGFloat = 0 + + switch self { + case .xxlarge: + horizontalPadding = VDSLayout.Spacing.space2X.value + case .xlarge, .large,.medium: + horizontalPadding = 6.0 + case .small: + break + } + return .init(top: verticalPadding, left: horizontalPadding, bottom: verticalPadding, right: horizontalPadding) + } + } //-------------------------------------------------- @@ -149,12 +164,17 @@ open class BadgeIndicator: View { open var width: CGFloat? { didSet { setNeedsUpdate() }} open var height: CGFloat? { didSet { setNeedsUpdate() }} - + + //-------------------------------------------------- + // MARK: - Private Properties + //-------------------------------------------------- + private let borderWidth: CGFloat = 1.0 + //-------------------------------------------------- // MARK: - Constraints //-------------------------------------------------- - private let layoutGuide = UILayoutGuide() - private var defaultBadgeSize: CGFloat { max(16.0, size.textStyle.font.lineHeight) } + private let badgeView = View() + private var badgeSize: CGFloat { max(16.0, size.textStyle.font.lineHeight) } private var widthConstraint: NSLayoutConstraint? private var heightConstraint: NSLayoutConstraint? private var labelContraints = NSLayoutConstraint.Container() @@ -166,28 +186,29 @@ open class BadgeIndicator: View { open override func setup() { super.setup() - addLayoutGuide(layoutGuide) - addSubview(label) + addSubview(badgeView) + badgeView.addSubview(label) accessibilityElements = [label] - heightConstraint = layoutGuide.heightAnchor.constraint(greaterThanOrEqualToConstant: defaultBadgeSize) + heightConstraint = badgeView.heightAnchor.constraint(greaterThanOrEqualToConstant: badgeSize) heightConstraint?.isActive = true - widthConstraint = layoutGuide.widthAnchor.constraint(greaterThanOrEqualToConstant: defaultBadgeSize) + widthConstraint = badgeView.widthAnchor.constraint(greaterThanOrEqualToConstant: badgeSize) widthConstraint?.isActive = true + //we are insetting the padding to compensate for the border NSLayoutConstraint.activate([ - layoutGuide.topAnchor.constraint(equalTo: topAnchor, constant: 1), - layoutGuide.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -1), - layoutGuide.leadingAnchor.constraint(equalTo: leadingAnchor, constant: 1), - layoutGuide.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -1)]) + badgeView.topAnchor.constraint(equalTo: topAnchor, constant: borderWidth), + badgeView.bottomAnchor.constraint(equalTo: bottomAnchor, constant: -borderWidth), + badgeView.leadingAnchor.constraint(equalTo: leadingAnchor, constant: borderWidth), + badgeView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -borderWidth)]) - labelContraints.topConstraint = label.pinTopGreaterThanOrEqualTo(anchor: layoutGuide.topAnchor) - labelContraints.bottomConstraint = label.pinBottomGreaterThanOrEqualTo(anchor: layoutGuide.bottomAnchor) - labelContraints.leadingConstraint = label.pinLeadingGreaterThanOrEqualTo(anchor: layoutGuide.leadingAnchor) - labelContraints.trailingConstraint = label.pinTrailingGreaterThanOrEqualTo(anchor: layoutGuide.trailingAnchor) - label.centerXAnchor.constraint(equalTo: layoutGuide.centerXAnchor).isActive = true - label.centerYAnchor.constraint(equalTo: layoutGuide.centerYAnchor).isActive = true + labelContraints.topConstraint = label.pinTopGreaterThanOrEqualTo(anchor: badgeView.topAnchor) + labelContraints.bottomConstraint = label.pinBottomGreaterThanOrEqualTo(anchor: badgeView.bottomAnchor) + labelContraints.leadingConstraint = label.pinLeadingGreaterThanOrEqualTo(anchor: badgeView.leadingAnchor) + labelContraints.trailingConstraint = label.pinTrailingGreaterThanOrEqualTo(anchor: badgeView.trailingAnchor) + label.centerXAnchor.constraint(equalTo: badgeView.centerXAnchor).isActive = true + label.centerYAnchor.constraint(equalTo: badgeView.centerYAnchor).isActive = true labelContraints.isActive = true } @@ -203,20 +224,18 @@ open class BadgeIndicator: View { shouldUpdateView = true setNeedsUpdate() } - - private let defaultInset = VDSLayout.Spacing.space1X.value - - private var labelEdgeInset: UIEdgeInsets { + private var labelEdgeInset: UIEdgeInsets { + var newInset = size.edgeInset if let verticalPadding, let horitonalPadding { - return .init(top: verticalPadding, left: horitonalPadding, bottom: verticalPadding, right: horitonalPadding) + newInset = .init(top: verticalPadding, left: horitonalPadding, bottom: verticalPadding, right: horitonalPadding) } else if let verticalPadding { - return .init(top: verticalPadding, left: defaultInset, bottom: verticalPadding, right: defaultInset) + newInset = .init(top: verticalPadding, left: newInset.left, bottom: verticalPadding, right: newInset.right) } else if let horitonalPadding { - return .init(top: defaultInset, left: horitonalPadding, bottom: defaultInset, right: horitonalPadding) - } else { - return .init(top: 0, left: defaultInset, bottom: 0, right: defaultInset) + newInset = .init(top: newInset.top, left: horitonalPadding, bottom: newInset.bottom, right: horitonalPadding) } + + return newInset } //-------------------------------------------------- @@ -265,17 +284,17 @@ open class BadgeIndicator: View { open override func updateView() { updateTextColorConfig() - backgroundColor = backgroundColorConfiguration.getColor(self) + badgeView.backgroundColor = backgroundColorConfiguration.getColor(self) //height width heightConstraint?.isActive = false widthConstraint?.isActive = false - if let width, let height { - heightConstraint = layoutGuide.heightAnchor.constraint(equalToConstant: height) - widthConstraint = layoutGuide.widthAnchor.constraint(equalToConstant: width) + if let width, let height, height > badgeSize, width > badgeSize, height <= width { + heightConstraint = badgeView.heightAnchor.constraint(equalToConstant: height) + widthConstraint = badgeView.widthAnchor.constraint(equalToConstant: width) } else { - heightConstraint = layoutGuide.heightAnchor.constraint(greaterThanOrEqualToConstant: defaultBadgeSize) - widthConstraint = layoutGuide.widthAnchor.constraint(greaterThanOrEqualToConstant: defaultBadgeSize) + heightConstraint = badgeView.heightAnchor.constraint(greaterThanOrEqualToConstant: badgeSize) + widthConstraint = badgeView.widthAnchor.constraint(greaterThanOrEqualToConstant: badgeSize) } heightConstraint?.isActive = true widthConstraint?.isActive = true @@ -329,32 +348,42 @@ open class BadgeIndicator: View { open override func layoutSubviews() { super.layoutSubviews() - layer.cornerRadius = frame.size.height / 2 + //update the cornerRadius + badgeView.layer.cornerRadius = badgeView.frame.size.height / 2 + layer.cornerRadius = frame.size.height / 2 + + //border if hideBorder { layer.borderWidth = 0 } else { + layer.borderWidth = borderWidth layer.borderColor = borderColorConfiguration.getColor(surface).cgColor - layer.borderWidth = 1 } - layer.remove(layerName: "dot") + //dot + badgeView.layer.remove(layerName: "dot") if kind == .simple && !hideDot { - var dot: CGFloat = bounds.width * 0.1875 - if let dotSize { + //frame for the dot to sit inside + let frame = badgeView.frame + + //default calculation if a dotSize isn't given + var dot: CGFloat = frame.width * 0.1875 + if let dotSize, dotSize < frame.width, dotSize < frame.height { dot = dotSize } + + //get the center of the frame + let centerX = (frame.width - dot) / 2.0 + let centerY = (frame.height - dot) / 2.0 + + //create the layer to draw the dot let dotLayer = CAShapeLayer() dotLayer.name = "dot" - - let centerX = (bounds.width - dot) / 2.0 - let centerY = (bounds.height - dot) / 2.0 - dotLayer.frame = .init(x: centerX, y: centerY, width: dot, height: dot) dotLayer.path = UIBezierPath(ovalIn: .init(origin: .zero, size: .init(width: dot, height: dot))).cgPath dotLayer.fillColor = textColorConfiguration.getColor(self).cgColor - layer.addSublayer(dotLayer) + badgeView.layer.addSublayer(dotLayer) } } } - diff --git a/VDS/SupportingFiles/ReleaseNotes.txt b/VDS/SupportingFiles/ReleaseNotes.txt index 858ac541..b983e954 100644 --- a/VDS/SupportingFiles/ReleaseNotes.txt +++ b/VDS/SupportingFiles/ReleaseNotes.txt @@ -1,4 +1,8 @@ -1.0.23 +1.0.25 +======= +- Added Size, Width, Height, Horizontal/Vertical Padding + more to Badge Indicator + +1.0.24 ======= - Added Badge Indicator - Refactored the TextStyle system to support Badge Indicator