mbrucedogs/vds_ios
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Digital ACT-191 ONEAPP-7135 story: Inline Text label alignment changes

Browse Source
This commit is contained in:
vasavk 2024-04-05 12:44:11 +05:30
parent 149fda901d
commit 791bfc8870
1 changed files with 13 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
VDS/Components/DropdownSelect/DropdownSelect.swift
View File

@ -125,6 +125,7 @@ open class DropdownSelect: Control {
private var inlineDisplayLabel = Label().with { private var inlineDisplayLabel = Label().with {
$0.textAlignment = .left $0.textAlignment = .left
$0.textStyle = .boldBodyLarge $0.textStyle = .boldBodyLarge
$0.lineBreakMode = .byCharWrapping
$0.sizeToFit() $0.sizeToFit()
} }
@ -157,15 +158,13 @@ open class DropdownSelect: Control {
//-------------------------------------------------- //--------------------------------------------------
// MARK: - Constraints // MARK: - Constraints
//-------------------------------------------------- //--------------------------------------------------
internal var widthConstraint: NSLayoutConstraint?
internal var inlineWidthConstraint: NSLayoutConstraint? internal var inlineWidthConstraint: NSLayoutConstraint?
//-------------------------------------------------- //--------------------------------------------------
// MARK: - Configuration Properties // MARK: - Configuration Properties
//-------------------------------------------------- //--------------------------------------------------
internal var containerSize: CGSize { CGSize(width: minWidthDefault, height: 44) } internal var containerSize: CGSize { CGSize(width: inlineLabel ? minWidthDefault : minWidthInlineLabel, height: 44) }
/// Color configuration for error icon.
internal let primaryColorConfig = ViewColorConfiguration().with { internal let primaryColorConfig = ViewColorConfiguration().with {
$0.setSurfaceColors(VDSColor.interactiveDisabledOnlight, VDSColor.interactiveDisabledOndark, forDisabled: true) $0.setSurfaceColors(VDSColor.interactiveDisabledOnlight, VDSColor.interactiveDisabledOndark, forDisabled: true)
$0.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forDisabled: false) $0.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark, forDisabled: false)
@ -217,6 +216,7 @@ open class DropdownSelect: Control {
// stackview // stackview
addSubview(stackView) addSubview(stackView)
stackView.pinToSuperView()
stackView.heightAnchor.constraint(greaterThanOrEqualToConstant: containerSize.height).isActive = true stackView.heightAnchor.constraint(greaterThanOrEqualToConstant: containerSize.height).isActive = true
// container stack // container stack
@ -233,6 +233,8 @@ open class DropdownSelect: Control {
containerStack.setCustomSpacing(VDSLayout.Spacing.space1X.value, after: inlineDisplayLabel) containerStack.setCustomSpacing(VDSLayout.Spacing.space1X.value, after: inlineDisplayLabel)
containerStack.setCustomSpacing(VDSLayout.Spacing.space3X.value, after: selectedOptionLabel) containerStack.setCustomSpacing(VDSLayout.Spacing.space3X.value, after: selectedOptionLabel)
dropdownField.width(0) dropdownField.width(0)
inlineWidthConstraint = inlineDisplayLabel.widthAnchor.constraint(greaterThanOrEqualToConstant: 0)
inlineWidthConstraint?.isActive = true
// component stackview subviews // component stackview subviews
stackView.addArrangedSubview(eyebrowLabel) stackView.addArrangedSubview(eyebrowLabel)
@ -244,13 +246,7 @@ open class DropdownSelect: Control {
stackView.setCustomSpacing(8, after: container) stackView.setCustomSpacing(8, after: container)
stackView.setCustomSpacing(8, after: errorLabel) stackView.setCustomSpacing(8, after: errorLabel)
stackView.pinToSuperView() // setting color config
inlineWidthConstraint = inlineDisplayLabel.widthAnchor.constraint(equalToConstant: 0)
inlineWidthConstraint?.isActive = true
widthConstraint = stackView.widthAnchor.constraint(greaterThanOrEqualToConstant: minWidthDefault)
widthConstraint?.isActive = true
eyebrowLabel.textColorConfiguration = primaryColorConfig.eraseToAnyColorable() eyebrowLabel.textColorConfiguration = primaryColorConfig.eraseToAnyColorable()
errorLabel.textColorConfiguration = primaryColorConfig.eraseToAnyColorable() errorLabel.textColorConfiguration = primaryColorConfig.eraseToAnyColorable()
helperLabel.textColorConfiguration = secondaryColorConfig.eraseToAnyColorable() helperLabel.textColorConfiguration = secondaryColorConfig.eraseToAnyColorable()
@ -258,6 +254,7 @@ open class DropdownSelect: Control {
selectedOptionLabel.textColorConfiguration = primaryColorConfig.eraseToAnyColorable() selectedOptionLabel.textColorConfiguration = primaryColorConfig.eraseToAnyColorable()
icon.color = iconColorConfig.getColor(self) icon.color = iconColorConfig.getColor(self)
// Options PickerView
optionsPicker.delegate = self optionsPicker.delegate = self
optionsPicker.dataSource = self optionsPicker.dataSource = self
optionsPicker.isHidden = true optionsPicker.isHidden = true
@ -361,6 +358,8 @@ open class DropdownSelect: Control {
open func updateInlineLabel() { open func updateInlineLabel() {
inlineWidthConstraint?.isActive = false
/// inline label text and selected option text separated by ':' /// inline label text and selected option text separated by ':'
if let label, !label.isEmpty { if let label, !label.isEmpty {
inlineDisplayLabel.text = inlineLabel ? (label + ":") : "" inlineDisplayLabel.text = inlineLabel ? (label + ":") : ""
@ -369,12 +368,9 @@ open class DropdownSelect: Control {
} }
inlineDisplayLabel.surface = surface inlineDisplayLabel.surface = surface
/// Minimum width with inline text as per design /// Update width as per updated text size
inlineWidthConstraint?.constant = inlineDisplayLabel.intrinsicContentSize.width inlineWidthConstraint = inlineDisplayLabel.widthAnchor.constraint(equalToConstant: inlineDisplayLabel.intrinsicContentSize.width)
inlineWidthConstraint?.isActive = !inlineLabel inlineWidthConstraint?.isActive = true
widthConstraint?.constant = inlineLabel ? minWidthInlineLabel : minWidthDefault
widthConstraint?.isActive = true
} }
open func updateSelectedOptionLabel(text: String? = nil) { open func updateSelectedOptionLabel(text: String? = nil) {