Fix styling of CardInputWidget and CardMultilineWidget (#2055)

`com.google.android.material:material:1.1.0-rc01` breaks `TextInputLayout` styling. Fix this by explicitly setting a style that extends `Widget.Design.TextInputLayout`. Fixes #2053
stripe · Jan 14, 2020 · aeb92b9 · aeb92b9
1 parent 9fd6459
commit aeb92b9
Show file tree

Hide file tree

Showing 12 changed files with 60 additions and 34 deletions.
diff --git a/example/build.gradle b/example/build.gradle
@@ -44,12 +44,13 @@ dependencies {
     implementation 'androidx.recyclerview:recyclerview:1.1.0'
     implementation "androidx.lifecycle:lifecycle-viewmodel:2.1.0"
     implementation 'androidx.lifecycle:lifecycle-extensions:2.1.0'
+    implementation 'com.google.android.material:material:1.1.0-rc01'
 
     implementation 'com.google.android.gms:play-services-wallet:18.0.0'
 
     /* Needed for RxAndroid */
     implementation 'io.reactivex.rxjava2:rxandroid:2.1.1'
-    implementation 'io.reactivex.rxjava2:rxjava:2.2.16'
+    implementation 'io.reactivex.rxjava2:rxjava:2.2.17'
 
     /* Needed for Rx Bindings on views */
     implementation 'com.jakewharton.rxbinding2:rxbinding:2.2.0'

diff --git a/example/res/values/themes.xml b/example/res/values/themes.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <style name="AppTheme" parent="Theme.AppCompat.DayNight">
+    <style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
         <item name="colorPrimary">@color/primary</item>
         <item name="colorPrimaryDark">@color/primaryDark</item>
         <item name="colorAccent">@color/accent</item>
@@ -117,5 +117,4 @@
     <style name="Stripe3DS2FooterChevron">
         <item name="tint">@color/threeds2_footer_header</item>
     </style>
-
 </resources>
diff --git a/example/src/main/java/com/stripe/example/activity/CreateCardPaymentMethodActivity.kt b/example/src/main/java/com/stripe/example/activity/CreateCardPaymentMethodActivity.kt
@@ -8,7 +8,6 @@ import android.widget.TextView
 import androidx.appcompat.app.AppCompatActivity
 import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
-import com.google.android.material.snackbar.Snackbar
 import com.stripe.android.PaymentConfiguration
 import com.stripe.android.Stripe
 import com.stripe.android.model.PaymentMethod
@@ -29,14 +28,14 @@ class CreateCardPaymentMethodActivity : AppCompatActivity() {
             PaymentConfiguration.getInstance(this).publishableKey
         )
     }
-    private lateinit var snackbarContainer: View
+    private val snackbarController: SnackbarController by lazy {
+        SnackbarController(findViewById(android.R.id.content))
+    }
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContentView(R.layout.activity_card_payment_methods)
 
-        snackbarContainer = findViewById(android.R.id.content)
-
         rv_payment_methods.setHasFixedSize(false)
         rv_payment_methods.layoutManager = LinearLayoutManager(this)
         rv_payment_methods.adapter = adapter
@@ -67,8 +66,7 @@ class CreateCardPaymentMethodActivity : AppCompatActivity() {
     }
 
     private fun showSnackbar(message: String) {
-        Snackbar.make(snackbarContainer, message, Snackbar.LENGTH_LONG)
-            .show()
+        snackbarController.show(message)
     }
 
     private fun onCreatePaymentMethodStart() {

diff --git a/example/src/main/java/com/stripe/example/activity/CreateCardSourceActivity.kt b/example/src/main/java/com/stripe/example/activity/CreateCardSourceActivity.kt
@@ -8,7 +8,6 @@ import androidx.appcompat.app.AppCompatActivity
 import androidx.lifecycle.Observer
 import androidx.lifecycle.ViewModelProviders
 import androidx.recyclerview.widget.LinearLayoutManager
-import com.google.android.material.snackbar.Snackbar
 import com.stripe.android.ApiResultCallback
 import com.stripe.android.PaymentConfiguration
 import com.stripe.android.Stripe
@@ -38,6 +37,9 @@ class CreateCardSourceActivity : AppCompatActivity() {
     private val keyboardController: KeyboardController by lazy {
         KeyboardController(this)
     }
+    private val snackbarController: SnackbarController by lazy {
+        SnackbarController(findViewById(android.R.id.content))
+    }
 
     private var alertDialog: AlertDialog? = null
 
@@ -185,8 +187,7 @@ class CreateCardSourceActivity : AppCompatActivity() {
     }
 
     private fun showSnackbar(message: String) {
-        Snackbar.make(findViewById(android.R.id.content), message, Snackbar.LENGTH_LONG)
-            .show()
+        snackbarController.show(message)
     }
 
     private companion object {

diff --git a/example/src/main/java/com/stripe/example/activity/CreateCardTokenActivity.kt b/example/src/main/java/com/stripe/example/activity/CreateCardTokenActivity.kt
@@ -15,7 +15,6 @@ import androidx.lifecycle.Observer
 import androidx.lifecycle.ViewModelProviders
 import androidx.recyclerview.widget.LinearLayoutManager
 import androidx.recyclerview.widget.RecyclerView
-import com.google.android.material.snackbar.Snackbar
 import com.stripe.android.ApiResultCallback
 import com.stripe.android.PaymentConfiguration
 import com.stripe.android.Stripe
@@ -26,6 +25,10 @@ import kotlinx.android.synthetic.main.card_token_activity.*
 
 class CreateCardTokenActivity : AppCompatActivity() {
 
+    private val snackbarController: SnackbarController by lazy {
+        SnackbarController(findViewById(android.R.id.content))
+    }
+
     public override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContentView(R.layout.card_token_activity)
@@ -53,12 +56,7 @@ class CreateCardTokenActivity : AppCompatActivity() {
                     adapter.addToken(it)
                 })
             } else {
-                Snackbar.make(
-                    findViewById(android.R.id.content),
-                    R.string.invalid_card_details,
-                    Snackbar.LENGTH_SHORT
-                )
-                    .show()
+                snackbarController.show(getString(R.string.invalid_card_details))
             }
         }
 

diff --git a/example/src/main/java/com/stripe/example/activity/CustomerSessionActivity.kt b/example/src/main/java/com/stripe/example/activity/CustomerSessionActivity.kt
@@ -5,7 +5,6 @@ import android.content.Intent
 import android.os.Bundle
 import android.view.View
 import androidx.appcompat.app.AppCompatActivity
-import com.google.android.material.snackbar.Snackbar
 import com.stripe.android.CustomerSession
 import com.stripe.android.StripeError
 import com.stripe.android.model.Customer
@@ -21,6 +20,10 @@ import kotlinx.android.synthetic.main.activity_customer_session.*
  */
 class CustomerSessionActivity : AppCompatActivity() {
 
+    private val snackbarController: SnackbarController by lazy {
+        SnackbarController(coordinator)
+    }
+
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContentView(R.layout.activity_customer_session)
@@ -37,8 +40,6 @@ class CustomerSessionActivity : AppCompatActivity() {
 
         btn_launch_payment_methods.isEnabled = false
         btn_launch_payment_methods.setOnClickListener { launchWithCustomer() }
-
-        onRetrieveError("Error!!")
     }
 
     private fun launchWithCustomer() {
@@ -69,8 +70,7 @@ class CustomerSessionActivity : AppCompatActivity() {
     private fun onRetrieveError(errorMessage: String) {
         btn_launch_payment_methods.isEnabled = false
         progress_bar.visibility = View.INVISIBLE
-        Snackbar.make(coordinator, errorMessage, Snackbar.LENGTH_LONG)
-            .show()
+        snackbarController.show(errorMessage)
     }
 
     private class CustomerRetrievalListenerImpl constructor(

diff --git a/example/src/main/java/com/stripe/example/activity/PayWithGoogleActivity.kt b/example/src/main/java/com/stripe/example/activity/PayWithGoogleActivity.kt
@@ -15,7 +15,6 @@ import com.google.android.gms.wallet.PaymentDataRequest
 import com.google.android.gms.wallet.PaymentsClient
 import com.google.android.gms.wallet.Wallet
 import com.google.android.gms.wallet.WalletConstants
-import com.google.android.material.snackbar.Snackbar
 import com.stripe.android.ApiResultCallback
 import com.stripe.android.GooglePayJsonFactory
 import com.stripe.android.PaymentConfiguration
@@ -40,6 +39,9 @@ class PayWithGoogleActivity : AppCompatActivity() {
     private val googlePayJsonFactory: GooglePayJsonFactory by lazy {
         GooglePayJsonFactory(this)
     }
+    private val snackbarController: SnackbarController by lazy {
+        SnackbarController(coordinator)
+    }
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
@@ -166,8 +168,7 @@ class PayWithGoogleActivity : AppCompatActivity() {
     }
 
     private fun showSnackbar(message: String) {
-        Snackbar.make(coordinator, message, Snackbar.LENGTH_SHORT)
-            .show()
+        snackbarController.show(message)
     }
 
     private companion object {

diff --git a/example/src/main/java/com/stripe/example/activity/PaymentSessionActivity.kt b/example/src/main/java/com/stripe/example/activity/PaymentSessionActivity.kt
@@ -6,7 +6,6 @@ import android.view.View
 import android.view.WindowManager
 import androidx.appcompat.app.AppCompatActivity
 import androidx.core.content.ContextCompat
-import com.google.android.material.snackbar.Snackbar
 import com.stripe.android.CustomerSession
 import com.stripe.android.PaymentSession
 import com.stripe.android.PaymentSessionConfig
@@ -36,6 +35,9 @@ class PaymentSessionActivity : AppCompatActivity() {
     private val notSelectedText: String by lazy {
         getString(R.string.not_selected)
     }
+    private val snackbarController: SnackbarController by lazy {
+        SnackbarController(coordinator)
+    }
 
     private var paymentSessionData: PaymentSessionData? = null
 
@@ -226,8 +228,7 @@ class PaymentSessionActivity : AppCompatActivity() {
     }
 
     private fun showError(errorMessage: String) {
-        Snackbar.make(coordinator, errorMessage, Snackbar.LENGTH_LONG)
-            .show()
+        snackbarController.show(errorMessage)
     }
 
     private class PaymentSessionListenerImpl internal constructor(

diff --git a/example/src/main/java/com/stripe/example/activity/SnackbarController.kt b/example/src/main/java/com/stripe/example/activity/SnackbarController.kt
@@ -0,0 +1,12 @@
+package com.stripe.example.activity
+
+import android.view.View
+import com.google.android.material.snackbar.BaseTransientBottomBar
+import com.google.android.material.snackbar.Snackbar
+
+internal class SnackbarController internal constructor(val view: View) {
+    fun show(message: String) {
+        Snackbar.make(view, message, BaseTransientBottomBar.LENGTH_SHORT)
+            .show()
+    }
+}
diff --git a/stripe/res/layout/card_input_widget.xml b/stripe/res/layout/card_input_widget.xml
@@ -36,7 +36,8 @@
             android:nextFocusForward="@+id/tl_expiry_date"
             android:nextFocusDown="@+id/tl_expiry_date"
             android:contentDescription="@string/acc_label_card_number"
-            app:hintEnabled="false">
+            app:hintEnabled="false"
+            style="@style/Stripe.CardInputWidget.TextInputLayout">
             <com.stripe.android.view.CardNumberEditText
                 android:id="@+id/et_card_number"
                 android:layout_width="match_parent"
@@ -70,7 +71,8 @@
             android:nextFocusLeft="@id/tl_card_number"
             android:nextFocusUp="@id/tl_card_number"
             android:contentDescription="@string/acc_label_expiry_date"
-            app:hintEnabled="false">
+            app:hintEnabled="false"
+            style="@style/Stripe.CardInputWidget.TextInputLayout">
             <com.stripe.android.view.ExpiryDateEditText
                 android:id="@+id/et_expiry_date"
                 android:layout_width="match_parent"
@@ -99,7 +101,8 @@
             android:nextFocusLeft="@id/tl_expiry_date"
             android:nextFocusUp="@id/tl_expiry_date"
             android:contentDescription="@string/cvc_number_hint"
-            app:hintEnabled="false">
+            app:hintEnabled="false"
+            style="@style/Stripe.CardInputWidget.TextInputLayout">
             <com.stripe.android.view.CvcEditText
                 android:id="@+id/et_cvc"
                 android:layout_width="match_parent"
@@ -126,7 +129,8 @@
             android:nextFocusLeft="@id/tl_cvc"
             android:nextFocusUp="@id/tl_cvc"
             android:contentDescription="@string/address_label_postal_code"
-            app:hintEnabled="false">
+            app:hintEnabled="false"
+            style="@style/Stripe.CardInputWidget.TextInputLayout">
             <com.stripe.android.view.PostalCodeEditText
                 android:id="@+id/et_postal_code"
                 android:layout_width="match_parent"

diff --git a/stripe/res/layout/card_multiline_widget.xml b/stripe/res/layout/card_multiline_widget.xml
@@ -9,6 +9,7 @@
         android:layout_height="wrap_content"
         android:hint="@string/acc_label_card_number"
         android:layout_marginTop="@dimen/stripe_add_card_element_vertical_margin"
+        style="@style/Widget.Design.TextInputLayout"
         >
 
         <com.stripe.android.view.CardNumberEditText
@@ -42,6 +43,7 @@
             android:layout_marginEnd="@dimen/stripe_add_card_expiry_middle_margin"
             android:layout_weight="1"
             android:hint="@string/acc_label_expiry_date"
+            style="@style/Widget.Design.TextInputLayout"
             >
 
             <com.stripe.android.view.ExpiryDateEditText
@@ -63,6 +65,7 @@
             android:layout_height="wrap_content"
             android:layout_marginEnd="@dimen/stripe_add_card_expiry_middle_margin"
             android:layout_weight="1"
+            style="@style/Widget.Design.TextInputLayout"
             >
 
             <com.stripe.android.view.CvcEditText
@@ -81,6 +84,7 @@
             android:layout_width="0dp"
             android:layout_height="wrap_content"
             android:layout_weight="1"
+            style="@style/Widget.Design.TextInputLayout"
             >
 
             <com.stripe.android.view.PostalCodeEditText

diff --git a/stripe/res/values/styles.xml b/stripe/res/values/styles.xml
@@ -35,4 +35,11 @@
     </style>
 
     <style name="Stripe.CardInputWidget.EditText" parent="Stripe.Base.CardInputWidget.EditText" />
+
+    <style name="Stripe.Base.CardInputWidget.TextInputLayout"
+        parent="Widget.Design.TextInputLayout">
+    </style>
+
+    <style name="Stripe.CardInputWidget.TextInputLayout"
+        parent="Stripe.Base.CardInputWidget.TextInputLayout" />
 </resources>