From 919341509f4ce8e3fbcb488f52dc9e5ce04c9175 Mon Sep 17 00:00:00 2001
From: Kishan_maurya <kishan.maurya@cashfree.com>
Date: Wed, 17 Jul 2024 14:05:28 +0530
Subject: [PATCH] Android Card component integration

---
 app/build.gradle                              |   2 +-
 .../java/com/cashfree/sdk_sample/Config.kt    |   4 +-
 .../java/ElementCheckoutActivity.java         |  60 ++++++
 .../res/layout/activity_element_checkout.xml  | 181 ++++++++++++++++++
 app/src/main/res/values/strings.xml           |   1 +
 settings.gradle                               |   1 +
 6 files changed, 246 insertions(+), 3 deletions(-)

diff --git a/app/build.gradle b/app/build.gradle
index 02d48d3..edae02a 100644
--- a/app/build.gradle
+++ b/app/build.gradle
@@ -64,7 +64,7 @@ dependencies {
     androidTestImplementation 'androidx.test.ext:junit:1.1.5'
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
 
-    implementation 'com.cashfree.pg:api:2.1.17'
+    implementation 'com.cashfree.pg:api:2.1.18'
 
     androidTestImplementation platform('androidx.compose:compose-bom:2022.10.00')
     androidTestImplementation 'androidx.compose.ui:ui-test-junit4'
diff --git a/app/src/main/java/com/cashfree/sdk_sample/Config.kt b/app/src/main/java/com/cashfree/sdk_sample/Config.kt
index 29f961f..8039fd2 100644
--- a/app/src/main/java/com/cashfree/sdk_sample/Config.kt
+++ b/app/src/main/java/com/cashfree/sdk_sample/Config.kt
@@ -5,8 +5,8 @@ import com.cashfree.pg.core.api.upi.CFUPI
 
 data class Config(
     // CFSession Inputs
-    val orderID: String = "order_101024392ijDpmT2x2gzR0QsELvD3gFp6X5",
-    val paymentSessionID: String = "session_XN0VD4UyE9L2iJjQ4zZG-_4aXhFYDx3S3TGwpbLK3ZcRCJEClRr1YmFmicrkl-EyGOF4Z9ybtJaa29n8zTXtcdATPlvTdpXgx9I8RbGTxuC6",
+    val orderID: String = "order_101024392jMkFaGS2z5AJMx9vxWb7reG7Wz",
+    val paymentSessionID: String = "session_R16H4Krd12PXpy767jf0BjydfGYF8SqPZEzkK7kUPPCHFCkqlNm2ucYMIAZANBkMrQpJVNq0fODJBT3TcPnKc44iYsrVbLvarjym8-M4dpXn",
     val environment: CFSession.Environment = CFSession.Environment.SANDBOX,
 
     //Card Payment Inputs
diff --git a/app/src/main/java/com/cashfree/sdk_sample/java/ElementCheckoutActivity.java b/app/src/main/java/com/cashfree/sdk_sample/java/ElementCheckoutActivity.java
index bc17533..be26b08 100644
--- a/app/src/main/java/com/cashfree/sdk_sample/java/ElementCheckoutActivity.java
+++ b/app/src/main/java/com/cashfree/sdk_sample/java/ElementCheckoutActivity.java
@@ -22,6 +22,8 @@
 import com.cashfree.pg.core.api.netbanking.CFNetBankingPayment;
 import com.cashfree.pg.core.api.paylater.CFPayLater;
 import com.cashfree.pg.core.api.paylater.CFPayLaterPayment;
+import com.cashfree.pg.core.api.ui.CFCardNumberView;
+import com.cashfree.pg.core.api.ui.ICardInfo;
 import com.cashfree.pg.core.api.upi.CFUPI;
 import com.cashfree.pg.core.api.upi.CFUPIPayment;
 import com.cashfree.pg.core.api.utils.CFErrorResponse;
@@ -30,6 +32,8 @@
 import com.cashfree.sdk_sample.Config;
 import com.cashfree.sdk_sample.R;
 
+import org.json.JSONObject;
+
 public class ElementCheckoutActivity extends AppCompatActivity implements CFCheckoutResponseCallback {
     // Go to https://docs.cashfree.com/docs/31-initiate-payment-native-checkout for the documentation
     Config config = new Config();
@@ -66,15 +70,38 @@ public class ElementCheckoutActivity extends AppCompatActivity implements CFChec
     // Net Banking mode
     private final int bankCode = config.getBankCode();
 
+    private CFCardNumberView cfElementCard;
+    private CFSession cfSession;
+
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_element_checkout);
+        cfElementCard = findViewById(R.id.cf_element_card);
         try {
             CFPaymentGatewayService.getInstance().setCheckoutCallback(this);
         } catch (CFException e) {
             e.printStackTrace();
         }
+        try {
+            cfSession = new CFSession.CFSessionBuilder()
+                    .setEnvironment(cfEnvironment)
+                    .setPaymentSessionID(paymentSessionID)
+                    .setOrderId(orderID)
+                    .build();
+        } catch (CFException e) {
+            e.printStackTrace();
+        }
+        try {
+            cfElementCard.initialize(cfSession, new ICardInfo() {
+                @Override
+                public void onInfo(JSONObject jsonObject) {
+                    Log.d("CFCARDVIEW", jsonObject.toString());
+                }
+            });
+        } catch (CFException e) {
+            e.printStackTrace();
+        }
     }
 
     @Override
@@ -134,6 +161,39 @@ public void doCardPayment(View view) {
         }
     }
 
