Skip to content

Commit c03d5d3

Browse files
AnirudhBhatAnirudhBhat
authored
Merge pull request #13414 from woocommerce/13250-fix-accessibility-in-ipp-flows
Improve accessibility support in IPP flows
2 parents cb07541 + b795b90 commit c03d5d3

17 files changed

+565
-574
lines changed

‎RELEASE-NOTES.txt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33
*** For entries which are touching the Android Wear app's, start entry with `[WEAR]` too.
44
21.8
55
-----
6+
- [**] Improved accessibility support (handling of increased text size) in in-person payment flows [https://github.com/woocommerce/woocommerce-android/pull/13414]
67

78

89
21.7

‎WooCommerce/src/main/kotlin/com/woocommerce/android/ui/payments/cardreader/connect/CardReaderConnectDialogFragment.kt

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import androidx.activity.addCallback
1818
import androidx.activity.result.contract.ActivityResultContracts
1919
import androidx.activity.result.contract.ActivityResultContracts.RequestPermission
2020
import androidx.activity.result.contract.ActivityResultContracts.StartActivityForResult
21+
import androidx.core.view.isVisible
2122
import androidx.fragment.app.viewModels
2223
import androidx.lifecycle.Lifecycle
2324
import androidx.navigation.fragment.findNavController
@@ -48,6 +49,7 @@ import com.woocommerce.android.ui.woopos.cardreader.WooPosCardReaderActivity
4849
import com.woocommerce.android.util.ChromeCustomTabUtils
4950
import com.woocommerce.android.util.LocationUtils
5051
import com.woocommerce.android.util.UiHelpers
52+
import com.woocommerce.android.util.UiHelpers.getIllustrationVisibilityForFontScale
5153
import com.woocommerce.android.util.WooAnimUtils
5254
import com.woocommerce.android.util.WooLog
5355
import com.woocommerce.android.util.WooPermissionUtils
@@ -164,6 +166,12 @@ class CardReaderConnectDialogFragment : PaymentsBaseDialogFragment(R.layout.card
164166
private fun moveToState(binding: CardReaderConnectDialogBinding, viewState: CardReaderConnectViewState) {
165167
UiHelpers.setTextOrHide(binding.headerLabel, viewState.headerLabel)
166168
UiHelpers.setImageOrHideInLandscapeOnCompactScreenHeightSizeClass(binding.illustration, viewState.illustration)
169+
.also {
170+
if (binding.illustration.isVisible) {
171+
binding.illustration.visibility =
172+
getIllustrationVisibilityForFontScale(resources.configuration.fontScale)
173+
}
174+
}
167175
UiHelpers.setTextOrHide(binding.hintLabel, viewState.hintLabel)
168176
UiHelpers.setTextOrHide(binding.primaryActionBtn, viewState.primaryActionLabel)
169177
UiHelpers.setTextOrHide(binding.secondaryActionBtn, viewState.secondaryActionLabel)
@@ -179,10 +187,6 @@ class CardReaderConnectDialogFragment : PaymentsBaseDialogFragment(R.layout.card
179187
viewState.onTertiaryActionClicked?.invoke()
180188
}
181189

182-
with(binding.illustration.layoutParams as ViewGroup.MarginLayoutParams) {
183-
topMargin = resources.getDimensionPixelSize(viewState.illustrationTopMargin)
184-
}
185-
186190
updateMultipleReadersFoundRecyclerView(binding, viewState)
187191

188192
with(binding.illustration) {

‎WooCommerce/src/main/kotlin/com/woocommerce/android/ui/payments/cardreader/connect/CardReaderConnectViewState.kt

Lines changed: 0 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
package com.woocommerce.android.ui.payments.cardreader.connect
22

3-
import androidx.annotation.DimenRes
43
import androidx.annotation.DrawableRes
54
import androidx.annotation.StringRes
65
import com.woocommerce.android.R
@@ -17,7 +16,6 @@ sealed class CardReaderConnectViewState(
1716
val primaryActionLabel: Int? = null,
1817
val secondaryActionLabel: Int? = null,
1918
val tertiaryActionLabel: Int? = null,
20-
@DimenRes val illustrationTopMargin: Int = R.dimen.major_200,
2119
open val listItems: List<CardReaderConnectViewModel.ListItemViewState>? = null,
2220
val learnMoreLabel: UiString? = null,
2321
) {
@@ -67,7 +65,6 @@ sealed class CardReaderConnectViewState(
6765
primaryActionLabel = R.string.card_reader_connect_to_reader,
6866
secondaryActionLabel = R.string.card_reader_connect_keep_searching_button,
6967
tertiaryActionLabel = R.string.cancel,
70-
illustrationTopMargin = R.dimen.major_150
7168
)
7269

7370
data class MultipleExternalReadersFoundState(
@@ -85,7 +82,6 @@ sealed class CardReaderConnectViewState(
8582
illustration = R.drawable.img_card_reader_connecting,
8683
hintLabel = R.string.card_reader_connect_connecting_hint,
8784
secondaryActionLabel = R.string.cancel,
88-
illustrationTopMargin = R.dimen.major_275
8985
)
9086

9187
data class BuiltInReaderConnectingState(override val onSecondaryActionClicked: (() -> Unit)) :
@@ -95,7 +91,6 @@ sealed class CardReaderConnectViewState(
9591
illustration = R.drawable.img_card_reader_tpp_connecting,
9692
hintLabel = R.string.card_reader_connect_connecting_hint,
9793
secondaryActionLabel = R.string.cancel,
98-
illustrationTopMargin = R.dimen.major_275
9994
)
10095

10196
data class ScanningFailedState(
@@ -106,7 +101,6 @@ sealed class CardReaderConnectViewState(
106101
illustration = R.drawable.img_products_error,
107102
primaryActionLabel = R.string.try_again,
108103
secondaryActionLabel = R.string.cancel,
109-
illustrationTopMargin = R.dimen.major_150
110104
)
111105

112106
data class ConnectingFailedState(
@@ -117,7 +111,6 @@ sealed class CardReaderConnectViewState(
117111
illustration = R.drawable.img_products_error,
118112
primaryActionLabel = R.string.try_again,
119113
secondaryActionLabel = R.string.cancel,
120-
illustrationTopMargin = R.dimen.major_150
121114
)
122115

123116
data class LocationPermissionRationale(
@@ -127,7 +120,6 @@ sealed class CardReaderConnectViewState(
127120
hintLabel = R.string.card_reader_connect_permission_rationale_hint,
128121
illustration = R.drawable.img_location,
129122
primaryActionLabel = R.string.card_reader_connect_permission_rationale_action,
130-
illustrationTopMargin = R.dimen.major_150
131123
)
132124

133125
data class MissingLocationPermissionsError(
@@ -138,7 +130,6 @@ sealed class CardReaderConnectViewState(
138130
illustration = R.drawable.img_products_error,
139131
primaryActionLabel = R.string.card_reader_connect_open_permission_settings,
140132
secondaryActionLabel = R.string.cancel,
141-
illustrationTopMargin = R.dimen.major_150
142133
)
143134

144135
data class LocationDisabledError(
@@ -149,7 +140,6 @@ sealed class CardReaderConnectViewState(
149140
illustration = R.drawable.img_products_error,
150141
primaryActionLabel = R.string.card_reader_connect_open_location_settings,
151142
secondaryActionLabel = R.string.cancel,
152-
illustrationTopMargin = R.dimen.major_150
153143
)
154144

155145
data class BluetoothDisabledError(
@@ -160,7 +150,6 @@ sealed class CardReaderConnectViewState(
160150
illustration = R.drawable.img_products_error,
161151
primaryActionLabel = R.string.card_reader_connect_open_bluetooth_settings,
162152
secondaryActionLabel = R.string.cancel,
163-
illustrationTopMargin = R.dimen.major_150
164153
)
165154

166155
data class MissingBluetoothPermissionsError(
@@ -171,7 +160,6 @@ sealed class CardReaderConnectViewState(
171160
illustration = R.drawable.img_products_error,
172161
primaryActionLabel = R.string.card_reader_connect_missing_bluetooth_permission_button,
173162
secondaryActionLabel = R.string.cancel,
174-
illustrationTopMargin = R.dimen.major_150
175163
)
176164

177165
data class MissingMerchantAddressError(
@@ -182,7 +170,6 @@ sealed class CardReaderConnectViewState(
182170
illustration = R.drawable.img_products_error,
183171
primaryActionLabel = R.string.card_reader_connect_missing_address_button,
184172
secondaryActionLabel = R.string.cancel,
185-
illustrationTopMargin = R.dimen.major_150
186173
)
187174

188175
data class InvalidMerchantAddressPostCodeError(
@@ -192,6 +179,5 @@ sealed class CardReaderConnectViewState(
192179
hintLabel = R.string.card_reader_connect_invalid_postal_code_hint,
193180
illustration = R.drawable.img_products_error,
194181
primaryActionLabel = R.string.try_again,
195-
illustrationTopMargin = R.dimen.major_150,
196182
)
197183
}

‎WooCommerce/src/main/kotlin/com/woocommerce/android/ui/payments/cardreader/payment/CardReaderPaymentDialogFragment.kt

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import android.view.View
1313
import android.view.ViewGroup
1414
import androidx.activity.ComponentDialog
1515
import androidx.activity.addCallback
16+
import androidx.core.view.isVisible
1617
import androidx.fragment.app.viewModels
1718
import androidx.navigation.fragment.findNavController
1819
import com.google.android.material.snackbar.BaseTransientBottomBar
@@ -33,6 +34,7 @@ import com.woocommerce.android.ui.payments.cardreader.payment.ViewState.External
3334
import com.woocommerce.android.ui.payments.refunds.RefundSummaryFragment.Companion.KEY_INTERAC_SUCCESS
3435
import com.woocommerce.android.util.PrintHtmlHelper
3536
import com.woocommerce.android.util.UiHelpers
37+
import com.woocommerce.android.util.UiHelpers.getIllustrationVisibilityForFontScale
3638
import com.woocommerce.android.util.UiHelpers.getTextOfUiString
3739
import com.woocommerce.android.viewmodel.MultiLiveEvent.Event.Exit
3840
import com.woocommerce.android.viewmodel.MultiLiveEvent.Event.ShowSnackbar
@@ -107,10 +109,13 @@ class CardReaderPaymentDialogFragment : PaymentsBaseDialogFragment(R.layout.card
107109
UiHelpers.setImageOrHideInLandscapeOnCompactScreenHeightSizeClass(
108110
binding.illustration,
109111
viewState.illustration
110-
)
112+
).also {
113+
if (binding.illustration.isVisible) {
114+
binding.illustration.visibility =
115+
getIllustrationVisibilityForFontScale(resources.configuration.fontScale)
116+
}
117+
}
111118
UiHelpers.setTextOrHide(binding.paymentStateLabel, viewState.paymentStateLabel)
112-
(binding.paymentStateLabel.layoutParams as ViewGroup.MarginLayoutParams)
113-
.topMargin = resources.getDimensionPixelSize(viewState.paymentStateLabelTopMargin)
114119
UiHelpers.setTextOrHide(binding.hintLabel, viewState.hintLabel)
115120
UiHelpers.setTextOrHide(binding.primaryActionBtn, viewState.primaryActionLabel)
116121
UiHelpers.setTextOrHide(binding.secondaryActionBtn, viewState.secondaryActionLabel)

‎WooCommerce/src/main/kotlin/com/woocommerce/android/ui/payments/cardreader/payment/CardReaderPaymentViewState.kt

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
package com.woocommerce.android.ui.payments.cardreader.payment
22

3-
import androidx.annotation.DimenRes
43
import androidx.annotation.DrawableRes
54
import androidx.annotation.StringRes
65
import com.woocommerce.android.R
@@ -20,7 +19,6 @@ sealed class ViewState(
2019
@StringRes open val headerLabel: Int? = null,
2120
val paymentStateLabel: UiString? = null,
2221
open val receiptSentAutomaticallyHint: UiString? = null,
23-
@DimenRes val paymentStateLabelTopMargin: Int = R.dimen.major_275,
2422
@DrawableRes val illustration: Int? = null,
2523
open val isProgressVisible: Boolean = false,
2624
val primaryActionLabel: Int? = null,
@@ -56,7 +54,6 @@ sealed class ViewState(
5654
) : ViewState(
5755
headerLabel = R.string.card_reader_payment_payment_failed_header,
5856
paymentStateLabel = errorType.message,
59-
paymentStateLabelTopMargin = R.dimen.major_100,
6057
primaryActionLabel = primaryLabel,
6158
illustration = R.drawable.img_products_error,
6259
secondaryActionLabel = secondaryLabel
@@ -72,7 +69,6 @@ sealed class ViewState(
7269
) : ViewState(
7370
headerLabel = R.string.card_reader_payment_payment_failed_header,
7471
paymentStateLabel = errorType.message,
75-
paymentStateLabelTopMargin = R.dimen.major_100,
7672
primaryActionLabel = primaryLabel,
7773
illustration = R.drawable.img_card_reader_tpp_payment_failed,
7874
secondaryActionLabel = secondaryLabel
@@ -262,7 +258,6 @@ sealed class ViewState(
262258
) : ViewState(
263259
headerLabel = R.string.card_reader_interac_refund_refund_failed_header,
264260
paymentStateLabel = errorType.message,
265-
paymentStateLabelTopMargin = R.dimen.major_100,
266261
primaryActionLabel = primaryLabel,
267262
illustration = R.drawable.img_products_error,
268263
secondaryActionLabel = secondaryLabel,

‎WooCommerce/src/main/kotlin/com/woocommerce/android/util/UiHelpers.kt

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,13 @@ object UiHelpers {
105105
updateVisibility(imageView, image != null)
106106
image?.let { imageView.setImageDrawable(image) }
107107
}
108+
109+
@Suppress("MagicNumber")
110+
fun getIllustrationVisibilityForFontScale(fontScale: Float): Int = if (fontScale > 1.5f) {
111+
View.GONE
112+
} else {
113+
View.VISIBLE
114+
}
108115
}
109116

110117
class IsWindowClassLargeThanCompact @Inject constructor(val context: Context) {

0 commit comments

Comments
 (0)