diff --git a/Demo/src/main/java/com/paypal/android/ui/DemoApp.kt b/Demo/src/main/java/com/paypal/android/ui/DemoApp.kt index d96577c09..d95e8305a 100644 --- a/Demo/src/main/java/com/paypal/android/ui/DemoApp.kt +++ b/Demo/src/main/java/com/paypal/android/ui/DemoApp.kt @@ -1,5 +1,8 @@ package com.paypal.android.ui +import androidx.compose.animation.fadeIn +import androidx.compose.animation.fadeOut +import androidx.compose.animation.slideInVertically import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.layout.padding import androidx.compose.material3.ExperimentalMaterial3Api @@ -31,6 +34,7 @@ import com.paypal.android.ui.vaultcard.VaultCardView import com.paypal.android.ui.vaultcard.VaultCardViewModel import com.paypal.android.uishared.components.DemoAppTopBar import com.paypal.android.uishared.effects.NavDestinationChangeDisposableEffect +import com.paypal.android.utils.UIConstants // The architecture of the Demo app is heavily influenced by Google sample apps written // entirely in compose, most specifically the Jetsnack app @@ -68,6 +72,10 @@ fun DemoApp() { NavHost( navController = navController, startDestination = "features", + enterTransition = { + fadeIn() + slideInVertically { UIConstants.getSlideInStartOffsetY(it) } + }, + exitTransition = { fadeOut() }, modifier = Modifier.padding(innerPadding) ) { // Ref: https://youtu.be/goFpG25uoc8?si=hqYGEaA95We6qUiE&t=76 diff --git a/Demo/src/main/java/com/paypal/android/ui/OptionList.kt b/Demo/src/main/java/com/paypal/android/ui/OptionList.kt index 2212df458..973bb07e6 100644 --- a/Demo/src/main/java/com/paypal/android/ui/OptionList.kt +++ b/Demo/src/main/java/com/paypal/android/ui/OptionList.kt @@ -56,7 +56,7 @@ fun OptionList( .selectable( selected = (option == selectedOption), onClick = { onSelectedOptionChange(option) }, - role = Role.RadioButton + role = Role.RadioButton, ) ) { Text( diff --git a/Demo/src/main/java/com/paypal/android/ui/features/FeaturesView.kt b/Demo/src/main/java/com/paypal/android/ui/features/FeaturesView.kt index 715b7e163..e7c7b0e2c 100644 --- a/Demo/src/main/java/com/paypal/android/ui/features/FeaturesView.kt +++ b/Demo/src/main/java/com/paypal/android/ui/features/FeaturesView.kt @@ -23,6 +23,7 @@ import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource +import androidx.compose.ui.semantics.Role import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.tooling.preview.Preview import com.paypal.android.R @@ -117,7 +118,10 @@ fun FeatureView( modifier = Modifier .background(MaterialTheme.colorScheme.surfaceVariant) .fillMaxWidth() - .clickable(onClick = onClick) + .clickable( + onClick = onClick, + role = Role.Button + ) ) { Row { Text( diff --git a/Demo/src/main/java/com/paypal/android/utils/UIConstants.kt b/Demo/src/main/java/com/paypal/android/utils/UIConstants.kt index 971eb4882..144db7658 100644 --- a/Demo/src/main/java/com/paypal/android/utils/UIConstants.kt +++ b/Demo/src/main/java/com/paypal/android/utils/UIConstants.kt @@ -4,6 +4,10 @@ import androidx.compose.foundation.layout.Arrangement import androidx.compose.ui.unit.dp object UIConstants { + private const val slideInOffsetPercentY = 0.05 + fun getSlideInStartOffsetY(fullHeightOfComposable: Int) = + (fullHeightOfComposable * slideInOffsetPercentY).toInt() + // Ref: https://support.google.com/accessibility/android/answer/7101858 val minimumTouchSize = 48.dp val stepNumberBackgroundSize = 40.dp