Skip to content

Commit

Permalink
Update icons used for saved payment methods: edit, remove, and select…
Browse files Browse the repository at this point in the history
…ed (#9338)
  • Loading branch information
amk-stripe authored Sep 25, 2024
1 parent 7e8d07a commit f1f381c
Show file tree
Hide file tree
Showing 74 changed files with 41 additions and 20 deletions.
12 changes: 6 additions & 6 deletions paymentsheet/res/drawable/stripe_ic_edit_symbol.xml
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="16dp"
android:height="16dp"
android:viewportWidth="16"
android:viewportHeight="16">
android:width="11dp"
android:height="11dp"
android:viewportWidth="11"
android:viewportHeight="11">
<path
android:pathData="M15.194,4.279L11.721,0.806L11.808,0.719C12.767,-0.24 14.322,-0.24 15.281,0.719C16.24,1.678 16.24,3.233 15.281,4.192L15.194,4.279ZM13.779,5.694L4.515,14.958L0,16L1.042,11.485L10.306,2.221L13.779,5.694Z"
android:fillColor="#545969"
android:pathData="M9.996,3.175L7.825,1.004L7.88,0.95C8.479,0.35 9.451,0.35 10.05,0.95C10.65,1.549 10.65,2.521 10.05,3.12L9.996,3.175ZM9.112,4.058L3.322,9.849L0.5,10.5L1.151,7.678L6.942,1.888L9.112,4.058Z"
android:fillColor="#ffffff"
android:fillType="evenOdd"/>
</vector>
10 changes: 10 additions & 0 deletions paymentsheet/res/drawable/stripe_ic_remove_symbol.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="8dp"
android:height="8dp"
android:viewportWidth="8"
android:viewportHeight="8">
<path
android:pathData="M5.4142,4L7.7071,6.2929C8.0976,6.6834 8.0976,7.3166 7.7071,7.7071C7.3166,8.0976 6.6834,8.0976 6.2929,7.7071L4,5.4142L1.7071,7.7071C1.3166,8.0976 0.6834,8.0976 0.2929,7.7071C-0.0976,7.3166 -0.0976,6.6834 0.2929,6.2929L2.5858,4L0.2929,1.7071C-0.0976,1.3166 -0.0976,0.6834 0.2929,0.2929C0.6834,-0.0976 1.3166,-0.0976 1.7071,0.2929L4,2.5858L6.2929,0.2929C6.6834,-0.0976 7.3166,-0.0976 7.7071,0.2929C8.0976,0.6834 8.0976,1.3166 7.7071,1.7071L5.4142,4Z"
android:fillColor="#ffffff"
android:fillType="evenOdd"/>
</vector>
9 changes: 9 additions & 0 deletions paymentsheet/res/drawable/stripe_ic_selected_symbol.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="9dp"
android:height="6dp"
android:viewportWidth="9"
android:viewportHeight="6">
<path
android:pathData="M7.3415,0.3353C7.6766,0.0002 8.2199,0.0002 8.555,0.3353C8.8902,0.6704 8.8902,1.2138 8.555,1.5489L4.4443,5.666C4.1091,6.0011 3.5658,6.0011 3.2307,5.666L1.0853,3.5206C0.7502,3.1855 0.7502,2.6422 1.0853,2.307C1.4204,1.9719 1.9638,1.9719 2.2989,2.307L3.8375,3.8456L7.3415,0.3353Z"
android:fillColor="#ffffff"/>
</vector>
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ const val SAVED_PAYMENT_METHOD_CARD_TEST_TAG = "SAVED_PAYMENT_METHOD_CARD_TEST_T
internal const val TEST_TAG_REMOVE_BADGE = "remove_badge"
internal const val TEST_TAG_MODIFY_BADGE = "modify_badge"

private const val EDIT_ICON_SCALE = 0.6f
private const val EDIT_ICON_SCALE = 0.9f
private val editIconColorLight = Color(0x99000000)
private val editIconColorDark = Color.White
private val editIconBackgroundColorLight = Color(0xFFE5E5EA)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,14 @@ import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.Icon
import androidx.compose.material.MaterialTheme
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Check
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import com.stripe.android.paymentsheet.R
import com.stripe.android.uicore.shouldUseDarkDynamicColor

@Composable
Expand All @@ -34,7 +34,7 @@ internal fun SelectedBadge(
.background(MaterialTheme.colors.primary)
) {
Icon(
imageVector = Icons.Filled.Check,
painter = painterResource(R.drawable.stripe_ic_selected_symbol),
contentDescription = null,
tint = checkSymbolColor,
modifier = Modifier.size(12.dp),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,22 +6,22 @@ import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.Icon
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Close
import androidx.compose.material.icons.filled.Edit
import androidx.compose.material.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.painter.Painter
import androidx.compose.ui.platform.testTag
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.dp
import com.stripe.android.paymentsheet.DisplayableSavedPaymentMethod
import com.stripe.android.paymentsheet.R
import com.stripe.android.paymentsheet.ui.RemovePaymentMethodDialogUI
import com.stripe.android.paymentsheet.ui.readNumbersAsIndividualDigits
import com.stripe.android.uicore.strings.resolve
Expand All @@ -35,8 +35,8 @@ internal fun DeleteIcon(
val paymentMethodId = paymentMethod.paymentMethod.id

TrailingIcon(
backgroundColor = Color.Red,
icon = Icons.Filled.Close,
backgroundColor = MaterialTheme.colors.error,
icon = painterResource(id = R.drawable.stripe_ic_remove_symbol),
modifier = Modifier.testTag("${TEST_TAG_MANAGE_SCREEN_DELETE_ICON}_$paymentMethodId"),
onClick = {
openRemoveDialog.value = true
Expand Down Expand Up @@ -65,8 +65,8 @@ internal fun EditIcon(
val paymentMethodId = paymentMethod.paymentMethod.id

TrailingIcon(
icon = painterResource(id = R.drawable.stripe_ic_edit_symbol),
backgroundColor = Color.Gray,
icon = Icons.Filled.Edit,
modifier = Modifier.testTag("${TEST_TAG_MANAGE_SCREEN_EDIT_ICON}_$paymentMethodId"),
onClick = { editPaymentMethod(paymentMethod) },
contentDescription = paymentMethod
Expand All @@ -79,7 +79,7 @@ internal fun EditIcon(
@Composable
private fun TrailingIcon(
backgroundColor: Color,
icon: ImageVector,
icon: Painter,
onClick: () -> Unit,
contentDescription: String,
modifier: Modifier,
Expand All @@ -93,11 +93,11 @@ private fun TrailingIcon(
.clickable(onClick = onClick),
) {
Icon(
imageVector = icon,
painter = icon,
contentDescription = null,
tint = Color.White,
modifier = Modifier
.size(12.dp)
.size(10.dp)
.semantics {
this.contentDescription = contentDescription
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,15 @@ import com.stripe.android.model.PaymentMethodFixtures
import com.stripe.android.model.PaymentMethodFixtures.toDisplayableSavedPaymentMethod
import com.stripe.android.paymentsheet.DisplayableSavedPaymentMethod
import com.stripe.android.screenshottesting.PaparazziRule
import com.stripe.android.utils.screenshots.PaymentSheetAppearance
import org.junit.Rule
import org.junit.Test

internal class ManageScreenUIScreenshotTest {

@get:Rule
val paparazziRule = PaparazziRule(
PaymentSheetAppearance.entries,
boxModifier = Modifier
.padding(16.dp)
)
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Diff not rendered.
Diff not rendered.
Diff not rendered.
Diff not rendered.

0 comments on commit f1f381c

Please sign in to comment.