From 4adb378ce50d52bca5cef28d77f165f8517e735b Mon Sep 17 00:00:00 2001 From: Matt Bruce Date: Tue, 12 Sep 2023 16:33:40 -0500 Subject: [PATCH] CXTDT-427328 - Title Lockup text style combinations do not match spec Signed-off-by: Matt Bruce --- VDS/Components/TitleLockup/TitleLockup.swift | 98 ++++++++++---------- VDS/SupportingFiles/ReleaseNotes.txt | 1 + 2 files changed, 50 insertions(+), 49 deletions(-) diff --git a/VDS/Components/TitleLockup/TitleLockup.swift b/VDS/Components/TitleLockup/TitleLockup.swift index 2fdd5598..41a6cb70 100644 --- a/VDS/Components/TitleLockup/TitleLockup.swift +++ b/VDS/Components/TitleLockup/TitleLockup.swift @@ -29,7 +29,7 @@ open class TitleLockup: View { public required init?(coder: NSCoder) { super.init(coder: coder) } - + //-------------------------------------------------- // MARK: - Enums //-------------------------------------------------- @@ -43,12 +43,6 @@ open class TitleLockup: View { //-------------------------------------------------- // MARK: - Private Properties //-------------------------------------------------- - private var stackView = UIStackView().with { - $0.translatesAutoresizingMaskIntoConstraints = false - $0.axis = .vertical - $0.distribution = .fillProportionally - } - private var otherStandardStyle: OtherStandardStyle { if let subTitleModel, !subTitleModel.text.isEmpty { return subTitleModel.standardStyle @@ -75,7 +69,7 @@ open class TitleLockup: View { open var eyebrowLabel = Label().with { $0.setContentCompressionResistancePriority(.required, for: .vertical) } - + /// Model used in rendering the eyebrow label. open var eyebrowModel: EyebrowModel? { didSet { setNeedsUpdate() } } @@ -84,7 +78,7 @@ open class TitleLockup: View { open var titleLabel = Label().with { $0.setContentCompressionResistancePriority(.required, for: .vertical) } - + /// Model used in rendering the title label. open var titleModel: TitleModel? { didSet { setNeedsUpdate() } } @@ -93,7 +87,7 @@ open class TitleLockup: View { open var subTitleLabel = Label().with { $0.setContentCompressionResistancePriority(.required, for: .vertical) } - + /// Model used in rendering the subtitle label. open var subTitleModel: SubTitleModel? { didSet { setNeedsUpdate() } } @@ -273,22 +267,8 @@ open class TitleLockup: View { super.setup() titleLabel.textColorConfiguration = textColorPrimaryConfiguration - + accessibilityElements = [eyebrowLabel, titleLabel, subTitleLabel] - addSubview(stackView) - - stackView.spacing = 0.0 - - stackView.addArrangedSubview(eyebrowLabel) - stackView.addArrangedSubview(titleLabel) - stackView.addArrangedSubview(subTitleLabel) - - //pin stackview to edges - stackView - .pinTop() - .pinLeading() - .pinTrailing() - .pinBottom(0, .defaultHigh) } /// Resets to default settings. @@ -302,15 +282,18 @@ open class TitleLockup: View { setNeedsUpdate() } + var labelViews = [UIView]() /// Used to make changes to the View based off a change events or from local properties. open override func updateView() { super.updateView() - let allLabelsTextAlignment = textAlignment.value.value - var eyebrowTextIsEmpty = true - var titleTextIsEmpty = true - var subTitleTextIsEmpty = true + //remove all labels + eyebrowLabel.removeFromSuperview() + titleLabel.removeFromSuperview() + subTitleLabel.removeFromSuperview() + //set local vars + let allLabelsTextAlignment = textAlignment.value.value var topSpacing: CGFloat = 0.0 var bottomSpacing: CGFloat = 0.0 @@ -321,8 +304,12 @@ open class TitleLockup: View { bottomSpacing = config.bottomSpacing } + //set a previousView to keep track of the stack + //to deal with anchoring/spacing + var previousView: UIView? + + //see if the eyebrow should exist if let eyebrowModel, !eyebrowModel.text.isEmpty { - eyebrowTextIsEmpty = false eyebrowLabel.textAlignment = allLabelsTextAlignment eyebrowLabel.text = eyebrowModel.text eyebrowLabel.attributes = eyebrowModel.textAttributes @@ -345,20 +332,35 @@ open class TitleLockup: View { eyebrowLabel.textColorConfiguration = textColorPrimaryConfiguration eyebrowLabel.textStyle = eyebrowModel.isBold ? otherStandardStyle.value.bold : otherStandardStyle.value.regular } + addSubview(eyebrowLabel) + eyebrowLabel + .pinTop() + .pinLeading() + .pinTrailing() + + previousView = eyebrowLabel } + //see if the title should exist if let titleModel, !titleModel.text.isEmpty { - titleTextIsEmpty = false titleLabel.textAlignment = allLabelsTextAlignment titleLabel.textStyle = titleModel.textStyle titleLabel.text = titleModel.text titleLabel.attributes = titleModel.textAttributes titleLabel.numberOfLines = titleModel.numberOfLines titleLabel.surface = surface + + addSubview(titleLabel) + titleLabel + .pinTop(previousView?.bottomAnchor ?? self.topAnchor, eyebrowLabel == previousView ? topSpacing : 0) + .pinLeading() + .pinTrailing() + + previousView = titleLabel } + //see if the subtitle should exist if let subTitleModel, !subTitleModel.text.isEmpty { - subTitleTextIsEmpty = false subTitleLabel.textAlignment = allLabelsTextAlignment subTitleLabel.textStyle = otherStandardStyle.value.regular subTitleLabel.textColorConfiguration = subTitleModel.textColor == .secondary ? textColorSecondaryConfiguration : textColorPrimaryConfiguration @@ -366,25 +368,23 @@ open class TitleLockup: View { subTitleLabel.attributes = subTitleModel.textAttributes subTitleLabel.numberOfLines = subTitleModel.numberOfLines subTitleLabel.surface = surface + + addSubview(subTitleLabel) + subTitleLabel + .pinTop(previousView?.bottomAnchor ?? self.topAnchor, (eyebrowLabel == previousView || titleLabel == previousView) ? bottomSpacing : 0) + .pinLeading() + .pinTrailing() + + previousView = subTitleLabel } - //if both first 2 rows not empty set spacing - if !eyebrowTextIsEmpty && !titleTextIsEmpty { - stackView.spacing = topSpacing - } else { - stackView.spacing = 0.0 - } + //pin the last view to the bottom of this view + previousView?.pinBottom() - //if either first 2 rows not empty and subtile not empty, create space else collapse - if (!eyebrowTextIsEmpty || !titleTextIsEmpty) && !subTitleTextIsEmpty { - stackView.setCustomSpacing(bottomSpacing, after: titleLabel) - } else if (!eyebrowTextIsEmpty || !titleTextIsEmpty) && subTitleTextIsEmpty { - stackView.setCustomSpacing(0.0, after: titleLabel) - } - - //hide/show - eyebrowLabel.isHidden = eyebrowTextIsEmpty - titleLabel.isHidden = titleTextIsEmpty - subTitleLabel.isHidden = subTitleTextIsEmpty + //debugging for borders + eyebrowLabel.debugBorder(show: hasDebugBorder, color: .green) + titleLabel.debugBorder(show: hasDebugBorder, color: .green) + subTitleLabel .debugBorder(show: hasDebugBorder, color: .green) } + } diff --git a/VDS/SupportingFiles/ReleaseNotes.txt b/VDS/SupportingFiles/ReleaseNotes.txt index bbdeb8ee..6dae1502 100644 --- a/VDS/SupportingFiles/ReleaseNotes.txt +++ b/VDS/SupportingFiles/ReleaseNotes.txt @@ -1,6 +1,7 @@ 1.0.42 ======= - CXTDT-462698 - Tabs - Incorrect letter spacing on Large tabs +- CXTDT-427328 - Title Lockup text style combinations do not match spec 1.0.41 =======