From 12ad80643d0eec5076fa2eaba9462aea32765584 Mon Sep 17 00:00:00 2001 From: Vasavi Kanamarlapudi Date: Wed, 25 Sep 2024 18:15:27 +0530 Subject: [PATCH] Digital ACT-191 ONEAPP-10928 story: documentation changes for modal dialog --- VDS/Components/Modal/ModalDialog.swift | 51 ++++++++++++++++++-------- 1 file changed, 36 insertions(+), 15 deletions(-) diff --git a/VDS/Components/Modal/ModalDialog.swift b/VDS/Components/Modal/ModalDialog.swift index 7ac34ba8..96b99d31 100644 --- a/VDS/Components/Modal/ModalDialog.swift +++ b/VDS/Components/Modal/ModalDialog.swift @@ -78,11 +78,22 @@ open class ModalDialog: View, UIScrollViewDelegate, ParentViewProtocol { //-------------------------------------------------- // MARK: - Configuration //-------------------------------------------------- - private var fullWidth: CGFloat = 0.0 - private var minHeight: CGFloat = 232.0 //min content area height 136 //min window height 232 + // full width : viewport width + private var fullWidth: CGFloat = UIScreen.main.bounds.size.width + + // Min height content area 136 px. Total window height 232 px + private var minHeight: CGFloat = 232.0 + + // Max height content area. total window height: 70% of viewport height private var maxHeight: CGFloat = 0.0 + + // Min default width private var minWidth: CGFloat = 560.0 + + // Max width: 70% of viewport width private var maxWidth: CGFloat = 0.0 + + // close button with the 48 x 48 px private var closeCrossButtonSize = 48.0 private let containerViewInset = UIDevice.isIPad ? VDSLayout.space12X : VDSLayout.space4X @@ -90,9 +101,16 @@ open class ModalDialog: View, UIScrollViewDelegate, ParentViewProtocol { private let contentLabelBottomSpace = UIDevice.isIPad ? VDSLayout.space8X : VDSLayout.space12X private let gapBetweenButtonItems = VDSLayout.space3X + //-------------------------------------------------- + // MARK: - Configuration Properties + //-------------------------------------------------- + private let backgroundColorConfiguration = SurfaceColorConfiguration(VDSColor.backgroundPrimaryLight, VDSColor.backgroundPrimaryDark) private let closeButtonTextColorConfiguration = SurfaceColorConfiguration(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark) + //-------------------------------------------------- + // MARK: - Constraints + //-------------------------------------------------- private var contentStackViewBottomConstraint: NSLayoutConstraint? private var heightConstraint: NSLayoutConstraint? @@ -103,8 +121,6 @@ open class ModalDialog: View, UIScrollViewDelegate, ParentViewProtocol { open override func setup() { super.setup() - fullWidth = UIScreen.main.bounds.size.width - // Max Width: 70% of viewport width. // Maximum width is only applied to a provided width and not to the default. maxWidth = fullWidth * (70/100) @@ -116,18 +132,21 @@ open class ModalDialog: View, UIScrollViewDelegate, ParentViewProtocol { maxHeight = UIScreen.main.bounds.size.height * (70/100) titleLabel.accessibilityTraits = .header - layer.cornerRadius = 12 + + // Add titleLabel, contentLabel to contentStack. contentStackView.addArrangedSubview(titleLabel) contentStackView.addArrangedSubview(contentLabel) contentStackView.setCustomSpacing(contentLabelTopSpace, after: titleLabel) - scrollView.addSubview(contentStackView) + + // Add crossButon, scrollView, closeButton. addSubview(closeCrossButton) addSubview(scrollView) addSubview(closeButton) self.bringSubviewToFront(closeCrossButton) - let trailingSpace = UIDevice.isIPad ? containerViewInset/2 : containerViewInset + + let contentTrailingSpace = UIDevice.isIPad ? containerViewInset/2 : containerViewInset let crossTopSpace = UIDevice.isIPad ? 0 : VDSLayout.space12X let scrollTopSpace = UIDevice.isIPad ? containerViewInset : (crossTopSpace + closeCrossButtonSize) @@ -150,14 +169,14 @@ open class ModalDialog: View, UIScrollViewDelegate, ParentViewProtocol { // Constraints for the scrollView scrollView.topAnchor.constraint(equalTo: topAnchor, constant: scrollTopSpace), scrollView.leadingAnchor.constraint(equalTo: leadingAnchor, constant:containerViewInset), - scrollView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -(trailingSpace)), + scrollView.trailingAnchor.constraint(equalTo: trailingAnchor, constant: -(contentTrailingSpace)), scrollView.bottomAnchor.constraint(equalTo: closeButton.topAnchor, constant: -contentLabelBottomSpace), // Constraints for the contentStackView contentStackView.topAnchor.constraint(equalTo: scrollView.topAnchor), contentStackView.leadingAnchor.constraint(equalTo: scrollView.leadingAnchor), contentStackView.trailingAnchor.constraint(equalTo: scrollView.trailingAnchor), - contentStackView.widthAnchor.constraint(equalTo: scrollView.widthAnchor, constant: -trailingSpace), + contentStackView.widthAnchor.constraint(equalTo: scrollView.widthAnchor, constant: -contentTrailingSpace), contentStackView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor) ]) @@ -171,22 +190,23 @@ open class ModalDialog: View, UIScrollViewDelegate, ParentViewProtocol { open override func updateView() { super.updateView() + // Update surface and background backgroundColor = backgroundColorConfiguration.getColor(self) scrollView.indicatorStyle = surface == .light ? .black : .white - - contentStackView.arrangedSubviews.forEach { $0.removeFromSuperview() } - - titleLabel.surface = surface - contentLabel.surface = surface closeCrossButton.surface = surface closeButton.surface = surface + titleLabel.surface = surface + contentLabel.surface = surface + + // Re-arrange contentStack + contentStackView.arrangedSubviews.forEach { $0.removeFromSuperview() } titleLabel.text = modalModel.title contentLabel.text = modalModel.content - titleLabel.sizeToFit() contentLabel.sizeToFit() + // Update title, content and contentview var addedTitle = false if let titleText = modalModel.title, !titleText.isEmpty { @@ -211,6 +231,7 @@ open class ModalDialog: View, UIScrollViewDelegate, ParentViewProtocol { contentStackView.setCustomSpacing(contentLabelTopSpace, after: titleLabel) } + // Update closeButton let closeButtonTextColor = closeButtonTextColorConfiguration.getColor(self) closeButton.setTitleColor(closeButtonTextColor, for: .normal) closeButton.setTitleColor(closeButtonTextColor, for: .highlighted)