+    public void onElementPayClick(View view) {
+        try {
+            CFCard cfCard = new CFCard.CFCardBuilder()
+                    .setCardHolderName(cardHolderName)
+                    .setCardExpiryMonth(cardMM)
+                    .setCardExpiryYear(cardYY)
+                    .setCVV(cardCVV)
+                    .setCfCard(true)
+                    .build();
+            CFTheme theme = new CFTheme.CFThemeBuilder()
+                    .setNavigationBarBackgroundColor("#6A2222")
+                    .setNavigationBarTextColor("#FFFFFF")
+                    .setButtonBackgroundColor("#6Aaaaa")
+                    .setButtonTextColor("#FFFFFF")
+                    .setPrimaryTextColor("#11385b")
+                    .setSecondaryTextColor("#808080")
+                    .build();
+            CFCardPayment cfCardPayment = new CFCardPayment.CFCardPaymentBuilder()
+                    .setSession(cfSession)
+                    .setCard(cfCard)
+                    .build();
+            cfCardPayment.setTheme(theme);
+            /**
+             * To set Loader UI before  order pay network call.
+             * This is optional for merchants. If they specially want to show UI loader then only enable it.
+             */
+            cfCardPayment.setLoaderEnable(true);
+            cfElementCard.doPayment(ElementCheckoutActivity.this, cfCardPayment);
+        } catch (CFException exception) {
+            exception.printStackTrace();
+        }
+    }
+
     public boolean hasValidCardInputs() {
         if (cardNumber.length() != 16) {
             Log.e("CARD INPUT VALIDATION", "Enter a Valid Card Number");
diff --git a/app/src/main/res/layout/activity_element_checkout.xml b/app/src/main/res/layout/activity_element_checkout.xml
index 45b2f58..786ec32 100644
--- a/app/src/main/res/layout/activity_element_checkout.xml
+++ b/app/src/main/res/layout/activity_element_checkout.xml
@@ -91,7 +91,188 @@
 
             </LinearLayout>
 
+            <com.google.android.material.card.MaterialCardView
+                android:id="@+id/element_card"
+                style="@style/Cashfree.CardView"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_below="@+id/button"
+                android:layout_margin="16dp">
+
+                <androidx.constraintlayout.widget.ConstraintLayout
+                    android:layout_width="match_parent"
+                    android:layout_height="wrap_content"
+                    android:layout_marginVertical="16dp">
+
+                    <com.cashfree.pg.core.api.ui.CFCardNumberView
+                        android:id="@+id/cf_element_card"
+                        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_marginStart="16dp"
+                        android:layout_marginTop="16dp"
+                        android:layout_marginEnd="16dp"
+                        android:hint="Card Number"
+                        app:boxBackgroundColor="@color/white"
+                        app:boxStrokeColor="@color/color_cta"
+                        app:cf_card_error_text="Enter valid card number"
+                        app:cf_card_text_size="16sp"
+                        app:errorTextColor="@color/holo_red_dark"
+                        app:helperTextTextColor="@color/color_cta"
+                        app:layout_constraintEnd_toEndOf="parent"
+                        app:layout_constraintStart_toStartOf="parent"
+                        app:layout_constraintTop_toTopOf="parent" />
+
+                    <com.google.android.material.textfield.TextInputLayout
+                        android:id="@+id/til_element_card_holder"
+                        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_marginStart="16dp"
+                        android:layout_marginTop="16dp"
+                        android:layout_marginEnd="16dp"
+                        android:hint="card holder name"
+                        app:boxBackgroundColor="@color/white"
+                        app:boxStrokeColor="@color/color_cta"
+                        app:errorTextColor="@color/holo_red_dark"
+                        app:helperTextTextColor="@color/color_cta"
+                        app:layout_constraintEnd_toEndOf="parent"
+                        app:layout_constraintStart_toStartOf="parent"
+                        app:layout_constraintTop_toBottomOf="@+id/cf_element_card">
+
+                        <com.google.android.material.textfield.TextInputEditText
+                            android:id="@+id/tie_element_card_holder"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:imeOptions="actionNext"
+                            android:inputType="textPersonName"
+                            android:maxLength="120"
+                            android:maxLines="1"
+                            android:text="KISHAN" />
+                    </com.google.android.material.textfield.TextInputLayout>
+
+                    <com.google.android.material.textfield.TextInputLayout
+                        android:id="@+id/til_element_card_mm"
+                        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
+                        android:layout_width="0dp"
+                        android:layout_height="wrap_content"
+                        android:layout_marginStart="16dp"
+                        android:layout_marginLeft="16dp"
+                        android:layout_marginTop="16dp"
+                        android:layout_marginEnd="8dp"
+                        android:layout_marginRight="8dp"
+                        android:hint="MM"
+                        app:boxBackgroundColor="@color/white"
+                        app:boxStrokeColor="@color/color_cta"
+                        app:errorTextColor="@color/holo_red_dark"
+                        app:helperTextTextColor="@color/color_cta"
+                        app:layout_constraintEnd_toStartOf="@+id/guideline3_element"
+                        app:layout_constraintStart_toStartOf="parent"
+                        app:layout_constraintTop_toBottomOf="@+id/til_element_card_holder">
+
+                        <com.google.android.material.textfield.TextInputEditText
+                            android:id="@+id/tie_element_card_mm"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:imeOptions="actionNext"
+                            android:inputType="number"
+                            android:maxLength="2"
+                            android:maxLines="1"
+                            android:text="03" />
+                    </com.google.android.material.textfield.TextInputLayout>
+
+                    <com.google.android.material.textfield.TextInputLayout
+                        android:id="@+id/til_element_card_yyyy"
+                        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
+                        android:layout_width="0dp"
+                        android:layout_height="wrap_content"
+                        android:layout_marginHorizontal="8dp"
+                        android:layout_marginTop="16dp"
+                        android:hint="YY"
+                        app:boxBackgroundColor="@color/white"
+                        app:boxStrokeColor="@color/color_cta"
+                        app:errorTextColor="@color/holo_red_dark"
+                        app:helperTextTextColor="@color/color_cta"
+                        app:layout_constraintEnd_toStartOf="@+id/guideline2_element"
+                        app:layout_constraintStart_toStartOf="@+id/guideline3_element"
+                        app:layout_constraintTop_toBottomOf="@+id/til_element_card_holder">
+
+                        <com.google.android.material.textfield.TextInputEditText
+                            android:id="@+id/tie_element_card_yyyy"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:imeOptions="actionNext"
+                            android:inputType="number"
+                            android:maxLength="2"
+                            android:maxLines="1"
+                            android:text="29" />
+                    </com.google.android.material.textfield.TextInputLayout>
+
+                    <com.google.android.material.textfield.TextInputLayout
+                        android:id="@+id/til_element_card_cvv"
+                        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
+                        android:layout_width="0dp"
+                        android:layout_height="wrap_content"
+                        android:layout_marginStart="8dp"
+                        android:layout_marginTop="16dp"
+                        android:layout_marginEnd="8dp"
+                        android:layout_marginRight="8dp"
+                        android:hint="CVV"
+                        app:boxBackgroundColor="@color/white"
+                        app:boxStrokeColor="@color/color_cta"
+                        app:errorTextColor="@color/holo_red_dark"
+                        app:helperTextTextColor="@color/color_cta"
+                        app:layout_constraintEnd_toEndOf="parent"
+                        app:layout_constraintStart_toStartOf="@+id/guideline2_element"
+                        app:layout_constraintTop_toBottomOf="@+id/til_element_card_holder">
+
+                        <com.google.android.material.textfield.TextInputEditText
+                            android:id="@+id/tie_element_card_cvv"
+                            android:layout_width="match_parent"
+                            android:layout_height="wrap_content"
+                            android:imeOptions="actionDone"
+                            android:inputType="number"
+                            android:maxLength="4"
+                            android:maxLines="1"
+                            android:text="123" />
+                    </com.google.android.material.textfield.TextInputLayout>
+
+                    <com.google.android.material.button.MaterialButton
+                        android:id="@+id/pay_element_card"
+                        android:layout_width="match_parent"
+                        android:layout_height="wrap_content"
+                        android:layout_marginHorizontal="16dp"
+                        android:layout_marginVertical="16dp"
+                        android:onClick="onElementPayClick"
+                        android:paddingVertical="12dp"
+                        android:text="Element Card Payment"
+                        app:layout_constraintBottom_toBottomOf="parent"
+                        app:layout_constraintEnd_toEndOf="parent"
+                        app:layout_constraintTop_toBottomOf="@id/til_element_card_cvv" />
+
+                    <androidx.constraintlayout.widget.Guideline
+                        android:id="@+id/guideline2_element"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:orientation="vertical"
+                        app:layout_constraintGuide_percent="0.6" />
+
+                    <androidx.constraintlayout.widget.Guideline
+                        android:id="@+id/guideline3_element"
+                        android:layout_width="wrap_content"
+                        android:layout_height="wrap_content"
+                        android:layout_marginStart="16dp"
+                        android:layout_marginLeft="16dp"
+                        android:orientation="vertical"
+                        app:layout_constraintGuide_percent="0.25" />
+
+
+                </androidx.constraintlayout.widget.ConstraintLayout>
+
+            </com.google.android.material.card.MaterialCardView>
+
 
         </RelativeLayout>
+
     </androidx.core.widget.NestedScrollView>
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index 79ac63f..ceba95e 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -4,6 +4,7 @@
     <string name="upi_collect">UPI Collect</string>
     <string name="upi_intent">UPI Intent</string>
     <string name="card">CARD</string>
+    <string name="element_card">Element CARD</string>
     <string name="card_emi">CARD EMI</string>
     <string name="netbanking">Net Banking</string>
     <string name="wallet">Wallets</string>
diff --git a/settings.gradle b/settings.gradle
index 401bfea..40c15a9 100644
--- a/settings.gradle
+++ b/settings.gradle
@@ -10,6 +10,7 @@ dependencyResolutionManagement {
     repositories {
         google()
         mavenCentral()
+        maven { url = "https://maven.cashfree.com/release" }
     }
 }
 rootProject.name = "Cashfree Android Sample"