From 5b010275546b6428872ce76e894f9a4a74ca71a4 Mon Sep 17 00:00:00 2001 From: vasavk Date: Mon, 26 Feb 2024 14:54:15 +0530 Subject: [PATCH] Digital ACT191 story ONEAPP-6682 highlight text color, background color for character counter --- .../TextFields/TextArea/TextArea.swift | 51 +++++++++++++++---- 1 file changed, 41 insertions(+), 10 deletions(-) diff --git a/VDS/Components/TextFields/TextArea/TextArea.swift b/VDS/Components/TextFields/TextArea/TextArea.swift index 1a91a099..1ac1900d 100644 --- a/VDS/Components/TextFields/TextArea/TextArea.swift +++ b/VDS/Components/TextFields/TextArea/TextArea.swift @@ -87,6 +87,21 @@ open class TextArea: EntryFieldBase { $0.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forDisabled: false) }.eraseToAnyColorable() { didSet { setNeedsUpdate() } } + /// Color configuration for error icon. + internal var iconColorConfiguration = ControlColorConfiguration().with { + $0.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forState: .normal) + } + + /// Color configuration for character counter's highlight background color + internal var highlightBackgroundColor = ControlColorConfiguration().with { + $0.setSurfaceColors(VDSColor.backgroundPrimaryDark, VDSColor.backgroundPrimaryLight, forState: .normal) + } + + /// Color configuration for character counter's highlight text color + internal var highlightTextColor = ControlColorConfiguration().with { + $0.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOnlight, forState: .normal) + } + //-------------------------------------------------- // MARK: - Overrides //-------------------------------------------------- @@ -106,7 +121,6 @@ open class TextArea: EntryFieldBase { textViewHeightConstraint?.isActive = true backgroundColorConfiguration.setSurfaceColors(VDSColor.feedbackSuccessBackgroundOnlight, VDSColor.feedbackSuccessBackgroundOndark, forState: .success) borderColorConfiguration.setSurfaceColors(VDSColor.feedbackSuccessOnlight, VDSColor.feedbackSuccessOndark, forState: .success) - textView.delegate = self } @@ -151,13 +165,15 @@ open class TextArea: EntryFieldBase { } icon.size = .medium + icon.color = iconColorConfiguration.getColor(self) containerView.layer.borderColor = readOnly ? readOnlyBorderColorConfiguration.getColor(self).cgColor : borderColorConfiguration.getColor(self).cgColor textView.isEditable = readOnly ? false : true textView.backgroundColor = backgroundColorConfiguration.getColor(self) characterCounterLabel.textColorConfiguration = primaryColorConfiguration.eraseToAnyColorable() + textView.tintColor = iconColorConfiguration.getColor(self) } - /// Container for the area which shows helper text, error text, character count, max length value. + /// Container for the area showing helper text, error text, character count, maximum length value. open override func getBottomContainer() -> UIView { bottomView.addSubview(bottomStackView) bottomStackView.pinToSuperView() @@ -182,6 +198,15 @@ open class TextArea: EntryFieldBase { return ("\(countStr)" + "/" + "\(maxLength ?? 0)") } } + + open func highlightCharacterOverflow() { + let count = textView.text.count + print("count: \(count), maxLength: \(maxLength ?? 0)") + guard let text = textView.attributedText?.mutableCopy() as? NSMutableAttributedString else { return } + text.addAttribute(NSAttributedString.Key.backgroundColor, value: highlightBackgroundColor.getColor(self), range: NSRange(location:(maxLength ?? 0 ), length: (count - (maxLength ?? 0)))) + text.addAttribute(NSAttributedString.Key.foregroundColor, value: highlightTextColor.getColor(self), range: NSRange(location:(maxLength ?? 0 ), length: (count - (maxLength ?? 0)))) + textView.attributedText = text.copy() as? NSAttributedString + } } extension TextArea: UITextViewDelegate { @@ -189,29 +214,35 @@ extension TextArea: UITextViewDelegate { // MARK: - UITextViewDelegate //-------------------------------------------------- public func textViewDidChange(_ textView: UITextView) { - + //dynamic textView Height sizing based on Figma //if you want it to work "as-is" delete this code //since it will autogrow with the current settings if let textViewHeightConstraint, textView.isEditable { let height = textView.contentSize.height - if height > 88 && height < 176 { - textViewHeightConstraint.constant = 176 - } else if height > 176 { - textViewHeightConstraint.constant = 352 - } else { - textViewHeightConstraint.constant = 88 - } + if height > 88 && height < 176 { + textViewHeightConstraint.constant = 176 + } else if height > 176 { + textViewHeightConstraint.constant = 352 + } else { + textViewHeightConstraint.constant = 88 + } textViewHeightConstraint.isActive = true } + //The exceeding characters will be highlighted to help users correct their entry. if ((maxLength ?? 0) > 0) { if textView.text.count <= allowCharCount { //setting the value and firing control event value = textView.text sendActions(for: .valueChanged) + + if (textView.text.count > (maxLength ?? 0)) { + highlightCharacterOverflow() + } } else { textView.text.removeLast() + highlightCharacterOverflow() } } else { //setting the value and firing control event