refactored the layout for the entryfield

Signed-off-by: Matt Bruce <matt.bruce@verizon.com>
This commit is contained in:
Matt Bruce 2024-05-10 09:00:55 -05:00
parent 7ec0192945
commit 501dc4a55f
4 changed files with 32 additions and 31 deletions

View File

@ -109,7 +109,7 @@ open class DropdownSelect: EntryFieldBase {
$0.axis = .horizontal
$0.spacing = VDSFormControls.spaceInset
}
controlContainerView.addSubview(controlStackView)
fieldContainerView.addSubview(controlStackView)
controlStackView.pinToSuperView()
controlStackView.addArrangedSubview(dropdownField)
@ -249,7 +249,7 @@ open class DropdownSelect: EntryFieldBase {
open override func updateAccessibility() {
super.updateAccessibility()
var selectedOption = selectedOptionLabel.text ?? ""
let selectedOption = selectedOptionLabel.text ?? ""
containerStackView.accessibilityLabel = "Dropdown Select, \(selectedOption) \(isReadOnly ? ", read only" : "")"
containerStackView.accessibilityHint = isReadOnly || !isEnabled ? "" : "Double tap to open."
}

View File

@ -40,6 +40,19 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
//--------------------------------------------------
// MARK: - Private Properties
//--------------------------------------------------
///This is the stackView that is the first subView of the EntryFieldBase, that will
///layout the following hierarchy
///
///- primaryStackView (vertical)
///---- titleLabel
///---- containerView (has the border for the user to interact with.
///------ containerHorizontal
///--------- fieldContainerView (subclass implements, ie UITextField, UITextView, etc...)
///--------- statusIcon (error, succes, or overridden by dev)
///---- UIView (getBottomContainer)
///------ bottomContainerStackView (vertical)
///------- errorLabel
///--------helpLabel
internal var stackView: UIStackView = {
return UIStackView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
@ -63,13 +76,7 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
}
}()
internal var controlContainerView: UIView = {
return UIView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
}
}()
internal var bottomContainerView: UIView = {
internal var fieldContainerView: UIView = {
return UIView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
}
@ -229,18 +236,15 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
containerStackView.pinToSuperView(.uniform(VDSLayout.space3X))
//add the view to add input fields
containerStackView.addArrangedSubview(controlContainerView)
containerStackView.addArrangedSubview(fieldContainerView)
containerStackView.addArrangedSubview(statusIcon)
containerStackView.setCustomSpacing(VDSLayout.space3X, after: controlContainerView)
containerStackView.setCustomSpacing(VDSLayout.space3X, after: fieldContainerView)
//get the container this is what show helper text, error text
//can include other for character count, max length
let bottomContainer = getBottomContainer()
//add bottomContainerStackView
//this is the vertical stack that contains error text, helper text
bottomContainerView.addSubview(bottomContainerStackView)
bottomContainerStackView.pinToSuperView()
bottomContainerStackView.addArrangedSubview(errorLabel)
bottomContainerStackView.addArrangedSubview(helperLabel)
@ -324,7 +328,7 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
/// Container for the area in which helper or error text presents.
open func getBottomContainer() -> UIView {
return bottomContainerView
return bottomContainerStackView
}
internal func updateRules() {

View File

@ -185,7 +185,7 @@ open class InputField: EntryFieldBase {
$0.axis = .horizontal
$0.spacing = VDSLayout.space3X
}
controlContainerView.addSubview(controlStackView)
fieldContainerView.addSubview(controlStackView)
controlStackView.pinToSuperView()
controlStackView.addArrangedSubview(leftImageView)

View File

@ -43,17 +43,7 @@ open class TextArea: EntryFieldBase {
$0.spacing = VDSLayout.space3X
}
}()
internal var bottomStackView: UIStackView = {
return UIStackView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
$0.axis = .horizontal
$0.distribution = .fill
$0.alignment = .top
$0.spacing = VDSLayout.space2X
}
}()
open var characterCounterLabel = Label().with {
$0.setContentCompressionResistancePriority(.required, for: .vertical)
$0.textStyle = .bodySmall
@ -164,7 +154,7 @@ open class TextArea: EntryFieldBase {
containerStackView.pinToSuperView(.uniform(VDSFormControls.spaceInset))
minWidthConstraint = containerView.widthAnchor.constraint(greaterThanOrEqualToConstant: containerSize.width)
minWidthConstraint?.isActive = true
controlContainerView.addSubview(textView)
fieldContainerView.addSubview(textView)
textView
.pinTop()
.pinLeading()
@ -254,9 +244,16 @@ open class TextArea: EntryFieldBase {
/// Container for the area showing helper text, error text, character count, maximum length value.
open override func getBottomContainer() -> UIView {
bottomStackView.addArrangedSubview(bottomContainerView)
bottomStackView.addArrangedSubview(characterCounterLabel)
return bottomStackView
let stackView = UIStackView().with {
$0.translatesAutoresizingMaskIntoConstraints = false
$0.axis = .horizontal
$0.distribution = .fill
$0.alignment = .top
$0.spacing = VDSLayout.space2X
}
stackView.addArrangedSubview(super.getBottomContainer())
stackView.addArrangedSubview(characterCounterLabel)
return stackView
}
/// Used to update any Accessibility properties.