added TitleLockup
Signed-off-by: Matt Bruce <matt.bruce@verizon.com>
This commit is contained in:
parent
fcf0b524b2
commit
2630dc43bf
@ -42,6 +42,7 @@
|
||||
EA4DB30228DCBCA500103EE3 /* Badge.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA4DB30128DCBCA500103EE3 /* Badge.swift */; };
|
||||
EA5E304C294CBDD00082B959 /* TileContainer.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA5E304B294CBDD00082B959 /* TileContainer.swift */; };
|
||||
EA5E304E294CC7F00082B959 /* VDSColor.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA5E304D294CC7F00082B959 /* VDSColor.swift */; };
|
||||
EA5E30532950DDA60082B959 /* TitleLockup.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA5E30522950DDA60082B959 /* TitleLockup.swift */; };
|
||||
EA89200228AECF2A006B9984 /* UIButton+Publisher.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA89200128AECF2A006B9984 /* UIButton+Publisher.swift */; };
|
||||
EA89200428AECF4B006B9984 /* UITextField+Publisher.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA89200328AECF4B006B9984 /* UITextField+Publisher.swift */; };
|
||||
EA89200628B526D6006B9984 /* CheckboxGroup.swift in Sources */ = {isa = PBXBuildFile; fileRef = EA89200528B526D6006B9984 /* CheckboxGroup.swift */; };
|
||||
@ -139,6 +140,7 @@
|
||||
EA4DB30128DCBCA500103EE3 /* Badge.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = Badge.swift; sourceTree = "<group>"; };
|
||||
EA5E304B294CBDD00082B959 /* TileContainer.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TileContainer.swift; sourceTree = "<group>"; };
|
||||
EA5E304D294CC7F00082B959 /* VDSColor.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = VDSColor.swift; sourceTree = "<group>"; };
|
||||
EA5E30522950DDA60082B959 /* TitleLockup.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TitleLockup.swift; sourceTree = "<group>"; };
|
||||
EA89200128AECF2A006B9984 /* UIButton+Publisher.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "UIButton+Publisher.swift"; sourceTree = "<group>"; };
|
||||
EA89200328AECF4B006B9984 /* UITextField+Publisher.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = "UITextField+Publisher.swift"; sourceTree = "<group>"; };
|
||||
EA89200528B526D6006B9984 /* CheckboxGroup.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CheckboxGroup.swift; sourceTree = "<group>"; };
|
||||
@ -318,6 +320,7 @@
|
||||
EA1F265F28B945070033E859 /* RadioSwatch */,
|
||||
EAC925852911C9DE00091998 /* TextFields */,
|
||||
EA5E304A294CBDBB0082B959 /* TileContainer */,
|
||||
EA5E30512950DD8D0082B959 /* TitleLockup */,
|
||||
EA3361A0288B1E6F0071C351 /* Toggle */,
|
||||
);
|
||||
path = Components;
|
||||
@ -444,6 +447,14 @@
|
||||
path = TileContainer;
|
||||
sourceTree = "<group>";
|
||||
};
|
||||
EA5E30512950DD8D0082B959 /* TitleLockup */ = {
|
||||
isa = PBXGroup;
|
||||
children = (
|
||||
EA5E30522950DDA60082B959 /* TitleLockup.swift */,
|
||||
);
|
||||
path = TitleLockup;
|
||||
sourceTree = "<group>";
|
||||
};
|
||||
EA89200B28B530F0006B9984 /* RadioBox */ = {
|
||||
isa = PBXGroup;
|
||||
children = (
|
||||
@ -716,6 +727,7 @@
|
||||
EAF7F0AB289B13FD00B287F5 /* TypographicalStyleLabelAttribute.swift in Sources */,
|
||||
EAB1D29C28A5618900DAE764 /* RadioButtonGroup.swift in Sources */,
|
||||
EA336171288B19200071C351 /* VDS.docc in Sources */,
|
||||
EA5E30532950DDA60082B959 /* TitleLockup.swift in Sources */,
|
||||
EAA5EEB528ECBFB4003B3210 /* ImageLabelAttribute.swift in Sources */,
|
||||
EAB5FF0129424ACB00998C17 /* UIControl.swift in Sources */,
|
||||
EAB1D2E628AE842000DAE764 /* Publisher+Bind.swift in Sources */,
|
||||
|
||||
204
VDS/Components/TitleLockup/TitleLockup.swift
Normal file
204
VDS/Components/TitleLockup/TitleLockup.swift
Normal file
@ -0,0 +1,204 @@
|
||||
//
|
||||
// TitleLockup.swift
|
||||
// VDS
|
||||
//
|
||||
// Created by Matt Bruce on 12/19/22.
|
||||
//
|
||||
|
||||
import Foundation
|
||||
import UIKit
|
||||
import VDSColorTokens
|
||||
import Combine
|
||||
|
||||
public enum TitleLockupTextPosition: String, Codable, CaseIterable {
|
||||
case left, center
|
||||
|
||||
var labelTextPosition: TextPosition {
|
||||
switch self {
|
||||
case .left:
|
||||
return .left
|
||||
case .center:
|
||||
return .center
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public enum TitleLockupitleTypographicalStyle: String, Codable, CaseIterable {
|
||||
case FeatureMedium
|
||||
case BoldFeatureMedium
|
||||
case FeatureSmall
|
||||
case BoldFeatureSmall
|
||||
case FeatureXSmall
|
||||
case BoldFeatureXSmall
|
||||
|
||||
case Title2XLarge
|
||||
case BoldTitle2XLarge
|
||||
case TitleXLarge
|
||||
case BoldTitleXLarge
|
||||
case TitleLarge
|
||||
case BoldTitleLarge
|
||||
case TitleMedium
|
||||
case BoldTitleMedium
|
||||
case TitleSmall
|
||||
case BoldTitleSmall
|
||||
|
||||
public var typographicalStyle: TypographicalStyle {
|
||||
return TypographicalStyle(rawValue: self.rawValue) ?? .BoldFeatureXSmall
|
||||
}
|
||||
}
|
||||
|
||||
public enum TitleLockupOtherTypographicalStyle: String, Codable, CaseIterable {
|
||||
case BodyLarge
|
||||
case BoldBodyLarge
|
||||
case BodyMedium
|
||||
case BoldBodyMedium
|
||||
case BodySmall
|
||||
case BoldBodySmall
|
||||
|
||||
public var typographicalStyle: TypographicalStyle {
|
||||
return TypographicalStyle(rawValue: self.rawValue) ?? .BodyLarge
|
||||
}
|
||||
}
|
||||
|
||||
@objc(VDSTitleLockup)
|
||||
open class TitleLockup: View {
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Initializers
|
||||
//--------------------------------------------------
|
||||
required public init() {
|
||||
super.init(frame: .zero)
|
||||
}
|
||||
|
||||
public override init(frame: CGRect) {
|
||||
super.init(frame: .zero)
|
||||
}
|
||||
|
||||
public required init?(coder: NSCoder) {
|
||||
super.init(coder: coder)
|
||||
}
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Private Properties
|
||||
//--------------------------------------------------
|
||||
private var stackView = UIStackView().with {
|
||||
$0.translatesAutoresizingMaskIntoConstraints = false
|
||||
$0.axis = .vertical
|
||||
$0.distribution = .fill
|
||||
}
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Configuration Properties
|
||||
//--------------------------------------------------
|
||||
// Sizes are from InVision design specs.
|
||||
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - Public Properties
|
||||
//--------------------------------------------------
|
||||
open var textPosition: TitleLockupTextPosition = .left { didSet { didChange() }}
|
||||
|
||||
//style
|
||||
open var titleTypograpicalStyle: TitleLockupitleTypographicalStyle = .BoldFeatureXSmall { didSet { didChange() }}
|
||||
open var otherTypograpicalStyle: TitleLockupOtherTypographicalStyle = .BodyLarge { didSet { didChange() }}
|
||||
|
||||
//first row
|
||||
open var eyebrowLabel = Label().with {
|
||||
$0.setContentCompressionResistancePriority(.required, for: .vertical)
|
||||
}
|
||||
open var eyebrowText: String = "" { didSet { didChange() }}
|
||||
open var eyebrowTextAttributes: [any LabelAttributeModel]? { didSet { didChange() }}
|
||||
|
||||
//second row
|
||||
open var titleLabel = Label().with {
|
||||
$0.setContentCompressionResistancePriority(.required, for: .vertical)
|
||||
}
|
||||
open var titleText: String = "" { didSet { didChange() }}
|
||||
open var titleTextAttributes: [any LabelAttributeModel]? { didSet { didChange() }}
|
||||
|
||||
//third row
|
||||
open var subTitleLabel = Label().with {
|
||||
$0.setContentCompressionResistancePriority(.required, for: .vertical)
|
||||
}
|
||||
open var subTitleText: String = "" { didSet { didChange() }}
|
||||
open var subTitleTextAttributes: [any LabelAttributeModel]? { didSet { didChange() }}
|
||||
open var subTitleColor: Use = .primary { didSet { didChange() }}
|
||||
//--------------------------------------------------
|
||||
// MARK: - Lifecycle
|
||||
//--------------------------------------------------
|
||||
open override func setup() {
|
||||
super.setup()
|
||||
|
||||
isAccessibilityElement = true
|
||||
accessibilityTraits = .button
|
||||
addSubview(stackView)
|
||||
|
||||
stackView.spacing = 0.0
|
||||
|
||||
stackView.addArrangedSubview(eyebrowLabel)
|
||||
stackView.addArrangedSubview(titleLabel)
|
||||
stackView.addArrangedSubview(subTitleLabel)
|
||||
|
||||
//pin stackview to edges
|
||||
stackView.pinToSuperView()
|
||||
}
|
||||
|
||||
public override func reset() {
|
||||
super.reset()
|
||||
titleLabel.reset()
|
||||
eyebrowLabel.reset()
|
||||
subTitleLabel.reset()
|
||||
|
||||
textPosition = .left
|
||||
|
||||
eyebrowText = ""
|
||||
titleText = ""
|
||||
subTitleText = ""
|
||||
|
||||
titleTypograpicalStyle = .BoldFeatureXSmall
|
||||
otherTypograpicalStyle = .BodyLarge
|
||||
|
||||
}
|
||||
|
||||
//--------------------------------------------------
|
||||
// MARK: - State
|
||||
//--------------------------------------------------
|
||||
open override func updateView() {
|
||||
super.updateView()
|
||||
|
||||
let allLabelsTextPosition = textPosition.labelTextPosition
|
||||
|
||||
eyebrowLabel.textPosition = allLabelsTextPosition
|
||||
eyebrowLabel.typograpicalStyle = otherTypograpicalStyle.typographicalStyle
|
||||
eyebrowLabel.text = eyebrowText
|
||||
eyebrowLabel.attributes = eyebrowTextAttributes
|
||||
eyebrowLabel.surface = surface
|
||||
|
||||
titleLabel.textPosition = allLabelsTextPosition
|
||||
titleLabel.typograpicalStyle = titleTypograpicalStyle.typographicalStyle
|
||||
titleLabel.text = titleText
|
||||
titleLabel.attributes = titleTextAttributes
|
||||
titleLabel.surface = surface
|
||||
|
||||
subTitleLabel.textPosition = allLabelsTextPosition
|
||||
subTitleLabel.typograpicalStyle = otherTypograpicalStyle.typographicalStyle
|
||||
subTitleLabel.text = subTitleText
|
||||
subTitleLabel.attributes = subTitleTextAttributes
|
||||
subTitleLabel.surface = surface
|
||||
subTitleLabel.disabled = subTitleColor == .secondary
|
||||
|
||||
//if both first 2 rows not empty set spacing
|
||||
if !eyebrowText.isEmpty && !titleText.isEmpty {
|
||||
stackView.spacing = 12.0
|
||||
} else {
|
||||
stackView.spacing = 0.0
|
||||
}
|
||||
|
||||
//if either first 2 rows not empty and subtile not empty, create space else collapse
|
||||
if (!eyebrowText.isEmpty || !titleText.isEmpty) && !subTitleText.isEmpty {
|
||||
stackView.setCustomSpacing(24.0, after: titleLabel)
|
||||
} else if (!eyebrowText.isEmpty || !titleText.isEmpty) && subTitleText.isEmpty {
|
||||
stackView.setCustomSpacing(0.0, after: titleLabel)
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user