Skip to content

Commit 356e808

Browse files
kokekoke
authored
Merge pull request #4940 from woocommerce/issue/4557-ipad-modals
[Mobile Payments] Adjust modal dimensions for iPads
2 parents 4ca6cef + fa7e694 commit 356e808

File tree

2 files changed

+68
-4
lines changed

2 files changed

+68
-4
lines changed

‎WooCommerce/Classes/ViewRelated/CardPresentPayments/CardPresentPaymentsModalViewController.swift‎

Lines changed: 29 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ final class CardPresentPaymentsModalViewController: UIViewController {
1111

1212
@IBOutlet weak var containerView: UIView!
1313
@IBOutlet weak var mainStackView: UIStackView!
14+
@IBOutlet weak var bottomPaddingRegular: NSLayoutConstraint!
1415
@IBOutlet weak var primaryActionButtonsStackView: UIStackView!
1516
@IBOutlet weak var buttonsSpacer: UIView!
1617
@IBOutlet private weak var topTitleLabel: UILabel!
@@ -82,6 +83,7 @@ final class CardPresentPaymentsModalViewController: UIViewController {
8283

8384
heightConstraint.priority = .required
8485
widthConstraint.priority = .required
86+
configureSpacer()
8587
}
8688
}
8789

@@ -117,8 +119,8 @@ private extension CardPresentPaymentsModalViewController {
117119

118120
func styleBottomLabels() {
119121
actionButtonsView.isHidden = true
120-
buttonsSpacer.isHidden = false
121122
bottomLabels.isHidden = false
123+
configureSpacer()
122124

123125
styleBottomTitle()
124126
styleBottomSubtitle()
@@ -134,8 +136,8 @@ private extension CardPresentPaymentsModalViewController {
134136

135137
func styleActionButtons() {
136138
actionButtonsView.isHidden = false
137-
buttonsSpacer.isHidden = true
138139
bottomLabels.isHidden = true
140+
configureSpacer()
139141

140142
stylePrimaryButton()
141143
styleSecondaryButton()
@@ -239,7 +241,7 @@ private extension CardPresentPaymentsModalViewController {
239241

240242
func hideActionButtonsView() {
241243
actionButtonsView.isHidden = true
242-
buttonsSpacer.isHidden = false
244+
configureSpacer()
243245
}
244246

245247
func configurePrimaryButton() {
@@ -271,6 +273,30 @@ private extension CardPresentPaymentsModalViewController {
271273
auxiliaryButton.isHidden = false
272274
auxiliaryButton.setTitle(viewModel.auxiliaryButtonTitle, for: .normal)
273275
}
276+
277+
func configureSpacer() {
278+
let enabled = !shouldShowActionButtons()
279+
280+
if isRegularClassSize {
281+
buttonsSpacer.isHidden = true
282+
// For iPads, instead of a flexible spacer we expand the bottom margin with an extra 127px.
283+
// This would be the space equivalents to the primary and secondary buttons being visible
284+
// - 32px of spacing between buttons container and the rest of the content
285+
// - 40px for the primary button
286+
// - 15px of spacing between buttons
287+
// - 40px for the secondary button
288+
bottomPaddingRegular.constant = 42 + (enabled ? 127 : 0)
289+
} else {
290+
// For compact screens (iPhones, or iPad in split mode), we us a flexible spacer with a low
291+
// content hugging priority to ensure it takes all the available space, leaving the rest of
292+
// the visible items aligned to the top of the stack view
293+
buttonsSpacer.isHidden = !enabled
294+
}
295+
}
296+
297+
var isRegularClassSize: Bool {
298+
traitCollection.verticalSizeClass == .regular && traitCollection.horizontalSizeClass == .regular
299+
}
274300
}
275301

276302
// MARK: - View layout configuration

‎WooCommerce/Classes/ViewRelated/CardPresentPayments/CardPresentPaymentsModalViewController.xib‎

Lines changed: 39 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
<outlet property="actionButtonsView" destination="10Z-y1-ZQ6" id="L1z-Zs-L2J"/>
1414
<outlet property="auxiliaryButton" destination="maO-19-PuQ" id="cQA-7p-jmo"/>
1515
<outlet property="bottomLabels" destination="k73-qi-GuD" id="LvQ-UE-SBc"/>
16+
<outlet property="bottomPaddingRegular" destination="lVZ-pu-Fmb" id="CJM-oy-oSx"/>
1617
<outlet property="bottomSubtitleLabel" destination="2Sx-5s-f7J" id="Mco-Vu-Li6"/>
1718
<outlet property="bottomTitleLabel" destination="oAj-lv-0k9" id="Clc-oi-Ywf"/>
1819
<outlet property="buttonsSpacer" destination="OFI-6w-cag" id="Uva-gQ-T7X"/>
@@ -136,20 +137,57 @@
136137
<constraints>
137138
<constraint firstItem="10Z-y1-ZQ6" firstAttribute="leading" secondItem="jIt-xb-rrN" secondAttribute="leading" id="0sg-Uf-xbd"/>
138139
<constraint firstAttribute="trailing" secondItem="10Z-y1-ZQ6" secondAttribute="trailing" id="Nrr-ur-lj3"/>
140+
<constraint firstAttribute="width" constant="248" id="wyC-vo-Y5l"/>
139141
</constraints>
142+
<variation key="default">
143+
<mask key="constraints">
144+
<exclude reference="wyC-vo-Y5l"/>
145+
</mask>
146+
</variation>
147+
<variation key="heightClass=regular-widthClass=regular">
148+
<mask key="constraints">
149+
<include reference="wyC-vo-Y5l"/>
150+
</mask>
151+
</variation>
140152
</stackView>
141153
</subviews>
142154
<color key="backgroundColor" systemColor="systemBackgroundColor"/>
143155
<constraints>
144156
<constraint firstItem="jIt-xb-rrN" firstAttribute="leading" secondItem="8Tg-Q2-wkH" secondAttribute="leading" constant="16" id="80k-pZ-tsR"/>
157+
<constraint firstAttribute="width" constant="454" id="Apy-47-NLE"/>
158+
<constraint firstItem="jIt-xb-rrN" firstAttribute="top" secondItem="8Tg-Q2-wkH" secondAttribute="top" constant="42" id="FxC-xu-ACf"/>
145159
<constraint firstAttribute="height" priority="250" constant="382" id="J6m-sz-CD5"/>
146160
<constraint firstItem="jIt-xb-rrN" firstAttribute="top" secondItem="8Tg-Q2-wkH" secondAttribute="top" constant="32" id="JLA-XJ-MiD"/>
147-
<constraint firstAttribute="bottom" secondItem="jIt-xb-rrN" secondAttribute="bottom" constant="16" id="lVZ-pu-Fmb"/>
161+
<constraint firstAttribute="bottom" secondItem="jIt-xb-rrN" secondAttribute="bottom" constant="16" id="bkK-x1-zVB"/>
162+
<constraint firstAttribute="bottom" secondItem="jIt-xb-rrN" secondAttribute="bottom" constant="42" id="lVZ-pu-Fmb"/>
148163
<constraint firstAttribute="height" relation="greaterThanOrEqual" constant="382" id="n7H-7U-izh"/>
149164
<constraint firstItem="jIt-xb-rrN" firstAttribute="centerX" secondItem="8Tg-Q2-wkH" secondAttribute="centerX" id="p6Y-jJ-KuU"/>
150165
<constraint firstAttribute="width" constant="280" id="uaz-2N-7M4"/>
151166
<constraint firstAttribute="trailing" secondItem="jIt-xb-rrN" secondAttribute="trailing" constant="16" id="ufT-Yf-gsb"/>
167+
<constraint firstAttribute="height" relation="greaterThanOrEqual" constant="490" id="w7w-an-P9s"/>
152168
</constraints>
169+
<variation key="default">
170+
<mask key="constraints">
171+
<exclude reference="Apy-47-NLE"/>
172+
<exclude reference="w7w-an-P9s"/>
173+
<exclude reference="FxC-xu-ACf"/>
174+
<exclude reference="lVZ-pu-Fmb"/>
175+
</mask>
176+
</variation>
177+
<variation key="heightClass=regular-widthClass=regular">
178+
<mask key="constraints">
179+
<include reference="Apy-47-NLE"/>
180+
<exclude reference="n7H-7U-izh"/>
181+
<exclude reference="uaz-2N-7M4"/>
182+
<include reference="w7w-an-P9s"/>
183+
<exclude reference="80k-pZ-tsR"/>
184+
<include reference="FxC-xu-ACf"/>
185+
<exclude reference="JLA-XJ-MiD"/>
186+
<exclude reference="bkK-x1-zVB"/>
187+
<include reference="lVZ-pu-Fmb"/>
188+
<exclude reference="ufT-Yf-gsb"/>
189+
</mask>
190+
</variation>
153191
</view>
154192
</subviews>
155193
<viewLayoutGuide key="safeArea" id="fnl-2z-Ty3"/>

0 commit comments

Comments
 (0)